Merge branch 'fix_hover_effects' of https://github.com/fieldOfView/Cura

This commit is contained in:
Jaime van Kessel 2017-05-02 09:40:08 +02:00
commit 2bc4355f00
4 changed files with 81 additions and 26 deletions

View File

@ -408,18 +408,34 @@ Rectangle
}
ExclusiveGroup { id: modeMenuGroup; }
Text
Label
{
id: toggleLeftText
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
text: ""
color: UM.Theme.getColor("toggle_active_text")
color:
{
if(toggleLeftTextMouseArea.containsMouse)
{
return UM.Theme.getColor("mode_switch_text_hover");
}
else if(!modeToggleSwitch.checked)
{
return UM.Theme.getColor("mode_switch_text_checked");
}
else
{
return UM.Theme.getColor("mode_switch_text");
}
}
font: UM.Theme.getFont("default")
MouseArea
{
id: toggleLeftTextMouseArea
hoverEnabled: true
anchors.fill: parent
onClicked:
{
@ -438,9 +454,19 @@ Rectangle
id: modeToggleSwitch
checked: false
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
property bool _hovered: modeToggleSwitchMouseArea.containsMouse || toggleLeftTextMouseArea.containsMouse || toggleRightTextMouseArea.containsMouse
MouseArea
{
id: modeToggleSwitchMouseArea
anchors.fill: parent
hoverEnabled: true
acceptedButtons: Qt.NoButton
}
onClicked:
{
var index = 0;
@ -457,20 +483,36 @@ Rectangle
UM.Preferences.setValue("cura/active_mode", index);
}
style: UM.Theme.styles.toggle_button
style: UM.Theme.styles.mode_switch
}
Text
Label
{
id: toggleRightText
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
text: ""
color: UM.Theme.getColor("toggle_active_text")
color:
{
if(toggleRightTextMouseArea.containsMouse)
{
return UM.Theme.getColor("mode_switch_text_hover");
}
else if(modeToggleSwitch.checked)
{
return UM.Theme.getColor("mode_switch_text_checked");
}
else
{
return UM.Theme.getColor("mode_switch_text");
}
}
font: UM.Theme.getFont("default")
MouseArea
{
id: toggleRightTextMouseArea
hoverEnabled: true
anchors.fill: parent
onClicked:
{

View File

@ -240,6 +240,8 @@ Item
CheckBox
{
id: enableSupportCheckBox
property alias _hovered: enableSupportMouseArea.containsMouse
anchors.top: parent.top
anchors.left: enableSupportLabel.right
anchors.leftMargin: UM.Theme.getSize("default_margin").width

View File

@ -8,19 +8,25 @@ import QtQuick.Controls.Styles 1.1
import UM 1.1 as UM
QtObject {
property Component toggle_button: Component {
property Component mode_switch: Component {
SwitchStyle {
groove: Rectangle {
implicitWidth: UM.Theme.getSize("toggle_button_background_implicit_size").width
implicitHeight: UM.Theme.getSize("toggle_button_background_implicit_size").height
radius: UM.Theme.getSize("toggle_button_radius").width
border.color: {
if (control.pressed || (control.checkable && control.checked)) {
return UM.Theme.getColor("sidebar_header_active");
} else if(control.hovered) {
return UM.Theme.getColor("sidebar_header_hover");
implicitWidth: UM.Theme.getSize("mode_switch").width
implicitHeight: UM.Theme.getSize("mode_switch").height
radius: implicitHeight / 2
color: {
if(control.hovered || control._hovered) {
return UM.Theme.getColor("mode_switch_hover");
} else {
return UM.Theme.getColor("sidebar_header_bar");
return UM.Theme.getColor("mode_switch");
}
}
Behavior on color { ColorAnimation { duration: 50; } }
border.color: {
if(control.hovered || control._hovered) {
return UM.Theme.getColor("mode_switch_border_hover");
} else {
return UM.Theme.getColor("mode_switch_border");
}
}
Behavior on border.color { ColorAnimation { duration: 50; } }
@ -28,9 +34,9 @@ QtObject {
}
handle: Rectangle {
implicitWidth: UM.Theme.getSize("toggle_button_knob_implicit_size").width
implicitHeight: UM.Theme.getSize("toggle_button_knob_implicit_size").height
radius: UM.Theme.getSize("toggle_button_radius").width
implicitWidth: implicitHeight
implicitHeight: UM.Theme.getSize("mode_switch").height
radius: implicitHeight / 2
color: {
if (control.pressed || (control.checkable && control.checked)) {

View File

@ -175,6 +175,15 @@
"checkbox_mark": [24, 41, 77, 255],
"checkbox_text": [24, 41, 77, 255],
"mode_switch": [255, 255, 255, 255],
"mode_switch_hover": [255, 255, 255, 255],
"mode_switch_border": [127, 127, 127, 255],
"mode_switch_border_hover": [12, 169, 227, 255],
"mode_switch_handle": [24, 41, 77, 255],
"mode_switch_text": [24, 41, 77, 255],
"mode_switch_text_hover": [24, 41, 77, 255],
"mode_switch_text_checked": [12, 169, 227, 255],
"tooltip": [12, 169, 227, 255],
"tooltip_text": [255, 255, 255, 255],
@ -301,6 +310,7 @@
"layerview_row_spacing": [0.0, 0.5],
"checkbox": [2.0, 2.0],
"mode_switch": [2.0, 1.0],
"tooltip": [20.0, 10.0],
"tooltip_margins": [1.0, 1.0],
@ -319,11 +329,6 @@
"infill_button_margin": [0.5, 0.5],
"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]
"jobspecs_line": [2.0, 2.0]
}
}