blob: 17fd8cda8fa28870d3905e7d1e9c733e55daa0b7 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
|
import QtQuick 2.0
Item {
id: slider
height: handleBack.height
// value is read/write.
property real value: 0
property real maximum: 1
property real minimum: 0
property int xMax: width - handle.width
onXMaxChanged: updatePos()
onMinimumChanged: updatePos()
onValueChanged: if (!pressed) updatePos()
property bool mutable: true
property alias pressed : backgroundMouse.pressed
signal valueChangedByHandle(int newValue)
function updatePos() {
if (maximum > minimum) {
var pos = 0 + (value - minimum) * slider.xMax / (maximum - minimum);
pos = Math.min(pos, width - handle.width - 0);
pos = Math.max(pos, 0);
handle.x = pos;
} else {
handle.x = 0;
}
}
Rectangle {
id: background
width: slider.width
anchors.verticalCenter: slider.verticalCenter
height: 2
color: "#666666"
MouseArea {
id: backgroundMouse
anchors.fill: parent
anchors.topMargin: -24
anchors.bottomMargin: -24
enabled: slider.mutable
drag.target: handle
drag.axis: Drag.XAxis
drag.minimumX: 0
drag.maximumX: slider.xMax
onPressedChanged: {
value = Math.max(minimum, Math.min(maximum, (maximum - minimum) * (mouseX - handle.width/2) / slider.xMax + minimum));
valueChangedByHandle(value);
updatePos();
}
onPositionChanged: {
value = Math.max(minimum, Math.min(maximum, (maximum - minimum) * (mouseX - handle.width/2) / slider.xMax + minimum));
valueChangedByHandle(value);
}
onWheel: {
value = Math.max(minimum, Math.min(maximum, value + (wheel.angleDelta.y > 0 ? 1 : -1) * (10 / slider.xMax) * (slider.maximum - slider.minimum)));
valueChangedByHandle(value);
updatePos();
}
}
}
Rectangle {
id: progress
height: 5
anchors.verticalCenter: background.verticalCenter
anchors.left: background.left
anchors.right: handle.right
anchors.rightMargin: handle.width / 2
visible: slider.enabled
color: "#98c66c"
}
Rectangle {
id: handleBack
width: 40
height: width
radius: width / 2
color: "#8898c66c"
antialiasing: true
anchors.centerIn: handle
visible: handle.visible
}
Rectangle {
id: handle
width: 14
height: width
radius: width / 2
antialiasing: true
color: "#98c66c"
anchors.verticalCenter: background.verticalCenter
visible: slider.enabled
}
}
|
