maui/nomad-style/RangeSlider.qml

0001 /*
0002  * Copyright 2017 Marco Martin <mart@kde.org>
0003  * Copyright 2017 The Qt Company Ltd.
0004  *
0005  * GNU Lesser General Public License Usage
0006  * Alternatively, this file may be used under the terms of the GNU Lesser
0007  * General Public License version 3 as published by the Free Software
0008  * Foundation and appearing in the file LICENSE.LGPLv3 included in the
0009  * packaging of this file. Please review the following information to
0010  * ensure the GNU Lesser General Public License version 3 requirements
0011  * will be met: https://www.gnu.org/licenses/lgpl.html.
0012  *
0013  * GNU General Public License Usage
0014  * Alternatively, this file may be used under the terms of the GNU
0015  * General Public License version 2.0 or later as published by the Free
0016  * Software Foundation and appearing in the file LICENSE.GPL included in
0017  * the packaging of this file. Please review the following information to
0018  * ensure the GNU General Public License version 2.0 requirements will be
0019  * met: http://www.gnu.org/licenses/gpl-2.0.html.
0020  */
0021
0022
0023 import QtQuick 2.6
0024 import QtQuick.Controls 2.3
0025 import QtQuick.Templates 2.3 as T
0026 import org.kde.kirigami 2.2 as Kirigami
0027
0028 T.RangeSlider {
0029     id: control
0030
0031     implicitWidth: Math.max(background ? background.implicitWidth : 0,
0032         Math.max(first.handle ? first.handle.implicitWidth : 0,
0033                  second.handle ? second.handle.implicitWidth : 0) + leftPadding + rightPadding)
0034     implicitHeight: Math.max(background ? background.implicitHeight : 0,
0035         Math.max(first.handle ? first.handle.implicitHeight : 0,
0036                  second.handle ? second.handle.implicitHeight : 0) + topPadding + bottomPadding)
0037
0038     padding: 6
0039
0040     first.handle: Rectangle {
0041         property bool horizontal: control.orientation === Qt.Horizontal
0042         x: control.leftPadding + (horizontal ? control.first.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
0043         y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : control.first.visualPosition * (control.availableHeight - height))
0044         implicitWidth: 18
0045         implicitHeight: 18
0046         radius: width / 2
0047         property color borderColor: Kirigami.Theme.textColor
0048         border.color: control.activeFocus ? Kirigami.Theme.highlightColor : Qt.rgba(borderColor.r, borderColor.g, borderColor.b, 0.3)
0049         color: Kirigami.Theme.backgroundColor
0050         Rectangle {
0051             z: -1
0052             x: 1
0053             y: 1
0054             width: parent.width
0055             height: parent.height
0056             radius: width / 2
0057             color: Qt.rgba(0, 0, 0, 0.15)
0058         }
0059     }
0060
0061     second.handle: Rectangle {
0062         property bool horizontal: control.orientation === Qt.Horizontal
0063         x: control.leftPadding + (horizontal ? control.second.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
0064         y: control.topPadding + (horizontal ? (control.availableHeight - height) / 2 : control.second.visualPosition * (control.availableHeight - height))
0065         implicitWidth: 18
0066         implicitHeight: 18
0067         radius: width / 2
0068         property color borderColor: Kirigami.Theme.textColor
0069         border.color: control.activeFocus ? Kirigami.Theme.highlightColor : Qt.rgba(borderColor.r, borderColor.g, borderColor.b, 0.3)
0070         color: Kirigami.Theme.backgroundColor
0071         Rectangle {
0072             z: -1
0073             x: 1
0074             y: 1
0075             width: parent.width
0076             height: parent.height
0077             radius: width / 2
0078             color: Qt.rgba(0, 0, 0, 0.15)
0079         }
0080     }
0081
0082     background: Rectangle {
0083         readonly property bool horizontal: control.orientation === Qt.Horizontal
0084         implicitWidth: horizontal ? 200 : 6
0085         implicitHeight: horizontal ? 6 : 200
0086         width: horizontal ? control.availableWidth : implicitWidth
0087         height: horizontal ? implicitHeight : control.availableHeight
0088         radius: Math.round(Math.min(width/2, height/2))
0089         property color bgColor: Kirigami.Theme.textColor
0090         color: Qt.rgba(bgColor.r, bgColor.g, bgColor.b, 0.3)
0091         anchors.centerIn: parent
0092
0093         Rectangle {
0094             x: parent.horizontal ? control.first.position * parent.width : 0
0095             y: parent.horizontal ? 0 : control.second.visualPosition * parent.height + 6
0096             width: parent.horizontal ? control.second.position * parent.width - control.first.position * parent.width - 6 : 6
0097             height: parent.horizontal ? 6 : control.second.position * parent.height - control.first.position * parent.height - 6
0098             color: Kirigami.Theme.highlightColor
0099         }
0100     }
0101 }