diff options
| author | Paweł Gronowski <a4b8231fbf6d87ff4c04@woland.xyz> | 2020-03-06 19:33:07 +0100 |
|---|---|---|
| committer | Paweł Gronowski <a4b8231fbf6d87ff4c04@woland.xyz> | 2020-03-17 14:47:21 +0100 |
| commit | 9bfe2ad59977e6bcde18e03d7cb32ac701d6e883 (patch) | |
| tree | c9effe0d644f36eec14185cdc3b411200c11a386 /src/imports/controls | |
| parent | a73b19daa8ef0e3feb2ee21f9d1e7bc77801636c (diff) | |
Material: Make Slider's track accent colored and semi-transparent
According to the Material Design guidelines Slider's track should be
accent colored and semi-transparent. Additionally it should be a bit
thicker. The original ticket in the bug tracker mentions it to be 2px
2px but I think that the 4px makes it look a lot more like the one
presented in the guidelines (https://material.io/components/sliders/).
Task-number: QTBUG-70768
Fixes: QTBUG-70768
Change-Id: I062c0938297ae877b37605b6d536e11b464d477f
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
Diffstat (limited to 'src/imports/controls')
| -rw-r--r-- | src/imports/controls/material/Slider.qml | 11 |
1 files changed, 6 insertions, 5 deletions
diff --git a/src/imports/controls/material/Slider.qml b/src/imports/controls/material/Slider.qml index 8c1ef12e..ac7a0c42 100644 --- a/src/imports/controls/material/Slider.qml +++ b/src/imports/controls/material/Slider.qml @@ -36,6 +36,7 @@ import QtQuick 2.12 import QtQuick.Templates 2.12 as T +import QtQuick.Controls.impl 2.12 import QtQuick.Controls.Material 2.12 import QtQuick.Controls.Material.impl 2.12 @@ -63,16 +64,16 @@ T.Slider { y: control.topPadding + (control.horizontal ? (control.availableHeight - height) / 2 : 0) implicitWidth: control.horizontal ? 200 : 48 implicitHeight: control.horizontal ? 48 : 200 - width: control.horizontal ? control.availableWidth : 1 - height: control.horizontal ? 1 : control.availableHeight + width: control.horizontal ? control.availableWidth : 4 + height: control.horizontal ? 4 : control.availableHeight scale: control.horizontal && control.mirrored ? -1 : 1 - color: control.enabled ? control.Material.foreground : control.Material.sliderDisabledColor + color: control.enabled ? Color.transparent(control.Material.accentColor, 0.33) : control.Material.sliderDisabledColor Rectangle { x: control.horizontal ? 0 : (parent.width - width) / 2 y: control.horizontal ? (parent.height - height) / 2 : control.visualPosition * parent.height - width: control.horizontal ? control.position * parent.width : 3 - height: control.horizontal ? 3 : control.position * parent.height + width: control.horizontal ? control.position * parent.width : 4 + height: control.horizontal ? 4 : control.position * parent.height color: control.enabled ? control.Material.accentColor : control.Material.sliderDisabledColor } |