src/core/GCRangeSlider.qml

0001 /* GCompris - GCRangeSlider.qml
0002  *
0003  * SPDX-FileCopyrightText: 2023 Timothée Giet <animtim@gmail.com>
0004  *
0005  * Authors:
0006  *   Timothée Giet <animtim@gmail.com>
0007  *
0008  *   SPDX-License-Identifier: GPL-3.0-or-later
0009  */
0010 import QtQuick 2.12
0011 import QtQuick.Controls 2.12
0012 import GCompris 1.0
0013
0014 /**
0015   * A RangeSlider component with GCompris' style.
0016   * @ingroup components
0017   *
0018   * @inherit QtQuick.Controls.RangeSlider
0019   */
0020 RangeSlider {
0021     id: control
0022     focusPolicy: Qt.NoFocus
0023     snapMode: Slider.SnapAlways
0024     stepSize: 1
0025
0026     background: Rectangle {
0027         x: control.leftPadding
0028         y: control.topPadding + control.availableHeight / 2 - height / 2
0029         radius: height / 2
0030         width: control.availableWidth
0031         height: implicitHeight
0032         implicitWidth: 250 * ApplicationInfo.ratio
0033         implicitHeight: 8 * ApplicationInfo.ratio
0034         anchors.verticalCenter: parent.verticalCenter
0035         border.width: 1
0036         border.color: "#888"
0037         gradient: Gradient {
0038             GradientStop { color: "#bbb" ; position: 0 }
0039             GradientStop { color: "#ccc" ; position: 0.6 }
0040             GradientStop { color: "#ccc" ; position: 1 }
0041         }
0042
0043         Rectangle {
0044             x: control.first.visualPosition * parent.width
0045             width: control.second.visualPosition * parent.width - x
0046             height: parent.height
0047             border.color: Qt.darker("#f8d600", 1.2)
0048             radius: height/2
0049             gradient: Gradient {
0050                 GradientStop { color: "#ffe85c"; position: 0 }
0051                 GradientStop { color: "#f8d600"; position: 1.4 }
0052             }
0053         }
0054     }
0055 }