Add ComboBox::flat

[ChangeLog][ComboBox] Added a flat property that provides more suitable
looks for using ComboBox in a ToolBar.

Task-number: QTBUG-54935
Change-Id: Id458a078486aeac5d542a57f3ed247d63d25e95c
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>

9 files changed, 67 insertions, 17 deletions

diff --git a/src/imports/controls/ComboBox.qml b/src/imports/controls/ComboBox.qml
index 2f78220c..1470ad7c 100644
--- a/src/imports/controls/ComboBox.qml
+++ b/src/imports/controls/ComboBox.qml
@@ -99,6 +99,7 @@ T.ComboBox {
             (control.pressed || popup.visible ? "#d0d0d0" : "#e0e0e0")
         border.color: "#0066ff"
         border.width: control.visualFocus ? 2 : 0
+        visible: !control.flat || control.pressed
     }
     //! [background]
 
diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml
index d1e36003..c18a2624 100644
--- a/src/imports/controls/material/ComboBox.qml
+++ b/src/imports/controls/material/ComboBox.qml
@@ -44,8 +44,6 @@ import QtQuick.Controls.Material.impl 2.1
 T.ComboBox {
     id: control
 
-    Material.elevation: control.pressed ? 8 : 2
-
     implicitWidth: Math.max(background ? background.implicitWidth : 0,
                             contentItem.implicitWidth + leftPadding + rightPadding)
     implicitHeight: Math.max(background ? background.implicitHeight : 0,
@@ -58,13 +56,15 @@ T.ComboBox {
 
     hoverEnabled: Qt.styleHints.useHoverEffects
 
-    // Don't use toolTextColor, as that is often white when we have a white background.
-    Material.foreground: Material.foreground === Material.toolTextColor ? undefined : Material.foreground
+    Material.elevation: flat ? control.pressed || control.hovered ? 2 : 0
+                             : control.pressed ? 8 : 2
+    Material.background: flat ? "transparent" : undefined
+    Material.foreground: flat ? undefined : Material.foreground
 
     delegate: MenuItem {
         width: control.width
         text: control.textRole ? (Array.isArray(control.model) ? modelData[control.textRole] : model[control.textRole]) : modelData
-        Material.foreground: control.currentIndex === index ? control.Material.accent : control.Material.foreground
+        Material.foreground: control.currentIndex === index ? control.popup.Material.accent : control.popup.Material.foreground
         highlighted: control.highlightedIndex === index
         hoverEnabled: control.hoverEnabled
     }
@@ -72,8 +72,7 @@ T.ComboBox {
     indicator: Image {
         x: control.mirrored ? control.leftPadding : control.width - width - control.rightPadding
         y: control.topPadding + (control.availableHeight - height) / 2
-        opacity: !control.enabled ? 0.5 : 1.0
-        source: "qrc:/qt-project.org/imports/QtQuick/Controls.2/Material/images/drop-indicator.png"
+        source: "image://material/drop-indicator/" + (control.enabled ? control.Material.primaryTextColor : control.Material.hintTextColor)
     }
 
     contentItem: Text {
@@ -92,7 +91,7 @@ T.ComboBox {
         implicitWidth: 120
         implicitHeight: 48
 
-        radius: 2
+        radius: control.flat ? 0 : 2
         color: control.Material.dialogColor
 
         Behavior on color {
@@ -101,15 +100,17 @@ T.ComboBox {
             }
         }
 
-        layer.enabled: control.enabled && control.Material.elevation > 0
+        layer.enabled: control.enabled && control.Material.background.a > 0
         layer.effect: ElevationEffect {
             elevation: control.Material.elevation
         }
 
         Ripple {
-            clipRadius: 2
+            clip: control.flat
+            clipRadius: control.flat ? 0 : 2
             width: parent.width
             height: parent.height
+            trigger: Ripple.Press
             pressed: control.pressed
             anchor: control
             active: control.pressed || control.visualFocus || control.hovered
@@ -151,7 +152,7 @@ T.ComboBox {
 
         background: Rectangle {
             radius: 2
-            color: control.Material.dialogColor
+            color: control.popup.Material.dialogColor
 
             layer.enabled: control.enabled
             layer.effect: ElevationEffect {
diff --git a/src/imports/controls/material/qquickmaterialstyle.cpp b/src/imports/controls/material/qquickmaterialstyle.cpp
index a166e729..d71545b7 100644
--- a/src/imports/controls/material/qquickmaterialstyle.cpp
+++ b/src/imports/controls/material/qquickmaterialstyle.cpp
@@ -948,7 +948,9 @@ QColor QQuickMaterialStyle::drawerBackgroundColor() const
 
 QColor QQuickMaterialStyle::dialogColor() const
 {
-    return QColor::fromRgba(m_theme == Light ? dialogColorLight : dialogColorDark);
+    if (!m_hasBackground)
+        return QColor::fromRgba(m_theme == Light ? dialogColorLight : dialogColorDark);
+    return backgroundColor();
 }
 
 QColor QQuickMaterialStyle::backgroundDimColor() const
diff --git a/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp b/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp
index 77dc67a5..27d2c5a6 100644
--- a/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp
+++ b/src/imports/controls/material/qtquickcontrols2materialstyleplugin.cpp
@@ -44,6 +44,7 @@
 
 #include <QtQuickControls2/private/qquickstyleselector_p.h>
 #include <QtQuickControls2/private/qquickpaddedrectangle_p.h>
+#include <QtQuickControls2/private/qquickcolorimageprovider_p.h>
 
 static inline void initResources()
 {
@@ -85,6 +86,8 @@ void QtQuickControls2MaterialStylePlugin::initializeEngine(QQmlEngine *engine, c
 {
     QQuickStylePlugin::initializeEngine(engine, uri);
 
+    engine->addImageProvider(name(), new QQuickColorImageProvider(QStringLiteral(":/qt-project.org/imports/QtQuick/Controls.2/Material/images")));
+
     QByteArray import = QByteArray(uri) + ".impl";
     qmlRegisterType<QQuickPaddedRectangle>(import, 2, 0, "PaddedRectangle");
     qmlRegisterRevision<QQuickPaddedRectangle, 1>(import, 2, 1);
diff --git a/src/imports/controls/universal/ComboBox.qml b/src/imports/controls/universal/ComboBox.qml
index 467ed6ef..0fe49520 100644
--- a/src/imports/controls/universal/ComboBox.qml
+++ b/src/imports/controls/universal/ComboBox.qml
@@ -91,12 +91,14 @@ T.ComboBox {
         implicitWidth: 120
         implicitHeight: 32
 
-        border.width: 2 // ComboBoxBorderThemeThickness
+        border.width: control.flat ? 0 : 2 // ComboBoxBorderThemeThickness
         border.color: !control.enabled ? control.Universal.baseLowColor :
                        control.pressed || popup.visible ? control.Universal.baseMediumLowColor :
                        control.hovered ? control.Universal.baseMediumColor : control.Universal.baseMediumLowColor
         color: !control.enabled ? control.Universal.baseLowColor :
-                control.pressed || popup.visible ? control.Universal.listMediumColor : control.Universal.altMediumLowColor
+                control.pressed || popup.visible ? control.Universal.listMediumColor :
+                control.flat && control.hovered ? control.Universal.listLowColor : control.Universal.altMediumLowColor
+        visible: !control.flat || control.pressed || control.hovered || control.visualFocus
 
         Rectangle {
             x: 2
diff --git a/src/imports/templates/plugins.qmltypes b/src/imports/templates/plugins.qmltypes
index f32f4664..cbcc1fc7 100644
--- a/src/imports/templates/plugins.qmltypes
+++ b/src/imports/templates/plugins.qmltypes
@@ -126,11 +126,15 @@ Module {
         name: "QQuickComboBox"
         defaultProperty: "data"
         prototype: "QQuickControl"
-        exports: ["QtQuick.Templates/ComboBox 2.0"]
-        exportMetaObjectRevisions: [0]
+        exports: [
+            "QtQuick.Templates/ComboBox 2.0",
+            "QtQuick.Templates/ComboBox 2.1"
+        ]
+        exportMetaObjectRevisions: [0, 1]
         Property { name: "count"; type: "int"; isReadonly: true }
         Property { name: "model"; type: "QVariant" }
         Property { name: "delegateModel"; type: "QQmlInstanceModel"; isReadonly: true; isPointer: true }
+        Property { name: "flat"; revision: 1; type: "bool" }
         Property { name: "pressed"; type: "bool" }
         Property { name: "highlightedIndex"; type: "int"; isReadonly: true }
         Property { name: "currentIndex"; type: "int" }
diff --git a/src/imports/templates/qtquicktemplates2plugin.cpp b/src/imports/templates/qtquicktemplates2plugin.cpp
index d2591414..67a52d14 100644
--- a/src/imports/templates/qtquicktemplates2plugin.cpp
+++ b/src/imports/templates/qtquicktemplates2plugin.cpp
@@ -178,6 +178,7 @@ void QtQuickTemplates2Plugin::registerTypes(const char *uri)
 
     // QtQuick.Controls 2.1 (Qt 5.8)
     qmlRegisterType<QQuickButtonGroup, 1>(uri, 2, 1, "ButtonGroup");
+    qmlRegisterType<QQuickComboBox, 1>(uri, 2, 1, "ComboBox");
     qmlRegisterType<QQuickContainer, 1>(uri, 2, 1, "Container");
     qmlRegisterType<QQuickDialog>(uri, 2, 1, "Dialog");
     qmlRegisterType<QQuickDialogButtonBox>(uri, 2, 1, "DialogButtonBox");
diff --git a/src/quicktemplates2/qquickcombobox.cpp b/src/quicktemplates2/qquickcombobox.cpp
index f6dfa195..59c108c2 100644
--- a/src/quicktemplates2/qquickcombobox.cpp
+++ b/src/quicktemplates2/qquickcombobox.cpp
@@ -154,7 +154,7 @@ class QQuickComboBoxPrivate : public QQuickControlPrivate
     Q_DECLARE_PUBLIC(QQuickComboBox)
 
 public:
-    QQuickComboBoxPrivate() : pressed(false), ownModel(false), hasDisplayText(false), hasCurrentIndex(false),
+    QQuickComboBoxPrivate() : flat(false), pressed(false), ownModel(false), hasDisplayText(false), hasCurrentIndex(false),
         highlightedIndex(-1), currentIndex(-1), delegateModel(nullptr),
         delegate(nullptr), indicator(nullptr), popup(nullptr) { }
 
@@ -174,6 +174,7 @@ public:
 
     void createDelegateModel();
 
+    bool flat;
     bool pressed;
     bool ownModel;
     bool hasDisplayText;
@@ -438,6 +439,36 @@ QQmlInstanceModel *QQuickComboBox::delegateModel() const
 }
 
 /*!
+    \since QtQuick.Controls 2.1
+    \qmlproperty bool QtQuick.Controls::ComboBox::flat
+
+    This property holds whether the combo box button is flat.
+
+    A flat combo box button does not draw a background unless it is interacted
+    with. In comparison to normal combo boxes, flat combo boxes provide looks
+    that make them stand out less from the rest of the UI. For instance, when
+    placing a combo box into a tool bar, it may be desirable to make the combo
+    box flat so it matches better with the flat looks of tool buttons.
+
+    The default value is \c false.
+*/
+bool QQuickComboBox::isFlat() const
+{
+    Q_D(const QQuickComboBox);
+    return d->flat;
+}
+
+void QQuickComboBox::setFlat(bool flat)
+{
+    Q_D(QQuickComboBox);
+    if (d->flat == flat)
+        return;
+
+    d->flat = flat;
+    emit flatChanged();
+}
+
+/*!
     \qmlproperty bool QtQuick.Controls::ComboBox::pressed
 
     This property holds whether the combo box button is pressed.
diff --git a/src/quicktemplates2/qquickcombobox_p.h b/src/quicktemplates2/qquickcombobox_p.h
index 26b7688e..3788d56a 100644
--- a/src/quicktemplates2/qquickcombobox_p.h
+++ b/src/quicktemplates2/qquickcombobox_p.h
@@ -62,6 +62,7 @@ class Q_QUICKTEMPLATES2_PRIVATE_EXPORT QQuickComboBox : public QQuickControl
     Q_PROPERTY(int count READ count NOTIFY countChanged FINAL)
     Q_PROPERTY(QVariant model READ model WRITE setModel NOTIFY modelChanged FINAL)
     Q_PROPERTY(QQmlInstanceModel *delegateModel READ delegateModel NOTIFY delegateModelChanged FINAL)
+    Q_PROPERTY(bool flat READ isFlat WRITE setFlat NOTIFY flatChanged FINAL REVISION 1)
     Q_PROPERTY(bool pressed READ isPressed WRITE setPressed NOTIFY pressedChanged FINAL)
     Q_PROPERTY(int highlightedIndex READ highlightedIndex NOTIFY highlightedIndexChanged FINAL)
     Q_PROPERTY(int currentIndex READ currentIndex WRITE setCurrentIndex NOTIFY currentIndexChanged FINAL)
@@ -82,6 +83,9 @@ public:
     void setModel(const QVariant &model);
     QQmlInstanceModel *delegateModel() const;
 
+    bool isFlat() const;
+    void setFlat(bool flat);
+
     bool isPressed() const;
     void setPressed(bool pressed);
 
@@ -119,6 +123,7 @@ Q_SIGNALS:
     void countChanged();
     void modelChanged();
     void delegateModelChanged();
+    Q_REVISION(1) void flatChanged();
     void pressedChanged();
     void highlightedIndexChanged();
     void currentIndexChanged();