aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorJ-P Nurmi <jpnurmi@qt.io>2017-04-12 14:08:28 +0200
committerJ-P Nurmi <jpnurmi@qt.io>2017-04-19 09:39:53 +0000
commit65247c0bbd340f4be89e0ae284b865fd8ba235ce (patch)
treea4c5b04f1c52b1f5ebf3130d450d8c1cbc863871
parentce0a6e5d78fa6edca573e5d48b5448647ba7642d (diff)
SwitchDelegate: add support for icons
Task-number: QTBUG-49820 Change-Id: I9cafe09ae56afa14a55748e13405dd0364f9dcb2 Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
-rw-r--r--src/imports/controls/SwitchDelegate.qml20
-rw-r--r--src/imports/controls/material/SwitchDelegate.qml18
-rw-r--r--src/imports/controls/universal/SwitchDelegate.qml22
-rw-r--r--tests/auto/controls/data/tst_switchdelegate.qml81
4 files changed, 121 insertions, 20 deletions
diff --git a/src/imports/controls/SwitchDelegate.qml b/src/imports/controls/SwitchDelegate.qml
index 4b57cd29..287e174c 100644
--- a/src/imports/controls/SwitchDelegate.qml
+++ b/src/imports/controls/SwitchDelegate.qml
@@ -52,23 +52,29 @@ T.SwitchDelegate {
padding: 12
spacing: 12
+ icon.width: 24
+ icon.height: 24
+ icon.color: enabled ? undefined : Default.textDisabledLightColor
+
indicator: SwitchIndicator {
x: text ? (control.mirrored ? control.leftPadding : control.width - width - control.rightPadding) : control.leftPadding + (control.availableWidth - width) / 2
y: control.topPadding + (control.availableHeight - height) / 2
control: control
}
- contentItem: Text {
- leftPadding: control.indicator && !control.mirrored ? 0 : control.indicator.width + control.spacing
- rightPadding: control.indicator && control.mirrored ? 0 : control.indicator.width + control.spacing
+ contentItem: IconLabel {
+ leftPadding: control.mirrored ? control.indicator.width + control.spacing : 0
+ rightPadding: !control.mirrored ? control.indicator.width + control.spacing : 0
+
+ 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/SwitchDelegate.qml b/src/imports/controls/material/SwitchDelegate.qml
index c5c4a91d..c1591178 100644
--- a/src/imports/controls/material/SwitchDelegate.qml
+++ b/src/imports/controls/material/SwitchDelegate.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
@@ -54,23 +56,29 @@ T.SwitchDelegate {
bottomPadding: 8
spacing: 16
+ icon.width: 24
+ icon.height: 24
+ icon.color: enabled ? undefined : Material.hintTextColor
+
indicator: SwitchIndicator {
x: text ? (control.mirrored ? control.leftPadding : control.width - width - control.rightPadding) : control.leftPadding + (control.availableWidth - width) / 2
y: control.topPadding + (control.availableHeight - height) / 2
control: control
}
- contentItem: Text {
+ contentItem: IconLabel {
leftPadding: !control.mirrored ? 0 : control.indicator.width + control.spacing
rightPadding: control.mirrored ? 0 : control.indicator.width + control.spacing
+ 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/SwitchDelegate.qml b/src/imports/controls/universal/SwitchDelegate.qml
index 49482d05..af7f403e 100644
--- a/src/imports/controls/universal/SwitchDelegate.qml
+++ b/src/imports/controls/universal/SwitchDelegate.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.SwitchDelegate {
@@ -54,25 +56,29 @@ T.SwitchDelegate {
topPadding: padding - 1
bottomPadding: padding + 1
+ icon.width: 20
+ icon.height: 20
+ icon.color: enabled ? undefined : Color.transparent(Universal.foreground, 0.2)
+
indicator: SwitchIndicator {
x: text ? (control.mirrored ? control.leftPadding : control.width - width - control.rightPadding) : control.leftPadding + (control.availableWidth - width) / 2
y: control.topPadding + (control.availableHeight - height) / 2
control: control
}
- contentItem: Text {
+ contentItem: IconLabel {
leftPadding: !control.mirrored ? 0 : control.indicator.width + control.spacing
rightPadding: control.mirrored ? 0 : control.indicator.width + control.spacing
+ 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 {
diff --git a/tests/auto/controls/data/tst_switchdelegate.qml b/tests/auto/controls/data/tst_switchdelegate.qml
index f0c3e68b..a1e6c072 100644
--- a/tests/auto/controls/data/tst_switchdelegate.qml
+++ b/tests/auto/controls/data/tst_switchdelegate.qml
@@ -523,4 +523,85 @@ TestCase {
compare(control.pressed, false)
verify(spy.success)
}
+
+ function test_spacing() {
+ var control = createTemporaryObject(switchDelegate, testCase, { text: "Some long, long, long text" })
+ verify(control)
+ verify(control.contentItem.implicitWidth + control.leftPadding + control.rightPadding > control.background.implicitWidth)
+
+ var textLabel = findChild(control.contentItem, "label")
+ verify(textLabel)
+
+ // The implicitWidth of the IconLabel that all buttons use as their contentItem should be
+ // equal to the implicitWidth of the Text and the switch indicator + spacing while no icon is set.
+ compare(control.contentItem.implicitWidth, textLabel.implicitWidth + control.indicator.width + control.spacing)
+
+ control.spacing += 100
+ compare(control.contentItem.implicitWidth, textLabel.implicitWidth + control.indicator.width + control.spacing)
+
+ compare(control.implicitWidth, textLabel.implicitWidth + control.indicator.width + control.spacing + control.leftPadding + control.rightPadding)
+ }
+
+ function test_display_data() {
+ return [
+ { "tag": "IconOnly", display: SwitchDelegate.IconOnly },
+ { "tag": "TextOnly", display: SwitchDelegate.TextOnly },
+ { "tag": "TextUnderIcon", display: SwitchDelegate.TextUnderIcon },
+ { "tag": "TextBesideIcon", display: SwitchDelegate.TextBesideIcon },
+ { "tag": "IconOnly, mirrored", display: SwitchDelegate.IconOnly, mirrored: true },
+ { "tag": "TextOnly, mirrored", display: SwitchDelegate.TextOnly, mirrored: true },
+ { "tag": "TextUnderIcon, mirrored", display: SwitchDelegate.TextUnderIcon, mirrored: true },
+ { "tag": "TextBesideIcon, mirrored", display: SwitchDelegate.TextBesideIcon, mirrored: true }
+ ]
+ }
+
+ function test_display(data) {
+ var control = createTemporaryObject(switchDelegate, testCase, {
+ text: "SwitchDelegate",
+ display: data.display,
+ width: 400,
+ "icon.source": "qrc:/qt-project.org/imports/QtQuick/Controls.2/images/check.png",
+ "LayoutMirroring.enabled": !!data.mirrored
+ })
+ verify(control)
+ verify(control.icon.source.length > 0)
+
+ var iconImage = findChild(control.contentItem, "image")
+ var textLabel = findChild(control.contentItem, "label")
+
+ var availableWidth = control.availableWidth - control.indicator.width - control.spacing
+ var indicatorOffset = control.mirrored ? control.indicator.width + control.spacing : 0
+
+ switch (control.display) {
+ case SwitchDelegate.IconOnly:
+ verify(iconImage)
+ verify(!textLabel)
+ compare(iconImage.x, indicatorOffset + (availableWidth - iconImage.width) / 2)
+ compare(iconImage.y, (control.availableHeight - iconImage.height) / 2)
+ break;
+ case SwitchDelegate.TextOnly:
+ verify(!iconImage)
+ verify(textLabel)
+ compare(textLabel.x, control.mirrored ? control.availableWidth - textLabel.width : 0)
+ compare(textLabel.y, (control.availableHeight - textLabel.height) / 2)
+ break;
+ case SwitchDelegate.TextUnderIcon:
+ verify(iconImage)
+ verify(textLabel)
+ compare(iconImage.x, indicatorOffset + (availableWidth - iconImage.width) / 2)
+ compare(textLabel.x, indicatorOffset + (availableWidth - textLabel.width) / 2)
+ verify(iconImage.y < textLabel.y)
+ break;
+ case SwitchDelegate.TextBesideIcon:
+ verify(iconImage)
+ verify(textLabel)
+ if (control.mirrored)
+ verify(textLabel.x < iconImage.x)
+ else
+ verify(iconImage.x < textLabel.x)
+ compare(iconImage.y, (control.availableHeight - iconImage.height) / 2)
+ compare(textLabel.y, (control.availableHeight - textLabel.height) / 2)
+ break;
+ }
+ }
}