diff --git a/resources/qml/Widgets/CheckBox.qml b/resources/qml/Widgets/CheckBox.qml index 84b074af71..e60384d565 100644 --- a/resources/qml/Widgets/CheckBox.qml +++ b/resources/qml/Widgets/CheckBox.qml @@ -17,13 +17,12 @@ CheckBox hoverEnabled: true - height: UM.Theme.getSize("checkbox").height - width: UM.Theme.getSize("checkbox").width - indicator: Rectangle { - width: control.height - height: control.height + height: UM.Theme.getSize("checkbox").height + width: UM.Theme.getSize("checkbox").width + + anchors.verticalCenter: parent.verticalCenter color: { @@ -38,7 +37,7 @@ CheckBox return UM.Theme.getColor("setting_control") } - radius: UM.Theme.getSize("setting_control_radius").width + radius: UM.Theme.getSize("checkbox_radius").width border.width: UM.Theme.getSize("default_lining").width border.color: { @@ -57,12 +56,46 @@ CheckBox { anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter - height: UM.Theme.getSize("checkbox_mark").height - width: UM.Theme.getSize("checkbox_mark").width - sourceSize.height: width - color: !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("setting_control_text") - source: UM.Theme.getIcon("EmptyCheck", "low") - opacity: control.checked ? 1 : 0 + + height: + { + switch(control.checkState) + { + case Qt.Checked: return UM.Theme.getSize("checkbox_mark").height + case Qt.PartiallyChecked: return UM.Theme.getSize("checkbox_square").height + default: UM.Theme.getSize("checkbox_mark").height + } + } + width: height + sourceSize.height: height + + color: + { + switch(control.checkState) + { + case Qt.Checked: return !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("checkbox_mark") + case Qt.PartiallyChecked: return !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("checkbox_square") + default: return !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("checkbox_mark") + } + } + source: + { + switch (control.checkState) + { + case Qt.Checked: return UM.Theme.getIcon("EmptyCheck", "low") + case Qt.PartiallyChecked: return UM.Theme.getIcon("CheckBoxFill", "low") + default: return UM.Theme.getIcon("EmptyCheck", "low") + } + } + opacity: + { + switch (control.checkState) + { + case Qt.Checked: return 1; + case Qt.PartiallyChecked: return 1; + default: 0; + } + } Behavior on opacity { NumberAnimation { duration: 100; } } } } @@ -70,7 +103,8 @@ CheckBox contentItem: Label { id: textLabel - leftPadding: control.indicator.width + control.spacing + anchors.left: control.indicator.right + leftPadding: UM.Theme.getSize("checkbox_label_padding").width text: control.text font: control.font color: UM.Theme.getColor("text") diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index 2276c39744..e98b734a1d 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -352,6 +352,7 @@ "checkbox_border": [199, 199, 199, 255], "checkbox_border_hover": [50, 130, 255, 255], "checkbox_mark": [35, 35, 35, 255], + "checkbox_square": [180, 180, 180, 255], "checkbox_disabled": [223, 223, 223, 255], "checkbox_text": [35, 35, 35, 255], @@ -606,7 +607,9 @@ "checkbox": [1.33, 1.33], "checkbox_mark": [1, 1], + "checkbox_square": [0.83, 0.83], "checkbox_radius": [0.25, 0.25], + "checkbox_label_padding": [0.5, 0.5], "tooltip": [20.0, 10.0], "tooltip_margins": [1.0, 1.0],