GitHub-Proxy/Cura
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura synced 2025-08-13 05:19:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add hover effect to mode switch control

Browse Source 
While simplifying theme additions
This commit is contained in:
fieldOfView 2017-04-30 22:52:54 +02:00
parent 98aca20197
commit 0c6a5328c8
3 changed files with 41 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
resources/qml/Sidebar.qml
View File

@ -412,7 +412,7 @@ Rectangle
{ {
id: toggleLeftText id: toggleLeftText
anchors.right: modeToggleSwitch.left anchors.right: modeToggleSwitch.left
anchors.rightMargin: UM.Theme.getSize("toggle_button_text_anchoring_margin").width anchors.rightMargin: UM.Theme.getSize("default_margin").width
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
text: "" text: ""
color: UM.Theme.getColor("toggle_active_text") color: UM.Theme.getColor("toggle_active_text")
@ -438,9 +438,19 @@ Rectangle
id: modeToggleSwitch id: modeToggleSwitch
checked: false checked: false
anchors.right: toggleRightText.left anchors.right: toggleRightText.left
anchors.rightMargin: UM.Theme.getSize("toggle_button_text_anchoring_margin").width anchors.rightMargin: UM.Theme.getSize("default_margin").width
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
property alias _hovered: enableSupportMouseArea.containsMouse
MouseArea
{
id: enableSupportMouseArea
anchors.fill: parent
hoverEnabled: true
acceptedButtons: Qt.NoButton
}
onClicked: onClicked:
{ {
var index = 0; var index = 0;

30
resources/themes/cura/styles.qml
View File

@ -11,16 +11,22 @@ QtObject {
property Component toggle_button: Component { property Component toggle_button: Component {
SwitchStyle { SwitchStyle {
groove: Rectangle { groove: Rectangle {
implicitWidth: UM.Theme.getSize("toggle_button_background_implicit_size").width implicitWidth: UM.Theme.getSize("toggle_button").width
implicitHeight: UM.Theme.getSize("toggle_button_background_implicit_size").height implicitHeight: UM.Theme.getSize("toggle_button").height
radius: UM.Theme.getSize("toggle_button_radius").width radius: implicitHeight / 2
border.color: { color: {
if (control.pressed || (control.checkable && control.checked)) { if(control.hovered || control._hovered) {
return UM.Theme.getColor("sidebar_header_active"); return UM.Theme.getColor("toggle_button_hover");
} else if(control.hovered) {
return UM.Theme.getColor("sidebar_header_hover");
} else { } else {
return UM.Theme.getColor("sidebar_header_bar"); return UM.Theme.getColor("toggle_button");
}
}
Behavior on color { ColorAnimation { duration: 50; } }
border.color: {
if(control.hovered || control._hovered) {
return UM.Theme.getColor("toggle_button_border_hover");
} else {
return UM.Theme.getColor("toggle_button_border");
} }
} }
Behavior on border.color { ColorAnimation { duration: 50; } } Behavior on border.color { ColorAnimation { duration: 50; } }
@ -28,9 +34,9 @@ QtObject {
} }
handle: Rectangle { handle: Rectangle {
implicitWidth: UM.Theme.getSize("toggle_button_knob_implicit_size").width implicitWidth: implicitHeight
implicitHeight: UM.Theme.getSize("toggle_button_knob_implicit_size").height implicitHeight: UM.Theme.getSize("toggle_button").height
radius: UM.Theme.getSize("toggle_button_radius").width radius: implicitHeight / 2
color: { color: {
if (control.pressed || (control.checkable && control.checked)) { if (control.pressed || (control.checkable && control.checked)) {

17
resources/themes/cura/theme.json
View File

@ -175,6 +175,15 @@
"checkbox_mark": [24, 41, 77, 255], "checkbox_mark": [24, 41, 77, 255],
"checkbox_text": [24, 41, 77, 255], "checkbox_text": [24, 41, 77, 255],
"toggle_button": [255, 255, 255, 255],
"toggle_button_hover": [255, 255, 255, 255],
"toggle_button_border": [127, 127, 127, 255],
"toggle_button_border_hover": [12, 169, 227, 255],
"toggle_button_handle": [24, 41, 77, 255],
"toggle_button_text": [24, 41, 77, 255],
"toggle_button_text_hover": [24, 41, 77, 255],
"toggle_button_text_selected": [24, 41, 77, 255],
"tooltip": [12, 169, 227, 255], "tooltip": [12, 169, 227, 255],
"tooltip_text": [255, 255, 255, 255], "tooltip_text": [255, 255, 255, 255],
@ -301,6 +310,7 @@
"layerview_row_spacing": [0.0, 0.5], "layerview_row_spacing": [0.0, 0.5],
"checkbox": [2.0, 2.0], "checkbox": [2.0, 2.0],
"toggle_button": [2.0, 1.0],
"tooltip": [20.0, 10.0], "tooltip": [20.0, 10.0],
"tooltip_margins": [1.0, 1.0], "tooltip_margins": [1.0, 1.0],
@ -319,11 +329,6 @@
"infill_button_margin": [0.5, 0.5], "infill_button_margin": [0.5, 0.5],
"jobspecs_line": [2.0, 2.0], "jobspecs_line": [2.0, 2.0]
"toggle_button_text_anchoring_margin": [1.0, 1.0],
"toggle_button_radius": [1.0, 1.0],
"toggle_button_background_implicit_size": [2.0, 1.0],
"toggle_button_knob_implicit_size": [1.0, 1.0]
} }
} }