From 283457b64dcd178ca5aa8f15d845a47455b709c1 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Fri, 29 Jan 2016 09:53:22 +0100 Subject: Default SpinBox: sync colors with TextField and TextArea Change-Id: Ibbc6dda27172425250e0543817b4ab5b303bded5 Reviewed-by: Mitch Curtis --- src/imports/controls/SpinBox.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/SpinBox.qml b/src/imports/controls/SpinBox.qml index 947ec74a..77f89206 100644 --- a/src/imports/controls/SpinBox.qml +++ b/src/imports/controls/SpinBox.qml @@ -69,8 +69,8 @@ T.SpinBox { font: control.font color: "#353637" -// selectionColor: TODO -// selectedTextColor: TODO + selectionColor: "#fddd5c" + selectedTextColor: color horizontalAlignment: Qt.AlignHCenter verticalAlignment: Qt.AlignVCenter -- cgit v1.2.3 From 584b768cd051deb1da28cad5b9aaa15975c05b8d Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Fri, 29 Jan 2016 10:37:37 +0100 Subject: Tweak default style tabs Remove the explicit font size leftover, and tweak the implicit size bindings so that neither tst_accessibility nor tst_snippets throws any binding loop warnings. Change-Id: Ib60dc8a1fca33b14171320db3f37e65c046f5898 Reviewed-by: J-P Nurmi --- src/imports/controls/TabBar.qml | 7 ++----- src/imports/controls/TabButton.qml | 2 -- 2 files changed, 2 insertions(+), 7 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/TabBar.qml b/src/imports/controls/TabBar.qml index b1a9009c..f43975f2 100644 --- a/src/imports/controls/TabBar.qml +++ b/src/imports/controls/TabBar.qml @@ -50,7 +50,7 @@ T.TabBar { //! [contentItem] contentItem: ListView { implicitWidth: contentWidth - implicitHeight: contentHeight + implicitHeight: 40 model: control.contentModel currentIndex: control.currentIndex @@ -63,9 +63,6 @@ T.TabBar { //! [contentItem] //! [background] - background: Rectangle { - implicitWidth: 40 - implicitHeight: 40 - } + background: Rectangle { } //! [background] } diff --git a/src/imports/controls/TabButton.qml b/src/imports/controls/TabButton.qml index ef11e405..178a0a7f 100644 --- a/src/imports/controls/TabButton.qml +++ b/src/imports/controls/TabButton.qml @@ -48,8 +48,6 @@ T.TabButton { padding: 6 - font.pointSize: 10 - //! [label] label: Text { x: control.leftPadding -- cgit v1.2.3 From eb61b50ffc8e3f6640de14b4b256f2ed858100a1 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Fri, 29 Jan 2016 16:23:01 +0100 Subject: ComboBox: enable scroll indicators For some reason this crashes: ScrollIndicator.vertical: ScrollIndicator { } But using the attached property via template works: T.ScrollIndicator.vertical: ScrollIndicator { } Good enough solution for now. :) Change-Id: I7a631a66ad24b1ddf7852c7c11d3850e49a52c9b Task-number: QTBUG-50757 Reviewed-by: J-P Nurmi --- src/imports/controls/ComboBox.qml | 2 +- src/imports/controls/material/ComboBox.qml | 2 +- src/imports/controls/universal/ComboBox.qml | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/ComboBox.qml b/src/imports/controls/ComboBox.qml index adbf8aad..e0e8d76f 100644 --- a/src/imports/controls/ComboBox.qml +++ b/src/imports/controls/ComboBox.qml @@ -117,7 +117,7 @@ T.ComboBox { color: "transparent" } -// ScrollIndicator.vertical: ScrollIndicator { } + T.ScrollIndicator.vertical: ScrollIndicator { } } background: Rectangle { } diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml index b822bfd2..f556107c 100644 --- a/src/imports/controls/material/ComboBox.qml +++ b/src/imports/controls/material/ComboBox.qml @@ -129,7 +129,7 @@ T.ComboBox { model: control.popup.visible ? control.delegateModel : null currentIndex: control.highlightedIndex -// ScrollIndicator.vertical: ScrollIndicator { } + T.ScrollIndicator.vertical: ScrollIndicator { } } background: Rectangle { diff --git a/src/imports/controls/universal/ComboBox.qml b/src/imports/controls/universal/ComboBox.qml index 30dac42a..e450685f 100644 --- a/src/imports/controls/universal/ComboBox.qml +++ b/src/imports/controls/universal/ComboBox.qml @@ -118,7 +118,7 @@ T.ComboBox { model: control.popup.visible ? control.delegateModel : null currentIndex: control.highlightedIndex -// ScrollIndicator.vertical: ScrollIndicator { } + T.ScrollIndicator.vertical: ScrollIndicator { } } background: Rectangle { -- cgit v1.2.3 From 5199f3e4f0c4aa08d6713beebb8c7b90f5c29e42 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Fri, 29 Jan 2016 08:59:02 +0100 Subject: Update TabBar and TabButton screenshots Change-Id: I5aec1c2a08b24e1779e62b9580a740fb102c1561 Reviewed-by: J-P Nurmi --- .../controls/doc/images/qtlabscontrols-tabbar.gif | Bin 5932 -> 8590 bytes .../controls/doc/images/qtlabscontrols-tabbar.png | Bin 3463 -> 4725 bytes .../controls/doc/images/qtlabscontrols-tabbutton.png | Bin 3477 -> 4728 bytes 3 files changed, 0 insertions(+), 0 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/doc/images/qtlabscontrols-tabbar.gif b/src/imports/controls/doc/images/qtlabscontrols-tabbar.gif index 0dccecb3..31db1f9e 100644 Binary files a/src/imports/controls/doc/images/qtlabscontrols-tabbar.gif and b/src/imports/controls/doc/images/qtlabscontrols-tabbar.gif differ diff --git a/src/imports/controls/doc/images/qtlabscontrols-tabbar.png b/src/imports/controls/doc/images/qtlabscontrols-tabbar.png index 100092f8..44a91d63 100644 Binary files a/src/imports/controls/doc/images/qtlabscontrols-tabbar.png and b/src/imports/controls/doc/images/qtlabscontrols-tabbar.png differ diff --git a/src/imports/controls/doc/images/qtlabscontrols-tabbutton.png b/src/imports/controls/doc/images/qtlabscontrols-tabbutton.png index ab05c1db..76d1e35c 100644 Binary files a/src/imports/controls/doc/images/qtlabscontrols-tabbutton.png and b/src/imports/controls/doc/images/qtlabscontrols-tabbutton.png differ -- cgit v1.2.3 From 509b610267fd1f9eef5e22267a0cab6fae4a3752 Mon Sep 17 00:00:00 2001 From: Nikita Krupenko Date: Fri, 29 Jan 2016 00:06:43 +0200 Subject: Material: adjust sizes of checkable controls Made Switch indicator and handle smaller to be more like the native switch on Android. Also, increased the sizes of Switch and its Ripple CheckBox, and RadioButton to to correspond minimum touch target size 48x48. Change-Id: Icce70215910b677d989182fbb3b40161033601f8 Reviewed-by: J-P Nurmi Reviewed-by: Nikita Krupenko Reviewed-by: Mitch Curtis --- src/imports/controls/material/CheckBox.qml | 7 +++++-- src/imports/controls/material/RadioButton.qml | 7 +++++-- src/imports/controls/material/Switch.qml | 16 ++++++++-------- 3 files changed, 18 insertions(+), 12 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/material/CheckBox.qml b/src/imports/controls/material/CheckBox.qml index 939d5a31..e7fbadaa 100644 --- a/src/imports/controls/material/CheckBox.qml +++ b/src/imports/controls/material/CheckBox.qml @@ -50,8 +50,11 @@ T.CheckBox { indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) baselineOffset: label ? label.y + label.baselineOffset : 0 - padding: 6 - spacing: 6 + spacing: 8 + topPadding: 14 + leftPadding: 8 + rightPadding: 8 + bottomPadding: 14 //! [indicator] indicator: Rectangle { diff --git a/src/imports/controls/material/RadioButton.qml b/src/imports/controls/material/RadioButton.qml index 96605311..25d91a5c 100644 --- a/src/imports/controls/material/RadioButton.qml +++ b/src/imports/controls/material/RadioButton.qml @@ -50,8 +50,11 @@ T.RadioButton { indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) baselineOffset: label ? label.y + label.baselineOffset : 0 - padding: 6 - spacing: 6 + spacing: 8 + topPadding: 14 + leftPadding: 8 + rightPadding: 8 + bottomPadding: 14 //! [indicator] indicator: Rectangle { diff --git a/src/imports/controls/material/Switch.qml b/src/imports/controls/material/Switch.qml index 7c8e4395..f44fb31a 100644 --- a/src/imports/controls/material/Switch.qml +++ b/src/imports/controls/material/Switch.qml @@ -51,20 +51,20 @@ T.Switch { indicator ? indicator.implicitHeight : 0) + topPadding + bottomPadding) baselineOffset: label ? label.y + label.baselineOffset : 0 - padding: 6 - spacing: 6 + padding: 8 + spacing: 8 //! [indicator] indicator: Item { x: text ? (control.mirrored ? control.width - width - control.rightPadding : control.leftPadding) : control.leftPadding + (control.availableWidth - width) / 2 y: control.topPadding + (control.availableHeight - height) / 2 - implicitWidth: 40 - implicitHeight: 20 + implicitWidth: 38 + implicitHeight: 32 Ripple { x: handle.x + handle.width / 2 - width / 2 y: handle.y + handle.height / 2 - height / 2 - width: handle.width - 4 + width: handle.width height: width control: control colored: control.checked @@ -73,7 +73,7 @@ T.Switch { Rectangle { width: parent.width - height: 16 + height: 14 radius: height / 2 y: parent.height / 2 - height / 2 color: control.enabled ? (control.checked ? control.Material.switchCheckedTrackColor : control.Material.switchUncheckedTrackColor) @@ -84,8 +84,8 @@ T.Switch { id: handle x: Math.max(0, Math.min(parent.width - width, control.visualPosition * parent.width - (width / 2))) y: (parent.height - height) / 2 - width: 24 - height: 24 + width: 20 + height: 20 radius: width / 2 color: control.enabled ? (control.checked ? control.Material.switchCheckedHandleColor : control.Material.switchUncheckedHandleColor) : control.Material.switchDisabledHandleColor -- cgit v1.2.3 From bb06d8913c4e781a37db100e2619a236a93b38a9 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Fri, 29 Jan 2016 19:39:27 +0100 Subject: Material CheckBox: fix disabled state Change-Id: Ia0b95ed25cad55477d90038db39ac22a6a3932ed Reviewed-by: Mitch Curtis --- src/imports/controls/material/CheckBox.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/imports') diff --git a/src/imports/controls/material/CheckBox.qml b/src/imports/controls/material/CheckBox.qml index e7fbadaa..1c3e254b 100644 --- a/src/imports/controls/material/CheckBox.qml +++ b/src/imports/controls/material/CheckBox.qml @@ -64,7 +64,7 @@ T.CheckBox { implicitWidth: 20 implicitHeight: 20 color: "transparent" - border.color: control.checked ? control.Material.accentColor : control.Material.secondaryTextColor + border.color: control.checked && control.enabled ? control.Material.accentColor : control.Material.secondaryTextColor border.width: control.checked ? width / 2 : 2 radius: 2 -- cgit v1.2.3 From e8f1c609bf612c39bd45778bd22b693c39e3d059 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Fri, 29 Jan 2016 19:37:45 +0100 Subject: CheckBox: support partially checked state for Default & Universal Change-Id: Id2614c2f441718ef21445ef42c7d64ff64e072ce Task-number: QTBUG-49961 Reviewed-by: J-P Nurmi --- src/imports/controls/CheckBox.qml | 11 ++++++++++- src/imports/controls/material/CheckBox.qml | 22 ++++++++++++++++++---- 2 files changed, 28 insertions(+), 5 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/CheckBox.qml b/src/imports/controls/CheckBox.qml index 20d8ef1c..4b7af3b1 100644 --- a/src/imports/controls/CheckBox.qml +++ b/src/imports/controls/CheckBox.qml @@ -67,7 +67,16 @@ T.CheckBox { x: (parent.width - width) / 2 y: (parent.height - height) / 2 source: "qrc:/qt-project.org/imports/Qt/labs/controls/images/check.png" - visible: control.checked + visible: control.checkState === Qt.Checked + } + + Rectangle { + x: (parent.width - width) / 2 + y: (parent.height - height) / 2 + width: 16 + height: 3 + color: "#353637" + visible: control.checkState === Qt.PartiallyChecked } } //! [indicator] diff --git a/src/imports/controls/material/CheckBox.qml b/src/imports/controls/material/CheckBox.qml index 1c3e254b..5becfc5c 100644 --- a/src/imports/controls/material/CheckBox.qml +++ b/src/imports/controls/material/CheckBox.qml @@ -100,15 +100,29 @@ T.CheckBox { source: "qrc:/qt-project.org/imports/Qt/labs/controls/material/images/check.png" fillMode: Image.PreserveAspectFit - scale: control.checked ? 1 : 0 + scale: control.checkState === Qt.Checked ? 1 : 0 Behavior on scale { NumberAnimation { duration: 100 } } } - states: State { - name: "checked" - when: control.checked + Rectangle { + x: (parent.width - width) / 2 + y: (parent.height - height) / 2 + width: 12 + height: 3 + visible: control.checkState === Qt.PartiallyChecked } + states: [ + State { + name: "checked" + when: control.checkState === Qt.Checked + }, + State { + name: "partiallychecked" + when: control.checkState === Qt.PartiallyChecked + } + ] + transitions: Transition { SequentialAnimation { NumberAnimation { -- cgit v1.2.3 From 3d246f823273518b594c17c17827ce165fd116e1 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Sat, 30 Jan 2016 10:11:28 +0100 Subject: Material ComboBox: round popup corners Change-Id: I644ab29bd814119cd3b631925cded8fc5bda4244 Reviewed-by: J-P Nurmi --- src/imports/controls/material/ComboBox.qml | 1 + 1 file changed, 1 insertion(+) (limited to 'src/imports') diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml index f556107c..1aecaa3f 100644 --- a/src/imports/controls/material/ComboBox.qml +++ b/src/imports/controls/material/ComboBox.qml @@ -133,6 +133,7 @@ T.ComboBox { } background: Rectangle { + radius: 3 color: control.Material.dialogColor layer.enabled: control.enabled -- cgit v1.2.3 From fcb7cb051ce56bb913732501ab1271ef7738efba Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Sat, 30 Jan 2016 16:10:13 +0100 Subject: Update plugins.qmltypes Change-Id: I1b7c15c57ca491561bf082ab53967455a6299529 Reviewed-by: J-P Nurmi --- src/imports/controls/plugins.qmltypes | 13 ++++++++++--- src/imports/templates/plugins.qmltypes | 13 ++++++++++--- 2 files changed, 20 insertions(+), 6 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/plugins.qmltypes b/src/imports/controls/plugins.qmltypes index d52c6153..75805fdd 100644 --- a/src/imports/controls/plugins.qmltypes +++ b/src/imports/controls/plugins.qmltypes @@ -363,9 +363,11 @@ Module { name: "ClosePolicy" values: { "NoAutoClose": 0, - "CloseOnPressOutside": 1, - "CloseOnReleaseOutside": 2, - "CloseOnEscape": 4 + "OnPressOutside": 1, + "OnPressOutsideParent": 2, + "OnReleaseOutside": 4, + "OnReleaseOutsideParent": 8, + "OnEscape": 16 } } Enum { @@ -392,6 +394,11 @@ Module { Property { name: "contentHeight"; type: "double" } Property { name: "availableWidth"; type: "double"; isReadonly: true } Property { name: "availableHeight"; type: "double"; isReadonly: true } + Property { name: "margins"; type: "double" } + Property { name: "topMargin"; type: "double" } + Property { name: "leftMargin"; type: "double" } + Property { name: "rightMargin"; type: "double" } + Property { name: "bottomMargin"; type: "double" } Property { name: "padding"; type: "double" } Property { name: "topPadding"; type: "double" } Property { name: "leftPadding"; type: "double" } diff --git a/src/imports/templates/plugins.qmltypes b/src/imports/templates/plugins.qmltypes index 67058870..d96563a7 100644 --- a/src/imports/templates/plugins.qmltypes +++ b/src/imports/templates/plugins.qmltypes @@ -357,9 +357,11 @@ Module { name: "ClosePolicy" values: { "NoAutoClose": 0, - "CloseOnPressOutside": 1, - "CloseOnReleaseOutside": 2, - "CloseOnEscape": 4 + "OnPressOutside": 1, + "OnPressOutsideParent": 2, + "OnReleaseOutside": 4, + "OnReleaseOutsideParent": 8, + "OnEscape": 16 } } Enum { @@ -386,6 +388,11 @@ Module { Property { name: "contentHeight"; type: "double" } Property { name: "availableWidth"; type: "double"; isReadonly: true } Property { name: "availableHeight"; type: "double"; isReadonly: true } + Property { name: "margins"; type: "double" } + Property { name: "topMargin"; type: "double" } + Property { name: "leftMargin"; type: "double" } + Property { name: "rightMargin"; type: "double" } + Property { name: "bottomMargin"; type: "double" } Property { name: "padding"; type: "double" } Property { name: "topPadding"; type: "double" } Property { name: "leftPadding"; type: "double" } -- cgit v1.2.3 From cb86fefb321a05eb50b905a696401542acf7d441 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Sat, 30 Jan 2016 16:21:16 +0100 Subject: Allow ComboBox popup to use more screen space Change-Id: Icd2ee375d7886c1d4d61577fc9e196cfa5d910d1 Task-number: QTBUG-50758 Reviewed-by: J-P Nurmi --- src/imports/controls/ComboBox.qml | 4 +++- src/imports/controls/material/ComboBox.qml | 4 +++- src/imports/controls/universal/ComboBox.qml | 4 +++- 3 files changed, 9 insertions(+), 3 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/ComboBox.qml b/src/imports/controls/ComboBox.qml index e0e8d76f..189eed92 100644 --- a/src/imports/controls/ComboBox.qml +++ b/src/imports/controls/ComboBox.qml @@ -100,7 +100,9 @@ T.ComboBox { popup: T.Popup { y: control.height - 1 implicitWidth: control.width - implicitHeight: Math.min(200, listview.contentHeight) + implicitHeight: Math.min(396, listview.contentHeight) + topMargin: 6 + bottomMargin: 6 contentItem: ListView { id: listview diff --git a/src/imports/controls/material/ComboBox.qml b/src/imports/controls/material/ComboBox.qml index 1aecaa3f..351feead 100644 --- a/src/imports/controls/material/ComboBox.qml +++ b/src/imports/controls/material/ComboBox.qml @@ -108,8 +108,10 @@ T.ComboBox { popup: T.Popup { y: control.height implicitWidth: control.width - implicitHeight: Math.min(200, listview.contentHeight) + implicitHeight: Math.min(396, listview.contentHeight) transformOrigin: Item.Top + topMargin: 12 + bottomMargin: 12 enter: Transition { // grow_fade_in diff --git a/src/imports/controls/universal/ComboBox.qml b/src/imports/controls/universal/ComboBox.qml index e450685f..5c0f1004 100644 --- a/src/imports/controls/universal/ComboBox.qml +++ b/src/imports/controls/universal/ComboBox.qml @@ -110,7 +110,9 @@ T.ComboBox { //! [popup] popup: T.Popup { implicitWidth: control.width - implicitHeight: Math.min(200, listview.contentHeight) // TODO: 396 + implicitHeight: Math.min(396, listview.contentHeight) + topMargin: 8 + bottomMargin: 8 contentItem: ListView { id: listview -- cgit v1.2.3 From 7fc567eda8a187e365f4c29c6e8f08440bf31218 Mon Sep 17 00:00:00 2001 From: J-P Nurmi Date: Sat, 30 Jan 2016 17:21:55 +0100 Subject: Make popups work without ApplicationWindow, to some degree Using ApplicationWindow is highly recommended. First of all, with a plain Window, QQuickPopup attempts to set a high z-value, but cannot guarantee correct stacking order. Secondly, we cannot provide style- specific background dimming for modal popups, because it is styled as part of ApplicationWindow. Last but not least, QQuickPopup has to install a window-level event filter, which is far less efficient than how event handling done in QQuickOverlay. Change-Id: I08915abce7a1764177b92f7539eef77c054a405a Task-number: QTBUG-49921 Reviewed-by: J-P Nurmi --- src/imports/controls/Drawer.qml | 3 ++- src/imports/controls/material/Drawer.qml | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) (limited to 'src/imports') diff --git a/src/imports/controls/Drawer.qml b/src/imports/controls/Drawer.qml index eb4e3e57..60abeb0c 100644 --- a/src/imports/controls/Drawer.qml +++ b/src/imports/controls/Drawer.qml @@ -35,12 +35,13 @@ ****************************************************************************/ import QtQuick 2.6 +import QtQuick.Window 2.2 import Qt.labs.templates 1.0 as T T.Drawer { id: control - parent: T.ApplicationWindow.overlay + parent: T.ApplicationWindow.overlay || Window.contentItem width: parent ? parent.width : 0 // TODO: Window.width height: parent ? parent.height : 0 // TODO: Window.height diff --git a/src/imports/controls/material/Drawer.qml b/src/imports/controls/material/Drawer.qml index cb00096d..133ea9c8 100644 --- a/src/imports/controls/material/Drawer.qml +++ b/src/imports/controls/material/Drawer.qml @@ -35,13 +35,14 @@ ****************************************************************************/ import QtQuick 2.6 +import QtQuick.Window 2.2 import Qt.labs.templates 1.0 as T import Qt.labs.controls.material 1.0 T.Drawer { id: control - parent: T.ApplicationWindow.overlay + parent: T.ApplicationWindow.overlay || Window.contentItem width: parent ? parent.width : 0 // TODO: Window.width height: parent ? parent.height : 0 // TODO: Window.height -- cgit v1.2.3