Simlpified Slider (not totally working; position is off)

This commit is contained in:
Zach Fox 2019-05-13 15:58:04 -07:00
parent f799f96fba
commit 7bb2d6871b
2 changed files with 40 additions and 26 deletions

View file

@ -52,14 +52,24 @@ QtObject {
}
}
readonly property QtObject handle: QtObject {
readonly property color border: "#000000"
readonly property color disabledBorder: "#2A2A2A"
readonly property color enabledBorder: "#00B4EF"
readonly property QtObject disabled: QtObject {
readonly property color start: "#2A2A2A"
readonly property color finish: "#2A2A2A"
}
readonly property QtObject normal: QtObject {
readonly property color start: "#828282"
readonly property color finish: "#6A6A6A"
}
readonly property QtObject hover: QtObject {
readonly property color start: "#48C7F4"
readonly property color finish: "#48C7F4"
}
readonly property QtObject pressed: QtObject {
readonly property color start: "#6A6A6A"
readonly property color finish: "#828282"
readonly property color start: "#48C7F4"
readonly property color finish: "#48C7F4"
readonly property color border: "#00B4EF"
}
}
}
@ -160,7 +170,7 @@ QtObject {
readonly property QtObject sizes: QtObject {
readonly property QtObject controls: QtObject {
readonly property QtObject slider: QtObject {
readonly property int height: 14
readonly property int height: 16
readonly property int labelTextSize: 14
readonly property int backgroundHeight: 8
}

View file

@ -53,6 +53,7 @@ Item {
width: root.width * 0.6
enabled: root.enabled
anchors.right: parent.right
anchors.rightMargin: sliderHandle.width / 2
anchors.verticalCenter: parent.verticalCenter
onPressedChanged: {
@ -76,7 +77,7 @@ Item {
color: simplifiedUI.colors.controls.slider.background.empty
Rectangle {
width: sliderControl.visualPosition * sliderControl.width
width: sliderControl.visualPosition * sliderBackground.width
height: parent.height
radius: height / 2
gradient: Gradient {
@ -87,35 +88,38 @@ Item {
}
handle: Rectangle {
visible: root.enabled
id: sliderHandle
width: sliderControl.height
height: sliderControl.height
x: sliderControl.visualPosition * (sliderControl.width - width)
height: width
x: sliderControl.visualPosition * (sliderBackground.width - (sliderHandle.width / 2))
y: sliderControl.height / 2 - height / 2
radius: height / 2
gradient: Gradient {
GradientStop {
position: 0.0
color: sliderControl.pressed
? (simplifiedUI.colors.controls.slider.handle.pressed.start)
: (simplifiedUI.colors.controls.slider.handle.normal.start)
}
GradientStop {
position: 1.0
color: sliderControl.pressed
? (simplifiedUI.colors.controls.slider.handle.pressed.finish)
: (simplifiedUI.colors.controls.slider.handle.normal.finish)
}
}
color: "#000000"
border.width: 1
border.color: sliderControl.hovered || sliderControl.pressed ? simplifiedUI.colors.controls.slider.handle.enabledBorder : simplifiedUI.colors.controls.slider.handle.disabledBorder
Rectangle {
height: parent.height - 2
visible: root.enabled
height: sliderControl.pressed ? parent.height : parent.height - 4
width: height
radius: height / 2
anchors.centerIn: parent
color: "transparent"
border.width: 1
border.color: simplifiedUI.colors.controls.slider.handle.border
gradient: Gradient {
GradientStop {
position: 0.2
color: sliderControl.enabled ? (sliderControl.hovered ? simplifiedUI.colors.controls.slider.handle.hover.start :
(sliderControl.pressed
? (simplifiedUI.colors.controls.slider.handle.pressed.start)
: (simplifiedUI.colors.controls.slider.handle.normal.start))) : simplifiedUI.colors.controls.slider.handle.disabled.start
}
GradientStop {
position: 1.0
color: sliderControl.enabled ? (sliderControl.hovered ? simplifiedUI.colors.controls.slider.handle.hover.finish :
(sliderControl.pressed
? (simplifiedUI.colors.controls.slider.handle.pressed.finish)
: (simplifiedUI.colors.controls.slider.handle.normal.finish))) : simplifiedUI.colors.controls.slider.handle.disabled.finish
}
}
}
}
}