Warning, /utilities/kclock/src/kclock/qml/components/TimePickerSpinBox.qml is written in an unsupported language. File is not indexed.
0001 // SPDX-FileCopyrightText: 2021 Devin Lin <devin@kde.org> 0002 // SPDX-License-Identifier: GPL-2.0-or-later 0003 0004 import QtQuick 0005 import QtQuick.Controls 0006 import QtQuick.Window 0007 import QtQuick.Layouts 0008 import QtQuick.Templates as T 0009 0010 import org.kde.kirigami as Kirigami 0011 0012 Item { 0013 id: root 0014 property alias from: spinBox.from 0015 property alias to: spinBox.to 0016 property alias value: spinBox.value 0017 0018 signal valueModified() 0019 0020 T.SpinBox { 0021 id: spinBox 0022 visible: false 0023 stepSize: 1 0024 0025 onValueModified: root.valueModified() 0026 0027 validator: IntValidator { 0028 locale: spinBox.locale.name 0029 bottom: Math.min(spinBox.from, spinBox.to) 0030 top: Math.max(spinBox.from, spinBox.to) 0031 } 0032 } 0033 0034 Kirigami.Theme.colorSet: Kirigami.Theme.Button 0035 Kirigami.Theme.inherit: false 0036 0037 implicitWidth: Kirigami.Units.gridUnit * 4 0038 implicitHeight: column.implicitHeight 0039 0040 readonly property color buttonColor: Kirigami.Theme.backgroundColor 0041 readonly property color buttonHoverColor: Qt.darker(buttonColor, 1.05) 0042 readonly property color buttonPressedColor: Qt.darker(buttonColor, 1.2) 0043 readonly property color buttonBorderColor: Qt.alpha(Kirigami.Theme.textColor, 0.3) 0044 0045 ColumnLayout { 0046 id: column 0047 spacing: 0 0048 anchors.top: parent.top 0049 anchors.left: parent.left 0050 anchors.right: parent.right 0051 0052 TimePickerSpinBoxButton { 0053 Layout.fillWidth: true 0054 onClicked: { 0055 spinBox.increase(); 0056 spinBox.valueModified(); 0057 } 0058 icon.name: 'list-add-symbolic' 0059 isStart: true 0060 isEnd: false 0061 enabled: spinBox.value < spinBox.to 0062 } 0063 0064 Rectangle { 0065 Layout.fillWidth: true 0066 implicitHeight: textInput.implicitHeight 0067 0068 Kirigami.Theme.inherit: false 0069 Kirigami.Theme.colorSet: Kirigami.Theme.Button 0070 color: Kirigami.Theme.backgroundColor 0071 0072 Rectangle { 0073 width: 1 0074 anchors.left: parent.left 0075 anchors.top: parent.top 0076 anchors.bottom: parent.bottom 0077 color: Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.15) 0078 } 0079 0080 Rectangle { 0081 width: 1 0082 anchors.right: parent.right 0083 anchors.top: parent.top 0084 anchors.bottom: parent.bottom 0085 color: Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.15) 0086 } 0087 0088 0089 MouseArea { 0090 anchors.fill: parent 0091 propagateComposedEvents: true 0092 property int wheelDelta: 0 0093 0094 onExited: wheelDelta = 0 0095 onWheel: { 0096 wheelDelta += wheel.angleDelta.y; 0097 // magic number 120 for common "one click" 0098 // See: http://qt-project.org/doc/qt-5/qml-qtquick-wheelevent.html#angleDelta-prop 0099 while (wheelDelta >= 120) { 0100 wheelDelta -= 120; 0101 spinBox.increase(); 0102 spinBox.valueModified(); 0103 } 0104 while (wheelDelta <= -120) { 0105 wheelDelta += 120; 0106 spinBox.decrease(); 0107 spinBox.valueModified(); 0108 } 0109 } 0110 0111 // Normally the TextInput does this automatically, but the MouseArea on 0112 // top of it blocks that behavior, so we need to explicitly do it here 0113 cursorShape: Qt.IBeamCursor 0114 0115 TextInput { 0116 id: textInput 0117 anchors.top: parent.top 0118 anchors.left: parent.left 0119 anchors.right: parent.right 0120 font.pointSize: Math.round(Kirigami.Theme.defaultFont.pointSize * 2.5) 0121 font.weight: Font.Light 0122 0123 color: Kirigami.Theme.textColor 0124 selectionColor: Kirigami.Theme.highlightColor 0125 selectedTextColor: Kirigami.Theme.highlightedTextColor 0126 selectByMouse: true 0127 horizontalAlignment: Qt.AlignHCenter 0128 verticalAlignment: Qt.AlignVCenter 0129 0130 inputMethodHints: Qt.ImhFormattedNumbersOnly 0131 0132 function applyTextBinding() { 0133 text = Qt.binding(function () { return spinBox.displayText.padStart(2, '0') }); 0134 } 0135 0136 Component.onCompleted: applyTextBinding() 0137 onEditingFinished: { 0138 spinBox.value = parseInt(text); 0139 spinBox.valueModified(); 0140 applyTextBinding(); 0141 } 0142 } 0143 } 0144 } 0145 0146 TimePickerSpinBoxButton { 0147 Layout.fillWidth: true 0148 onClicked: { 0149 spinBox.decrease(); 0150 spinBox.valueModified(); 0151 } 0152 icon.name: 'list-remove-symbolic' 0153 isStart: false 0154 isEnd: true 0155 enabled: spinBox.value > spinBox.from 0156 } 0157 } 0158 }