1 files changed, 22 insertions, 42 deletions

diff --git a/src/quickcontrols/material/ComboBox.qml b/src/quickcontrols/material/ComboBox.qml
index 30222c4180..5694aa055c 100644
--- a/src/quickcontrols/material/ComboBox.qml
+++ b/src/quickcontrols/material/ComboBox.qml
@@ -1,6 +1,8 @@
 // Copyright (C) 2017 The Qt Company Ltd.
 // SPDX-License-Identifier: LicenseRef-Qt-Commercial OR LGPL-3.0-only OR GPL-2.0-only OR GPL-3.0-only
 
+pragma ComponentBehavior: Bound
+
 import QtQuick
 import QtQuick.Window
 import QtQuick.Controls.impl
@@ -17,20 +19,18 @@ T.ComboBox {
                              implicitContentHeight + topPadding + bottomPadding,
                              implicitIndicatorHeight + topPadding + bottomPadding)
 
-    topInset: 6
-    bottomInset: 6
-
     leftPadding: padding + (!control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
     rightPadding: padding + (control.mirrored || !indicator || !indicator.visible ? 0 : indicator.width + spacing)
 
-    Material.elevation: flat ? control.pressed || (enabled && control.hovered) ? 2 : 0
-                             : control.pressed ? 8 : 2
     Material.background: flat ? "transparent" : undefined
     Material.foreground: flat ? undefined : Material.primaryTextColor
 
     delegate: MenuItem {
+        required property var model
+        required property int index
+
         width: ListView.view.width
-        text: control.textRole ? (Array.isArray(control.model) ? modelData[control.textRole] : model[control.textRole]) : modelData
+        text: model[control.textRole]
         Material.foreground: control.currentIndex === index ? ListView.view.contentItem.Material.accent : ListView.view.contentItem.Material.foreground
         highlighted: control.highlightedIndex === index
         hoverEnabled: control.hoverEnabled
@@ -44,9 +44,9 @@ T.ComboBox {
     }
 
     contentItem: T.TextField {
-        padding: 6
-        leftPadding: control.editable ? 2 : control.mirrored ? 0 : 12
-        rightPadding: control.editable ? 2 : control.mirrored ? 12 : 0
+        leftPadding: Material.textFieldHorizontalPadding
+        topPadding: Material.textFieldVerticalPadding
+        bottomPadding: Material.textFieldVerticalPadding
 
         text: control.editable ? control.editText : control.displayText
 
@@ -65,46 +65,25 @@ T.ComboBox {
         cursorDelegate: CursorDelegate { }
     }
 
-    background: Rectangle {
+    background: MaterialTextContainer {
         implicitWidth: 120
-        implicitHeight: control.Material.buttonHeight
+        implicitHeight: control.Material.textFieldHeight
 
-        radius: control.flat ? 0 : 2
-        color: !control.editable ? control.Material.dialogColor : "transparent"
-
-        layer.enabled: control.enabled && !control.editable && control.Material.background.a > 0
-        layer.effect: ElevationEffect {
-            elevation: control.Material.elevation
-        }
-
-        Rectangle {
-            visible: control.editable
-            y: parent.y + control.baselineOffset
-            width: parent.width
-            height: control.activeFocus ? 2 : 1
-            color: control.editable && control.activeFocus ? control.Material.accentColor : control.Material.hintTextColor
-        }
-
-        Ripple {
-            clip: control.flat
-            clipRadius: control.flat ? 0 : 2
-            x: control.editable && control.indicator ? control.indicator.x : 0
-            width: control.editable && control.indicator ? control.indicator.width : parent.width
-            height: parent.height
-            pressed: control.pressed
-            anchor: control.editable && control.indicator ? control.indicator : control
-            active: enabled && (control.pressed || control.visualFocus || control.hovered)
-            color: control.Material.rippleColor
-        }
+        outlineColor: (enabled && control.hovered) ? control.Material.primaryTextColor : control.Material.hintTextColor
+        focusedOutlineColor: control.Material.accentColor
+        controlHasActiveFocus: control.activeFocus
+        controlHasText: true
+        horizontalPadding: control.Material.textFieldHorizontalPadding
     }
 
     popup: T.Popup {
         y: control.editable ? control.height - 5 : 0
         width: control.width
-        height: Math.min(contentItem.implicitHeight, control.Window.height - topMargin - bottomMargin)
+        height: Math.min(contentItem.implicitHeight + verticalPadding * 2, control.Window.height - topMargin - bottomMargin)
         transformOrigin: Item.Top
         topMargin: 12
         bottomMargin: 12
+        verticalPadding: 8
 
         Material.theme: control.Material.theme
         Material.accent: control.Material.accent
@@ -133,12 +112,13 @@ T.ComboBox {
         }
 
         background: Rectangle {
-            radius: 2
+            radius: 4
             color: parent.Material.dialogColor
 
             layer.enabled: control.enabled
-            layer.effect: ElevationEffect {
-                elevation: 8
+            layer.effect: RoundedElevationEffect {
+                elevation: 4
+                roundedScale: Material.ExtraSmallScale
             }
         }
     }