From ef6e90283e544b666bee73d47e7bce358f42b041 Mon Sep 17 00:00:00 2001
From: Jack Ha <j.ha@ultimaker.com>
Date: Thu, 1 Dec 2016 11:34:37 +0100
Subject: [PATCH] Added color to recommended view support extruder by adding
 combobox_color style. CURA-2767

---
 resources/qml/SidebarSimple.qml  | 11 ++++-
 resources/themes/cura/styles.qml | 74 ++++++++++++++++++++++++++++++++
 2 files changed, 84 insertions(+), 1 deletion(-)

diff --git a/resources/qml/SidebarSimple.qml b/resources/qml/SidebarSimple.qml
index 3798797509..e84092b290 100644
--- a/resources/qml/SidebarSimple.qml
+++ b/resources/qml/SidebarSimple.qml
@@ -290,6 +290,12 @@ Item
             id: supportExtruderCombobox
             visible: (supportEnabled.properties.value == "True") && (machineExtruderCount.properties.value > 1)
             model: extruderModel
+            property string color:
+            {
+                var model_color = extruderModel.get(currentIndex).color;
+                return (model_color) ? model_color : "";
+            }
+
             textRole: 'text'  // this solves that the combobox isn't populated in the first time Cura is started
 
             anchors.top: enableSupportCheckBox.bottom
@@ -320,7 +326,7 @@ Item
                 }
             }
 
-            style: UM.Theme.styles.combobox
+            style: UM.Theme.styles.combobox_color
             enabled: base.settingsEnabled
             property alias _hovered: supportExtruderMouseArea.containsMouse
 
@@ -347,6 +353,9 @@ Item
                     base.hideTooltip();
                 }
             }
+
+            // color rectangle
+
         }
 
         Label
diff --git a/resources/themes/cura/styles.qml b/resources/themes/cura/styles.qml
index cc6bdfed77..afcb0b1763 100644
--- a/resources/themes/cura/styles.qml
+++ b/resources/themes/cura/styles.qml
@@ -411,6 +411,80 @@ QtObject {
         }
     }
 
+    // Combobox with items with colored rectangles
+    property Component combobox_color: Component {
+        ComboBoxStyle
+        {
+            background: Rectangle
+            {
+                color:
+                {
+                    if (!enabled)
+                    {
+                        return UM.Theme.getColor("setting_control_disabled");
+                    }
+                    if(control.hovered)
+                    {
+                        return UM.Theme.getColor("setting_control_highlight");
+                    }
+                    else
+                    {
+                        return UM.Theme.getColor("setting_control");
+                    }
+                }
+                border.width: UM.Theme.getSize("default_lining").width
+                border.color: !enabled ? UM.Theme.getColor("setting_control_disabled_border") : control.hovered ? UM.Theme.getColor("setting_control_border_highlight") : UM.Theme.getColor("setting_control_border")
+            }
+            label: Item
+            {
+                Rectangle
+                {
+                    id: swatch
+                    height: UM.Theme.getSize("setting_control").height / 2
+                    width: height
+                    anchors.left: parent.left
+                    anchors.leftMargin: UM.Theme.getSize("default_lining").width
+                    anchors.verticalCenter: parent.verticalCenter
+
+                    color: control.color
+                    border.width: UM.Theme.getSize("default_lining").width
+                    border.color: !enabled ? UM.Theme.getColor("setting_control_disabled_border") : UM.Theme.getColor("setting_control_border")
+                }
+                Label
+                {
+                    anchors.left: swatch.right
+                    anchors.leftMargin: UM.Theme.getSize("default_lining").width
+                    anchors.right: downArrow.left
+                    anchors.rightMargin: UM.Theme.getSize("default_lining").width
+                    anchors.verticalCenter: parent.verticalCenter
+
+                    text: control.currentText
+                    font: UM.Theme.getFont("default")
+                    color: !enabled ? UM.Theme.getColor("setting_control_disabled_text") : UM.Theme.getColor("setting_control_text")
+
+                    elide: Text.ElideRight
+                    verticalAlignment: Text.AlignVCenter
+                }
+
+                UM.RecolorImage
+                {
+                    id: downArrow
+                    anchors.right: parent.right
+                    anchors.rightMargin: UM.Theme.getSize("default_lining").width * 2
+                    anchors.verticalCenter: parent.verticalCenter
+
+                    source: UM.Theme.getIcon("arrow_bottom")
+                    width: UM.Theme.getSize("standard_arrow").width
+                    height: UM.Theme.getSize("standard_arrow").height
+                    sourceSize.width: width + 5
+                    sourceSize.height: width + 5
+
+                    color: UM.Theme.getColor("setting_control_text")
+                }
+            }
+        }
+    }
+
     property Component checkbox: Component {
         CheckBoxStyle {
             background: Item { }