ItemDelegate: add support for icons

Task-number: QTBUG-49820
Change-Id: I8976267610ede3ed2b808f5e8cb7f39ce65b6511
Reviewed-by: J-P Nurmi <jpnurmi@qt.io>

3 files changed, 36 insertions, 25 deletions

diff --git a/src/imports/controls/ItemDelegate.qml b/src/imports/controls/ItemDelegate.qml
index eae04270..507dfd2d 100644
--- a/src/imports/controls/ItemDelegate.qml
+++ b/src/imports/controls/ItemDelegate.qml
@@ -50,19 +50,22 @@ T.ItemDelegate {
     baselineOffset: contentItem.y + contentItem.baselineOffset
 
     padding: 12
-    spacing: 12
+    spacing: 8
 
-    contentItem: Text {
-        leftPadding: control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0
-        rightPadding: !control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0
+    icon.width: 24
+    icon.height: 24
+    icon.color: enabled ? undefined : Default.textDisabledLightColor
 
+    contentItem: IconLabel {
+        spacing: control.spacing
+        mirrored: control.mirrored
+        display: control.display
+        alignment: control.display === IconLabel.IconOnly || control.display === IconLabel.TextUnderIcon ? Qt.AlignCenter : Qt.AlignLeft
+
+        icon: control.icon
         text: control.text
         font: control.font
         color: control.enabled ? Default.textDarkColor : Default.textDisabledColor
-        elide: Text.ElideRight
-        visible: control.text
-        horizontalAlignment: Text.AlignLeft
-        verticalAlignment: Text.AlignVCenter
     }
 
     background: Rectangle {
diff --git a/src/imports/controls/material/ItemDelegate.qml b/src/imports/controls/material/ItemDelegate.qml
index 41c5ab28..e9a75186 100644
--- a/src/imports/controls/material/ItemDelegate.qml
+++ b/src/imports/controls/material/ItemDelegate.qml
@@ -36,6 +36,8 @@
 
 import QtQuick 2.9
 import QtQuick.Templates 2.3 as T
+import QtQuick.Controls 2.3
+import QtQuick.Controls.impl 2.3
 import QtQuick.Controls.Material 2.3
 import QtQuick.Controls.Material.impl 2.3
 
@@ -52,17 +54,20 @@ T.ItemDelegate {
     padding: 16
     spacing: 16
 
-    contentItem: Text {
-        leftPadding: control.checkable && !control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0
-        rightPadding: control.checkable && control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0
+    icon.width: 24
+    icon.height: 24
+    icon.color: enabled ? undefined : Material.hintTextColor
 
+    contentItem: IconLabel {
+        spacing: control.spacing
+        mirrored: control.mirrored
+        display: control.display
+        alignment: control.display === IconLabel.IconOnly || control.display === IconLabel.TextUnderIcon ? Qt.AlignCenter : Qt.AlignLeft
+
+        icon: control.icon
         text: control.text
         font: control.font
         color: control.enabled ? control.Material.foreground : control.Material.hintTextColor
-        elide: Text.ElideRight
-        visible: control.text
-        horizontalAlignment: Text.AlignLeft
-        verticalAlignment: Text.AlignVCenter
     }
 
     background: Rectangle {
diff --git a/src/imports/controls/universal/ItemDelegate.qml b/src/imports/controls/universal/ItemDelegate.qml
index 09db7867..9ebadd26 100644
--- a/src/imports/controls/universal/ItemDelegate.qml
+++ b/src/imports/controls/universal/ItemDelegate.qml
@@ -36,6 +36,8 @@
 
 import QtQuick 2.9
 import QtQuick.Templates 2.3 as T
+import QtQuick.Controls 2.3
+import QtQuick.Controls.impl 2.3
 import QtQuick.Controls.Universal 2.3
 
 T.ItemDelegate {
@@ -54,19 +56,20 @@ T.ItemDelegate {
     topPadding: padding - 1
     bottomPadding: padding + 1
 
-    contentItem: Text {
-        leftPadding: !control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0
-        rightPadding: control.mirrored ? (control.indicator ? control.indicator.width : 0) + control.spacing : 0
+    icon.width: 20
+    icon.height: 20
+    icon.color: enabled ? undefined : Universal.transparentColor(Universal.foreground, 0.2)
 
+    contentItem: IconLabel {
+        spacing: control.spacing
+        mirrored: control.mirrored
+        display: control.display
+        alignment: control.display === IconLabel.IconOnly || control.display === IconLabel.TextUnderIcon ? Qt.AlignCenter : Qt.AlignLeft
+
+        icon: control.icon
         text: control.text
         font: control.font
-        elide: Text.ElideRight
-        visible: control.text
-        horizontalAlignment: Text.AlignLeft
-        verticalAlignment: Text.AlignVCenter
-
-        opacity: enabled ? 1.0 : 0.2
-        color: control.Universal.foreground
+        color: Color.transparent(control.Universal.foreground, enabled ? 1.0 : 0.2)
     }
 
     background: Rectangle {