3D-printing/Cura
1
0
Fork 0
mirror of https://github.com/Ultimaker/Cura.git synced 2025-11-02 20:52:20 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Change the color of a circle around the toolbar button

Browse source 
Instead of changing the color of the entire tool when it is hovered or selected, now a background circle will be drawn and its color will change according to whether the button is hovered/selected or not.

In addition, the button icons will now be half the size of the button itself.

CURA-8013
This commit is contained in:
Konstantinos Karmas 2021-06-28 14:56:26 +02:00
parent eeccfc32b9
commit 77a8f36153
2 changed files with 25 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

2
resources/qml/Toolbar.qml
View file

@ -68,7 +68,7 @@ Item
source: UM.Theme.getIcon(model.icon) != "" ? UM.Theme.getIcon(model.icon) : "file:///" + model.location + "/" + model.icon
color: UM.Theme.getColor("icon")
sourceSize: UM.Theme.getSize("button_icon")
sourceSize: Math.round(UM.Theme.getSize("button") / 2)
}
onCheckedChanged:

44
resources/qml/ToolbarButton.qml
View file

@ -25,22 +25,7 @@ Button
{
implicitWidth: UM.Theme.getSize("button").width
implicitHeight: UM.Theme.getSize("button").height
color:
{
if (base.checked && base.hovered)
{
return UM.Theme.getColor("toolbar_button_active_hover")
}
else if (base.checked)
{
return UM.Theme.getColor("toolbar_button_active")
}
else if(base.hovered)
{
return UM.Theme.getColor("toolbar_button_hover")
}
return UM.Theme.getColor("toolbar_background")
}
color: UM.Theme.getColor("toolbar_background")
radius: UM.Theme.getSize("default_radius").width
Rectangle
@ -84,16 +69,35 @@ Button
color: parent.color
}
}
contentItem: Item
contentItem: Rectangle
{
opacity: parent.enabled ? 1.0 : 0.2
implicitWidth: Math.round(UM.Theme.getSize("button").width * 0.75)
implicitHeight: Math.round(UM.Theme.getSize("button").height * 0.75)
radius: Math.round(width * 0.5)
color:
{
if (base.checked && base.hovered)
{
return UM.Theme.getColor("toolbar_button_active_hover")
}
else if (base.checked)
{
return UM.Theme.getColor("toolbar_button_active")
}
else if(base.hovered)
{
return UM.Theme.getColor("toolbar_button_hover")
}
return UM.Theme.getColor("toolbar_background")
}
Loader
{
id: contentItemLoader
anchors.centerIn: parent
width: UM.Theme.getSize("button_icon").width
height: UM.Theme.getSize("button_icon").height
width: Math.round(UM.Theme.getSize("button").width / 2)
height: Math.round(UM.Theme.getSize("button").height / 2)
}
}