GitHub-Proxy/Cura
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura synced 2025-04-24 06:39:38 +08:00
Code Issues Packages Projects Releases Wiki Activity

Align radio buttons with new designs.

Browse Source 
Fix radiobutton looking the same checked and unchecked when disabled

CURA-8991
This commit is contained in:
j.delarago 2022-03-04 13:18:00 +01:00
parent b86b1133df
commit b3e8c7190e
2 changed files with 68 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
resources/qml/Widgets/RadioButton.qml
View File

@ -1,4 +1,4 @@
// Copyright (c) 2019 Ultimaker B.V.
// Copyright (c) 2022 Ultimaker B.V.
// Cura is released under the terms of the LGPLv3 or higher.
import QtQuick 2.10
@ -13,32 +13,58 @@ import Cura 1.0 as Cura
//
RadioButton
{
id: radioButton
id: control
font: UM.Theme.getFont("default")
states: [
State {
name: "checked"
when: radioButton.checked
name: "selected-hover"
when: control.enabled && control.checked && control.hovered
PropertyChanges
{
target: indicator
color: UM.Theme.getColor("accent_1")
border.width: 0
target: indicator_background
color: UM.Theme.getColor("radio_selected")
border.color: UM.Theme.getColor("radio_border_hover")
}
},
State
{
name: "disabled"
when: !radioButton.enabled
PropertyChanges { target: indicator; color: UM.Theme.getColor("background_1")}
State {
name: "selected"
when: control.enabled && control.checked
PropertyChanges
{
target: indicator_background
color: UM.Theme.getColor("radio_selected")
}
},
State
{
name: "highlighted"
when: radioButton.hovered || radioButton.activeFocus
PropertyChanges { target: indicator; border.color: UM.Theme.getColor("border_main_light")}
State {
name: "hovered"
when: control.enabled && control.hovered
PropertyChanges
{
target: indicator_background
border.color: UM.Theme.getColor("radio_border_hover")
}
},
State {
name: "selected_disabled"
when: !control.enabled && control.checked
PropertyChanges
{
target: indicator_background
color: UM.Theme.getColor("radio_selected_disabled")
border.color: UM.Theme.getColor("radio_border_disabled")
}
},
State {
name: "disabled"
when: !control.enabled
PropertyChanges
{
target: indicator_background
color: UM.Theme.getColor("radio_disabled")
border.color: UM.Theme.getColor("radio_border_disabled")
}
}
]
@ -49,30 +75,35 @@ RadioButton
indicator: Rectangle
{
id: indicator_background
implicitWidth: UM.Theme.getSize("radio_button").width
implicitHeight: UM.Theme.getSize("radio_button").height
anchors.verticalCenter: parent.verticalCenter
anchors.alignWhenCentered: false
radius: width / 2
color: UM.Theme.getColor("background_2")
color: UM.Theme.getColor("radio")
border.width: UM.Theme.getSize("default_lining").width
border.color: UM.Theme.getColor("text_disabled")
border.color: UM.Theme.getColor("radio_border")
Rectangle
{
id: indicator_dot
width: (parent.width / 2) | 0
height: width
anchors.centerIn: parent
radius: width / 2
color: radioButton.enabled ? UM.Theme.getColor("background_2") : UM.Theme.getColor("background_1")
visible: radioButton.checked
color: control.enabled ? UM.Theme.getColor("radio_dot") : UM.Theme.getColor("radio_dot_disabled")
visible: control.checked
}
}
contentItem: UM.Label
{
leftPadding: radioButton.indicator.width + radioButton.spacing
text: radioButton.text
font: radioButton.font
leftPadding: control.indicator.width + control.spacing
text: control.text
font: control.font
color: control.enabled ? UM.Theme.getColor("radio_text"): UM.Theme.getColor("radio_text_disabled")
}
}

13
resources/themes/cura-light/theme.json
View File

@ -335,6 +335,19 @@
"checkbox_text": "text_default",
"checkbox_text_disabled": "text_disabled",
"radio": "background_1",
"radio_disabled": "background_2",
"radio_selected": "accent_1",
"radio_selected_disabled": "text_disabled",
"radio_border": [180, 180, 180, 255],
"radio_border_hover": "border_main",
"radio_border_disabled": "text_disabled",
"radio_dot": "background_1",
"radio_dot_disabled": "background_2",
"radio_text": "text_default",
"radio_text_disabled": "text_disabled",
"category_background": "background_2",
"tooltip": [25, 25, 25, 255],