Update buttons in per object settings plugin to QtControls 2

CURA-8684

2 files changed, 94 insertions, 21 deletions

diff --git a/plugins/PerObjectSettingsTool/PerObjectSettingsPanel.qml b/plugins/PerObjectSettingsTool/PerObjectSettingsPanel.qml
index c97989c449..403dfa499d 100644
--- a/plugins/PerObjectSettingsTool/PerObjectSettingsPanel.qml
+++ b/plugins/PerObjectSettingsTool/PerObjectSettingsPanel.qml
@@ -2,7 +2,8 @@
 // Uranium is released under the terms of the LGPLv3 or higher.
 
 import QtQuick 2.2
-import QtQuick.Controls 1.2
+import QtQuick.Controls 2.1
+import QtQuick.Controls 1.2 as OldControls
 import QtQuick.Controls.Styles 1.2
 
 import UM 1.5 as UM
@@ -76,7 +77,7 @@ Item
             id: meshTypeButtons
             spacing: UM.Theme.getSize("default_margin").width
 
-            Button
+            ToolBarButton
             {
                 id: normalButton
                 text: catalog.i18nc("@label", "Normal model")
@@ -84,11 +85,10 @@ Item
                 property bool needBorder: true
                 checkable: true
                 onClicked: setMeshType(normalMeshType);
-                style: UM.Theme.styles.tool_button;
                 z: 4
             }
 
-            Button
+            ToolBarButton
             {
                 id: supportMeshButton
                 text: catalog.i18nc("@label", "Print as support")
@@ -96,11 +96,10 @@ Item
                 property bool needBorder: true
                 checkable:true
                 onClicked: setMeshType(supportMeshType)
-                style: UM.Theme.styles.tool_button;
                 z: 3
             }
 
-            Button
+            ToolBarButton
             {
                 id: overlapMeshButton
                 text: catalog.i18nc("@label", "Modify settings for overlaps")
@@ -108,11 +107,10 @@ Item
                 property bool needBorder: true
                 checkable:true
                 onClicked: setMeshType(infillMeshType)
-                style: UM.Theme.styles.tool_button;
                 z: 2
             }
 
-            Button
+            ToolBarButton
             {
                 id: antiOverhangMeshButton
                 text:  catalog.i18nc("@label", "Don't support overlaps")
@@ -120,7 +118,6 @@ Item
                 property bool needBorder: true
                 checkable: true
                 onClicked: setMeshType(antiOverhangMeshType)
-                style: UM.Theme.styles.tool_button;
                 z: 1
             }
 
@@ -179,7 +176,7 @@ Item
             height: Math.min(contents.count * (UM.Theme.getSize("section").height + UM.Theme.getSize("default_lining").height), maximumHeight)
             visible: currentMeshType != "anti_overhang_mesh"
 
-            ScrollView
+            OldControls.ScrollView
             {
                 height: parent.height
                 width: UM.Theme.getSize("setting").width + UM.Theme.getSize("default_margin").width
@@ -292,19 +289,16 @@ Item
 
                             onClicked: addedSettingsModel.setVisible(model.key, false)
 
-                            style: ButtonStyle
+                            background: Item
                             {
-                                background: Item
+                                UM.RecolorImage
                                 {
-                                    UM.RecolorImage
-                                    {
-                                        anchors.verticalCenter: parent.verticalCenter
-                                        width: parent.width
-                                        height: width
-                                        sourceSize.height: width
-                                        color: control.hovered ? UM.Theme.getColor("setting_control_button_hover") : UM.Theme.getColor("setting_control_button")
-                                        source: UM.Theme.getIcon("Minus")
-                                    }
+                                    anchors.verticalCenter: parent.verticalCenter
+                                    width: parent.width
+                                    height: width
+                                    sourceSize.height: width
+                                    color: parent.hovered ? UM.Theme.getColor("setting_control_button_hover") : UM.Theme.getColor("setting_control_button")
+                                    source: UM.Theme.getIcon("Minus")
                                 }
                             }
                         }
diff --git a/plugins/PerObjectSettingsTool/ToolBarButton.qml b/plugins/PerObjectSettingsTool/ToolBarButton.qml
new file mode 100644
index 0000000000..5e2479a73f
--- /dev/null
+++ b/plugins/PerObjectSettingsTool/ToolBarButton.qml
@@ -0,0 +1,79 @@
+// Copyright (c) 2021 Ultimaker B.V.
+// Cura is released under the terms of the LGPLv3 or higher.
+
+import QtQuick 2.1
+import QtQuick.Controls 2.1
+
+import Cura 1.0 as Cura
+import UM 1.5 as UM
+
+ToolButton
+{
+    id: base
+
+    property alias tooltip: tooltip.text
+    property alias iconSource: icon.source;
+
+    Cura.ToolTip
+    {
+        id: tooltip
+        visible: base.hovered
+        targetPoint: Qt.point(parent.x, Math.round(parent.y + parent.height / 2))
+    }
+
+
+    background: Item
+    {
+        implicitWidth: UM.Theme.getSize("button").width
+        implicitHeight: UM.Theme.getSize("button").height
+
+        Rectangle
+        {
+            id: buttonFace
+
+            anchors.fill: parent
+            property bool down: base.pressed || (base.checkable && base.checked)
+
+            color:
+            {
+                if(base.customColor !== undefined && base.customColor !== null)
+                {
+                    return base.customColor
+                }
+                else if(base.checkable && base.checked && base.hovered)
+                {
+                    return UM.Theme.getColor("toolbar_button_active_hover")
+                }
+                else if(base.pressed || (base.checkable && 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")
+            }
+            Behavior on color { ColorAnimation { duration: 50; } }
+
+            border.width: (base.hasOwnProperty("needBorder") && base.needBorder) ? UM.Theme.getSize("default_lining").width : 0
+            border.color: base.checked ? UM.Theme.getColor("icon") : UM.Theme.getColor("lining")
+        }
+    }
+
+    contentItem: Item
+    {
+        UM.RecolorImage
+        {
+            id: icon
+
+            anchors.centerIn: parent
+            opacity: base.enabled ? 1.0 : 0.2
+            width: UM.Theme.getSize("medium_button_icon").width
+            height: UM.Theme.getSize("medium_button_icon").height
+            color: UM.Theme.getColor("icon")
+
+            sourceSize: UM.Theme.getSize("medium_button_icon")
+        }
+    }
+}
\ No newline at end of file