components/controls/StyledSlider.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

import qs.components
import qs.config
import qs.services
import QtQuick.Controls
import QtQuick

Slider {
    id: slider

    background: Item {
        StyledRect {
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            anchors.left: parent.left
            anchors.topMargin: slider.implicitHeight / 3
            anchors.bottomMargin: slider.implicitHeight / 3

            implicitWidth: slider.handle.x - slider.implicitHeight / 6

            color: Colours.palette.m3primary
            radius: Appearance.rounding.full
            topRightRadius: slider.implicitHeight / 15
            bottomRightRadius: slider.implicitHeight / 15
        }

        StyledRect {
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            anchors.right: parent.right
            anchors.topMargin: slider.implicitHeight / 3
            anchors.bottomMargin: slider.implicitHeight / 3

            implicitWidth: parent.width - slider.handle.x - slider.handle.implicitWidth - slider.implicitHeight / 6

            color: Colours.palette.m3surfaceContainer
            radius: Appearance.rounding.full
            topLeftRadius: slider.implicitHeight / 15
            bottomLeftRadius: slider.implicitHeight / 15
        }
    }

    handle: StyledRect {
        id: rect

        x: slider.visualPosition * slider.availableWidth

        implicitWidth: slider.implicitHeight / 4.5
        implicitHeight: slider.implicitHeight

        color: Colours.palette.m3primary
        radius: Appearance.rounding.full

        MouseArea {
            anchors.fill: parent
            cursorShape: Qt.PointingHandCursor
            onPressed: event => event.accepted = false
        }
    }
}