templates/RangeSlider.qml


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
99
100
101
102
103
104
105
106
107
108
109
110
111
112

import QtQuick
import QtQuick.Controls.impl
import QtQuick.Templates as T

T.RangeSlider {
    id: control

    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
                            first.implicitHandleWidth + leftPadding + rightPadding,
                            second.implicitHandleWidth + leftPadding + rightPadding)
    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
                             first.implicitHandleHeight + topPadding + bottomPadding,
                             second.implicitHandleHeight + topPadding + bottomPadding)

    topPadding: horizontal ? config.topPadding : config.leftPadding || 0
    leftPadding: horizontal ? config.leftPadding : config.bottomPadding || 0
    rightPadding: horizontal ? config.rightPadding : config.topPadding || 0
    bottomPadding: horizontal ? config.bottomPadding : config.rightPadding || 0

    property string __controlState: [
        !control.enabled && "disabled",
        control.enabled && control.hovered && !(first.pressed || second.pressed) && "hovered",
    ].filter(Boolean).join("_") || "normal"

    readonly property var config: Config.controls.rangeslider[__controlState] || {}

    property string __firstHandleState: [
        first.hovered && !first.pressed && "hovered",
        first.pressed && "handle_pressed",
    ].filter(Boolean).join("_") || "normal"
    readonly property var firstHandleConfig: Config.controls.rangeslider[__firstHandleState] || {}

    property string __secondHandleState: [
        second.hovered && !second.pressed && "hovered",
        second.pressed && "handle_pressed",
    ].filter(Boolean).join("_") || "normal"
    readonly property var secondHandleConfig: Config.controls.rangeslider[__secondHandleState] || {}

    first.handle: StyleImage {
        x: Math.round(control.leftPadding + (control.horizontal
            ? control.first.visualPosition * (control.availableWidth - width)
            : (control.availableWidth - width) / 2))
        y: Math.round(control.topPadding + (control.horizontal
            ? (control.availableHeight - height) / 2
            : control.first.visualPosition * (control.availableHeight - height)))

        imageConfig: control.firstHandleConfig.first_handle
    }

    second.handle: StyleImage {
        x: Math.round(control.leftPadding + (control.horizontal
            ? control.second.visualPosition * (control.availableWidth - width)
            : (control.availableWidth - width) / 2))
        y: Math.round(control.topPadding + (control.horizontal
            ? (control.availableHeight - height) / 2
            : control.second.visualPosition * (control.availableHeight - height)))

        imageConfig: control.secondHandleConfig.second_handle
    }

    background: Item {
        implicitWidth: control.horizontal
            ? (_background.implicitWidth || _background.groove.implicitWidth)
            : (_background.implicitHeight || _background.groove.implicitHeight)
        implicitHeight: control.horizontal
            ? (_background.implicitHeight || _background.groove.implicitHeight)
            : (_background.implicitWidth || _background.groove.implicitWidth)

        property Item _background: StyleImage {
            parent: control.background
            anchors.fill: parent
            imageConfig: control.config.background

            property Item groove: StyleImage {
                parent: control.background._background
                x: control.leftPadding - control.leftInset + (control.horizontal
                    ? control.first.handle.width / 2
                    : (control.availableWidth - width) / 2)
                y: control.topPadding - control.rightInset + (control.horizontal
                    ? ((control.availableHeight - height) / 2)
                    : control.first.handle.height / 2)

                width: control.horizontal
                    ? control.availableWidth
                        - (control.first.handle.width / 2) - (control.second.handle.width / 2)
                    : implicitWidth
                height: control.horizontal
                    ? implicitHeight
                    : control.availableHeight
                        - (control.first.handle.width / 2) - (control.second.handle.width / 2)
                imageConfig: control.config.groove
                horizontal: control.horizontal

                property Item track: StyleImage {
                    parent: control.background._background.groove
                    x: horizontal ? parent.width * control.first.position : 0
                    y: horizontal ? 0 : parent.height - (parent.height * control.second.position)
                    width: horizontal
                        ? parent.width * (control.second.position - control.first.position)
                        : parent.width
                    height: horizontal
                        ? parent.height
                        : parent.height * (control.second.position - control.first.position)
                    imageConfig: control.config.track
                    horizontal: control.horizontal
                    minimumWidth: 0
                    minimumHeight: 0
                }
            }
        }
    }
}