3D-printing/Cura
1
0
Fork 0
mirror of https://github.com/Ultimaker/Cura.git synced 2025-08-08 22:35:03 -06:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

Improve the toolbar style by modifying the rectangles and the behavior

Browse source 
to get a rounded rectangle on the right-top and right-bottom.

Contributes to CURA-5962.
This commit is contained in:
Diego Prado Gesto 2018-11-20 16:28:21 +01:00
parent 895590c3d0
commit 669648d3e1
4 changed files with 92 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

80
resources/themes/cura-light/styles.qml
View file

@ -175,11 +175,68 @@ QtObject
{
ButtonStyle
{
background: Item
background: Rectangle
{
implicitWidth: Theme.getSize("button").width;
implicitHeight: Theme.getSize("button").height;
implicitWidth: Theme.getSize("button").width
implicitHeight: Theme.getSize("button").height
color:
{
if (control.checked && control.hovered)
{
return Theme.getColor("toolbar_button_active_hover")
}
else if (control.checked)
{
return Theme.getColor("toolbar_button_active")
}
else if(control.hovered)
{
return Theme.getColor("toolbar_button_hover")
}
return Theme.getColor("toolbar_background")
}
radius: UM.Theme.getSize("default_radius").width
Rectangle
{
id: topSquare
anchors
{
left: parent.left
right: parent.right
top: parent.top
}
height: parent.radius
color: control.isFirstElement ? "transparent" : parent.color
}
Rectangle
{
id: bottomSquare
anchors
{
left: parent.left
right: parent.right
bottom: parent.bottom
}
height: parent.radius
color: control.isLastElement ? "transparent" : parent.color
}
Rectangle
{
id: leftSquare
anchors
{
left: parent.left
top: parent.top
bottom: parent.bottom
}
width: parent.radius
color: parent.color
}
// This is the tooltip
UM.PointingRectangle
{
id: button_tooltip
@ -223,22 +280,7 @@ QtObject
source: control.iconSource;
width: Theme.getSize("button_icon").width;
height: Theme.getSize("button_icon").height;
color:
{
if (control.checked && control.hovered)
{
return Theme.getColor("toolbar_button_text_active_hover");
}
else if (control.checked)
{
return Theme.getColor("toolbar_button_text_active");
}
else if(control.hovered)
{
return Theme.getColor("toolbar_button_text_hover");
}
return Theme.getColor("toolbar_button_text");
}
color: Theme.getColor("toolbar_button_text");
sourceSize: Theme.getSize("button_icon")
}

6
resources/themes/cura-light/theme.json
View file

@ -123,9 +123,9 @@
"warning": [255, 190, 35, 255],
"toolbar_button_text": [10, 8, 80, 255],
"toolbar_button_text_hover": [50, 130, 255, 255],
"toolbar_button_text_active": [50, 130, 255, 255],
"toolbar_button_text_active_hover": [50, 130, 255, 255],
"toolbar_button_hover": [232, 242, 252, 255],
"toolbar_button_active": [232, 242, 252, 255],
"toolbar_button_active_hover": [232, 242, 252, 255],
"button": [31, 36, 39, 255],
"button_hover": [68, 72, 75, 255],