From ffb2c6014efa0df2548f5c432e741023fcc69a72 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 22:09:46 +0100 Subject: Remove obsolote Label item MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit We've already ported everything to MobileComponents.Label, so this file can be taken behind the barn, never to be seen again. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/components/Label.qml | 6 ------ qt-mobile/qml/mobile-resources.qrc | 1 - 2 files changed, 7 deletions(-) delete mode 100644 qt-mobile/qml/components/Label.qml (limited to 'qt-mobile') diff --git a/qt-mobile/qml/components/Label.qml b/qt-mobile/qml/components/Label.qml deleted file mode 100644 index 65af7e0db..000000000 --- a/qt-mobile/qml/components/Label.qml +++ /dev/null @@ -1,6 +0,0 @@ -import QtQuick 2.5 -import org.kde.plasma.mobilecomponents 0.2 as MobileComponents - -Text { - color: MobileComponents.Theme.textColor -} diff --git a/qt-mobile/qml/mobile-resources.qrc b/qt-mobile/qml/mobile-resources.qrc index 971c2e427..8abdcd9d6 100644 --- a/qt-mobile/qml/mobile-resources.qrc +++ b/qt-mobile/qml/mobile-resources.qrc @@ -11,7 +11,6 @@ ThemeTest.qml StartPage.qml dive.jpg - components/Label.qml ../../icons/subsurface-mobile-icon.png -- cgit v1.2.3-70-g09d2 From e0fc5268fe308d8f60ee96bb2c03c49a5fa4a524 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 22:12:49 +0100 Subject: Sync with mobilecomponents 54e4f2622a MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This fixes loading the icon. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/mobilecomponents/Icon.qml | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobilecomponents/Icon.qml b/qt-mobile/qml/mobilecomponents/Icon.qml index d5b253235..b28624dbf 100644 --- a/qt-mobile/qml/mobilecomponents/Icon.qml +++ b/qt-mobile/qml/mobilecomponents/Icon.qml @@ -19,6 +19,7 @@ import QtQuick 2.0 import QtGraphicalEffects 1.0 +import org.kde.plasma.mobilecomponents 0.2 Item { id: root @@ -26,13 +27,13 @@ Item { property alias smooth: image.smooth property bool active: false property bool valid: image.status == Image.Ready - implicitWidth: image.sourceSize.width - implicitHeight: image.sourceSize.height + implicitWidth: Math.min(image.sourceSize.width, Units.iconSizes.medium) + implicitHeight: Math.min(image.sourceSize.height, Units.iconSizes.medium) Image { id: image anchors.fill: parent - source: root.source != "" ? "icons/" + root.source + ".svg" : root.source + source: root.source != "" ? (root.source.indexOf(".") === -1 ? "icons/" + root.source + ".svg" : root.source) : root.source } GammaAdjust { anchors.fill: image -- cgit v1.2.3-70-g09d2 From 33d589ff5cf3b7189abad40c2dd2f4f62b82c7bc Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 22:17:35 +0100 Subject: Add missing icon MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This is the SVG file used on the drag button. Like the other two, it's taken from the Breeze icon set. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/mobile-resources.qrc | 1 + .../icons/distribute-horizontal-x.svg | 102 +++++++++++++++++++++ 2 files changed, 103 insertions(+) create mode 100644 qt-mobile/qml/mobilecomponents/icons/distribute-horizontal-x.svg (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobile-resources.qrc b/qt-mobile/qml/mobile-resources.qrc index 8abdcd9d6..19c580da0 100644 --- a/qt-mobile/qml/mobile-resources.qrc +++ b/qt-mobile/qml/mobile-resources.qrc @@ -34,5 +34,6 @@ mobilecomponents/private/qmldir mobilecomponents/icons/go-next.svg mobilecomponents/icons/go-previous.svg + mobilecomponents/icons/distribute-horizontal-x.svg diff --git a/qt-mobile/qml/mobilecomponents/icons/distribute-horizontal-x.svg b/qt-mobile/qml/mobilecomponents/icons/distribute-horizontal-x.svg new file mode 100644 index 000000000..1a14480d7 --- /dev/null +++ b/qt-mobile/qml/mobilecomponents/icons/distribute-horizontal-x.svg @@ -0,0 +1,102 @@ + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + -- cgit v1.2.3-70-g09d2 From 609d138a490ed6eddfd4594775cef157f8ceaf61 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 22:24:04 +0100 Subject: sync with mobilecomponents' d3fa79b50b54 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This fixes the flickering when the drag button hits the right edge. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/mobilecomponents/ApplicationWindow.qml | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml b/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml index 71980f9e6..220d0524c 100644 --- a/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml +++ b/qt-mobile/qml/mobilecomponents/ApplicationWindow.qml @@ -20,6 +20,7 @@ import QtQuick 2.1 import QtQuick.Controls 1.3 import "private" +import org.kde.plasma.mobilecomponents 0.2 /** * A window that provides some basic features needed for all apps @@ -73,6 +74,9 @@ ApplicationWindow { contextDrawer.parent = contentItem.parent; } + width: Units.gridUnit * 25 + height: Units.gridUnit * 30 + property alias actionButton: __actionButton ActionButton { id: __actionButton -- cgit v1.2.3-70-g09d2 From 8646934ba351e092089876a018a3e4886cc98794 Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Sun, 29 Nov 2015 22:51:49 +0100 Subject: Simple DiveList as initial Page Simplify the default page in main.qml: DiveList has everything needed, remove the outside layout and the message bar Signed-off-by: Marco Martin --- qt-mobile/qml/main.qml | 42 ++++-------------------------------------- 1 file changed, 4 insertions(+), 38 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/main.qml b/qt-mobile/qml/main.qml index 53d872743..26b8ed0e6 100644 --- a/qt-mobile/qml/main.qml +++ b/qt-mobile/qml/main.qml @@ -11,7 +11,6 @@ import org.kde.plasma.mobilecomponents 0.2 as MobileComponents MobileComponents.ApplicationWindow { title: qsTr("Subsurface mobile") property bool fullscreen: true - property alias messageText: message.text FontMetrics { id: fontMetrics @@ -208,43 +207,10 @@ MobileComponents.ApplicationWindow { } property Item stackView: pageStack - initialPage: Item { - width: parent.width - height: parent.height - - ColumnLayout { - id: awLayout - anchors.fill: parent - spacing: MobileComponents.Units.gridUnit / 2 - - Rectangle { - id: detailsPage - Layout.fillHeight: true - Layout.fillWidth: true - - DiveList { - anchors.fill: detailsPage - id: diveDetails - color: MobileComponents.Theme.backgroundColor - } - } - - - Rectangle { - id: messageArea - height: childrenRect.height - Layout.fillWidth: true - color: MobileComponents.Theme.backgroundColor - - Text { - id: message - color: MobileComponents.Theme.textColor - wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere - styleColor: MobileComponents.Theme.textColor - font.pointSize: MobileComponents.Units.smallPointSize - } - } - } + initialPage: DiveList { + anchors.fill: detailsPage + id: diveDetails + color: MobileComponents.Theme.backgroundColor } QMLManager { -- cgit v1.2.3-70-g09d2 From 8e523329b686023d4ca69226daa5bf079035a02b Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Sun, 29 Nov 2015 22:56:16 +0100 Subject: fix contents size correct childrenRect mistakedly called contentRect Signed-off-by: Marco Martin --- qt-mobile/qml/DiveDetails.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml index e69d0e672..c068ff498 100644 --- a/qt-mobile/qml/DiveDetails.qml +++ b/qt-mobile/qml/DiveDetails.qml @@ -36,7 +36,7 @@ MobileComponents.Page { Item { id: content width: flick.width - height: contentRect.height + MobileComponents.Units.smallSpacing * 2 + height: childrenRect.height + MobileComponents.Units.smallSpacing * 2 ColumnLayout { anchors { -- cgit v1.2.3-70-g09d2 From 95c5b355838fbafa691a3ea74929de7bb8c93ee5 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 23:28:53 +0100 Subject: Add a bit of spacing below the dive details MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This achieves two things: - make the contents not seem crammed against the bottom - allow the user to scroll the content above the drawer icon Signed-off-by: Sebastian Kügler --- qt-mobile/qml/DiveDetails.qml | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml index c068ff498..7729e7fa5 100644 --- a/qt-mobile/qml/DiveDetails.qml +++ b/qt-mobile/qml/DiveDetails.qml @@ -156,6 +156,10 @@ MobileComponents.Page { wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere } } + Item { + height: MobileComponents.Units.gridUnit * 3 + width: height // just to make sure the spacer doesn't produce scrollbars, but also isn't null + } } } } -- cgit v1.2.3-70-g09d2 From 78d5325dda8eadee8004183314195f2d61ffeb53 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 23:39:14 +0100 Subject: Simplify dive list items MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Replace the custom text items with the Components' label - Remove now unneeded properties The goal is to use less different font sizes, as to give the listview a calmer and more uniform look. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/DiveDetails.qml | 14 +++++++------- qt-mobile/qml/DiveList.qml | 43 ++++++++++++++++--------------------------- qt-mobile/qml/main.qml | 2 +- 3 files changed, 24 insertions(+), 35 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml index 7729e7fa5..a905064d7 100644 --- a/qt-mobile/qml/DiveDetails.qml +++ b/qt-mobile/qml/DiveDetails.qml @@ -89,7 +89,7 @@ MobileComponents.Page { } } } - Label { + MobileComponents.Label { text: "Location:" } TextField { @@ -97,7 +97,7 @@ MobileComponents.Page { Layout.fillWidth: true } - Label { + MobileComponents.Label { text: "Air Temp:" } TextField { @@ -106,7 +106,7 @@ MobileComponents.Page { Layout.fillWidth: true } - Label { + MobileComponents.Label { text: "Water Temp:" } TextField { @@ -115,7 +115,7 @@ MobileComponents.Page { Layout.fillWidth: true } - Label { + MobileComponents.Label { text: "Suit:" } @@ -125,7 +125,7 @@ MobileComponents.Page { Layout.fillWidth: true } - Label { + MobileComponents.Label { text: "Buddy:" } TextField { @@ -134,7 +134,7 @@ MobileComponents.Page { Layout.fillWidth: true } - Label { + MobileComponents.Label { text: "Dive Master:" } TextField { @@ -143,7 +143,7 @@ MobileComponents.Page { Layout.fillWidth: true } - Label { + MobileComponents.Label { text: "Notes:" } TextEdit{ diff --git a/qt-mobile/qml/DiveList.qml b/qt-mobile/qml/DiveList.qml index 75f4f809e..ed75c96f8 100644 --- a/qt-mobile/qml/DiveList.qml +++ b/qt-mobile/qml/DiveList.qml @@ -39,22 +39,15 @@ MobileComponents.Page { stackView.push(detailsWindow) } - //Layout of the page: (mini profile, dive no, date at the top - //And other details at the bottom. Item { - x: MobileComponents.Units.smallSpacing + x: -1 * MobileComponents.Units.smallSpacing width: parent.width - MobileComponents.Units.smallSpacing * 2 - height: childrenRect.height + MobileComponents.Units.smallSpacing * 2 - //spacing: MobileComponents.Units.smallSpacing / 2 - anchors.margins: MobileComponents.Units.smallSpacing + height: childrenRect.height - MobileComponents.Units.smallSpacing - Text { + MobileComponents.Label { id: locationText text: location - color: MobileComponents.Theme.textColor - //font.pointSize: Math.round(MobileComponents.Units.fontMetrics.pointSize * 1.2) // why this doesn't work is a mystery to me, so ... - scale: 1.2 // Let's see how this works, otherwise, we'll need the default point size somewhere - transformOrigin: Item.TopLeft + font.weight: Font.Light elide: Text.ElideRight maximumLineCount: 1 // needed for elide to work at all anchors { @@ -63,16 +56,14 @@ MobileComponents.Page { right: dateLabel.left } } - Text { + MobileComponents.Label { id: dateLabel text: date opacity: 0.6 - color: MobileComponents.Theme.textColor font.pointSize: subsurfaceTheme.smallPointSize anchors { right: parent.right top: parent.top - bottomMargin: MobileComponents.Units.smallSpacing / 2 } } Row { @@ -82,36 +73,34 @@ MobileComponents.Page { right: parent.right bottom: numberText.bottom } - Text { + MobileComponents.Label { text: 'Depth: ' opacity: 0.6 - color: MobileComponents.Theme.textColor + font.pointSize: subsurfaceTheme.smallPointSize } - Text { + MobileComponents.Label { text: depth width: Math.max(MobileComponents.Units.gridUnit * 3, paintedWidth) // helps vertical alignment throughout listview - color: MobileComponents.Theme.textColor + font.pointSize: subsurfaceTheme.smallPointSize } - Text { + MobileComponents.Label { text: 'Duration: ' opacity: 0.6 - color: MobileComponents.Theme.textColor + font.pointSize: subsurfaceTheme.smallPointSize } - Text { + MobileComponents.Label { text: duration - color: MobileComponents.Theme.textColor + font.pointSize: subsurfaceTheme.smallPointSize } } - Text { + MobileComponents.Label { id: numberText text: "#" + diveNumber color: MobileComponents.Theme.textColor - scale: 1.2 - transformOrigin: Item.BottomRight - opacity: 0.4 + font.pointSize: subsurfaceTheme.smallPointSize + opacity: 0.6 anchors { right: parent.right - topMargin: MobileComponents.Units.smallSpacing top: locationText.bottom } } diff --git a/qt-mobile/qml/main.qml b/qt-mobile/qml/main.qml index 26b8ed0e6..dd1999e03 100644 --- a/qt-mobile/qml/main.qml +++ b/qt-mobile/qml/main.qml @@ -111,7 +111,7 @@ MobileComponents.ApplicationWindow { QtObject { id: subsurfaceTheme property int titlePointSize: Math.round(fontMetrics.font.pointSize * 1.5) - property int smallPointSize: Math.round(fontMetrics.font.pointSize * 0.7) + property int smallPointSize: Math.round(fontMetrics.font.pointSize * 0.8) property color accentColor: "#2d5b9a" property color accentTextColor: "#ececec" } -- cgit v1.2.3-70-g09d2 From b96f202f14ab4703057116ac1c1bba601da75a99 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Sun, 29 Nov 2015 23:39:14 +0100 Subject: sync with mobilecomponents 67e73fa85e MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Colors have slightly changed in breeze. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/mobilecomponents/Theme.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobilecomponents/Theme.qml b/qt-mobile/qml/mobilecomponents/Theme.qml index fd8c49ba2..402caedb6 100644 --- a/qt-mobile/qml/mobilecomponents/Theme.qml +++ b/qt-mobile/qml/mobilecomponents/Theme.qml @@ -41,12 +41,12 @@ QtObject { property color visitedLinkColor: "#2196F3" property color buttonTextColor: Qt.rgba(0,0,0, 0.54) - property color buttonBackgroundColor: "#f3f3f3" + property color buttonBackgroundColor: "#eff0f1" property color buttonHoverColor: "#2196F3" property color buttonFocusColor: "#2196F3" property color viewTextColor: Qt.rgba(0,0,0, 0.54) - property color viewBackgroundColor: "#f3f3f3" + property color viewBackgroundColor: "#fcfcfc" property color viewHoverColor: "#2196F3" property color viewFocusColor: "#2196F3" -- cgit v1.2.3-70-g09d2 From 13f78743c668629b41586427202b34724647fa56 Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Mon, 30 Nov 2015 00:01:53 +0100 Subject: Divelist has its own color don't reassign DiveList color upon declaration it's just redundant and error prone Signed-off-by: Marco Martin --- qt-mobile/qml/main.qml | 1 - 1 file changed, 1 deletion(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/main.qml b/qt-mobile/qml/main.qml index dd1999e03..bf282608c 100644 --- a/qt-mobile/qml/main.qml +++ b/qt-mobile/qml/main.qml @@ -210,7 +210,6 @@ MobileComponents.ApplicationWindow { initialPage: DiveList { anchors.fill: detailsPage id: diveDetails - color: MobileComponents.Theme.backgroundColor } QMLManager { -- cgit v1.2.3-70-g09d2 From f4906abf59cce798830e81c0362fab224516dcf9 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 00:57:18 +0100 Subject: Fix left margin in dive list MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Specifying a negative margin means that we negate the margin that the ListItem so carefully figures out for us, don't do that. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/DiveList.qml | 1 - 1 file changed, 1 deletion(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveList.qml b/qt-mobile/qml/DiveList.qml index ed75c96f8..77e8802f0 100644 --- a/qt-mobile/qml/DiveList.qml +++ b/qt-mobile/qml/DiveList.qml @@ -40,7 +40,6 @@ MobileComponents.Page { } Item { - x: -1 * MobileComponents.Units.smallSpacing width: parent.width - MobileComponents.Units.smallSpacing * 2 height: childrenRect.height - MobileComponents.Units.smallSpacing -- cgit v1.2.3-70-g09d2 From e12c784db44de46ec7454c4471e8da12ec84b147 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 01:04:09 +0100 Subject: Smaller topbar, no button in it anymore MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This change makes the top bar a information/decorational item, not interactive anymore. - The menu at the top-right is redundant, it is provided by the left-hand-side drawer and visually present through the botom-centered control button. - The back button is already provided on Android by default, swiping back in the UI also works, so this button provides a third method to go back -- that's overkill. Less is more. Less top bar means more screen estate for the meat. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/TopBar.qml | 44 +++++++------------------------------------- 1 file changed, 7 insertions(+), 37 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/TopBar.qml b/qt-mobile/qml/TopBar.qml index f07a88e47..0dd9751a1 100644 --- a/qt-mobile/qml/TopBar.qml +++ b/qt-mobile/qml/TopBar.qml @@ -14,29 +14,31 @@ Rectangle { property bool goBack: (stackView.depth > 1) color: subsurfaceTheme.accentColor - Layout.minimumHeight: MobileComponents.Units.gridUnit * 2 + MobileComponents.Units.largeSpacing + Layout.minimumHeight: MobileComponents.Units.gridUnit * 2 Layout.fillWidth: true Layout.margins: 0 RowLayout { anchors.bottom: topPart.bottom - anchors.bottomMargin: MobileComponents.Units.largeSpacing / 2 + anchors.bottomMargin: MobileComponents.Units.smallSpacing anchors.left: topPart.left anchors.leftMargin: MobileComponents.Units.largeSpacing / 2 anchors.right: topPart.right anchors.rightMargin: MobileComponents.Units.largeSpacing / 2 Item { Layout.preferredHeight: subsurfaceLogo.height + Rectangle { color: "green"; anchors.fill: parent; } Image { id: subsurfaceLogo source: "qrc:/qml/subsurface-mobile-icon.png" anchors { top: parent.top + topMargin: MobileComponents.Units.smallSpacing * -1 left: parent.left } - width: MobileComponents.Units.gridUnit * 2 + width: MobileComponents.Units.gridUnit height: width } - Text { + MobileComponents.Label { text: qsTr("Subsurface") height: subsurfaceLogo.height anchors { @@ -44,7 +46,7 @@ Rectangle { bottom: subsurfaceLogo.bottom leftMargin: MobileComponents.Units.gridUnit / 2 } - font.pointSize: MobileComponents.Units.fontMetrics.font.pointSize * 1.5 + font.weight: Font.Light verticalAlignment: Text.AlignBottom Layout.fillWidth: false color: subsurfaceTheme.accentTextColor @@ -53,37 +55,5 @@ Rectangle { Item { Layout.fillWidth: true } - Button { - id: prefsButton - // Display back arrow or menu button - text: topPart.goBack ? "\u2190" : "\u22ee" - anchors.right: parent.right - Layout.preferredWidth: MobileComponents.Units.gridUnit * 2 - Layout.preferredHeight: parent.height - style: ButtonStyle { - background: Rectangle { - implicitWidth: MobileComponents.Units.gridUnit * 2 - color: subsurfaceTheme.accentColor - } - label: Text { - id: txt - color: subsurfaceTheme.accentTextColor - font.pointSize: MobileComponents.Units.fontMetrics.font.pointSize * 2 - font.bold: true - text: control.text - horizontalAlignment: Text.AlignHCenter - verticalAlignment: Text.AlignVCenter - } - } - onClicked: { - if (topPart.goBack) { - stackView.pop() - } else { - prefsMenu.popup() - } - } - } - } - } -- cgit v1.2.3-70-g09d2 From 52b3c68b24d5c874b6b15dd90a3421d393520120 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 01:13:51 +0100 Subject: Align subsurface logo correctly MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The right hand side of the logo was slightly off of the left orientation line for the rest of the layout. This changes it to Units.smallSpacing, which is used for this kind of spacing. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/TopBar.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/TopBar.qml b/qt-mobile/qml/TopBar.qml index 0dd9751a1..27fa00604 100644 --- a/qt-mobile/qml/TopBar.qml +++ b/qt-mobile/qml/TopBar.qml @@ -21,9 +21,9 @@ Rectangle { anchors.bottom: topPart.bottom anchors.bottomMargin: MobileComponents.Units.smallSpacing anchors.left: topPart.left - anchors.leftMargin: MobileComponents.Units.largeSpacing / 2 + anchors.leftMargin: MobileComponents.Units.smallSpacing anchors.right: topPart.right - anchors.rightMargin: MobileComponents.Units.largeSpacing / 2 + anchors.rightMargin: MobileComponents.Units.smallSpacing Item { Layout.preferredHeight: subsurfaceLogo.height Rectangle { color: "green"; anchors.fill: parent; } -- cgit v1.2.3-70-g09d2 From 09bf7fabcfac66df6cdcfd3d55650f3d58a195d9 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 01:17:41 +0100 Subject: sync with mobilecomponents e7d789465b9a935ec MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This fixes lack of spacing in the drawer's menu items. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/mobilecomponents/ContextDrawer.qml | 4 +++- qt-mobile/qml/mobilecomponents/GlobalDrawer.qml | 8 ++++++-- 2 files changed, 9 insertions(+), 3 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobilecomponents/ContextDrawer.qml b/qt-mobile/qml/mobilecomponents/ContextDrawer.qml index 2e2f95f7e..083254946 100644 --- a/qt-mobile/qml/mobilecomponents/ContextDrawer.qml +++ b/qt-mobile/qml/mobilecomponents/ContextDrawer.qml @@ -18,6 +18,7 @@ */ import QtQuick 2.1 +import QtQuick.Layouts 1.2 import QtQuick.Controls 1.0 as QtControls import org.kde.plasma.mobilecomponents 0.2 @@ -63,7 +64,8 @@ OverlayDrawer { } delegate: ListItem { enabled: true - Row { + RowLayout { + height: implicitHeight + Units.smallSpacing * 2 anchors { left: parent.left margins: Units.largeSpacing diff --git a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml index 082231c41..363042505 100644 --- a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml +++ b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml @@ -49,6 +49,7 @@ OverlayDrawer { Layout.minimumHeight: Math.max(headingIcon.height, heading.height) + Units.smallSpacing*2 fillMode: Image.PreserveAspectCrop + asynchronous: true anchors { left: parent.left @@ -123,6 +124,7 @@ OverlayDrawer { Layout.maximumWidth: Layout.minimumWidth Layout.fillWidth: false Layout.fillHeight: true + visible: children.length > 0 } Item { Layout.minimumWidth: Units.smallSpacing @@ -142,6 +144,7 @@ OverlayDrawer { visible: level > 0 enabled: true RowLayout { + height: implicitHeight + Units.smallSpacing * 2 anchors { left: parent.left } @@ -151,9 +154,9 @@ OverlayDrawer { source: "go-previous" } Label { - // Weird, this doesn't work + // Weird, this doesn't work //text: (typeof(i18n) != undefined) ? i18n("Back") : "Back" - text: "Back" + text: "Back" } } onClicked: pageRow.pop() @@ -161,6 +164,7 @@ OverlayDrawer { delegate: ListItem { enabled: true RowLayout { + height: implicitHeight + Units.smallSpacing*2 anchors { left: parent.left right: parent.right -- cgit v1.2.3-70-g09d2 From cf9476c74e3479b9a4b5ea0060ebafc880107ee3 Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Mon, 30 Nov 2015 01:12:47 +0100 Subject: use a ScrollView for the main flickable It managed the styled scroll indicator and the behavior. Signed-off-by: Marco Martin --- qt-mobile/qml/DiveDetails.qml | 235 +++++++++++++++++++++--------------------- 1 file changed, 119 insertions(+), 116 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml index a905064d7..14cf8dcc4 100644 --- a/qt-mobile/qml/DiveDetails.qml +++ b/qt-mobile/qml/DiveDetails.qml @@ -28,138 +28,141 @@ MobileComponents.Page { qmlProfile.update() } - Flickable { - id: flick + ScrollView { anchors.fill: parent - contentHeight: content.height - clip: true - Item { - id: content - width: flick.width - height: childrenRect.height + MobileComponents.Units.smallSpacing * 2 - - ColumnLayout { - anchors { - left: parent.left - right: parent.right - top: parent.top - margins: MobileComponents.Units.smallSpacing - } - spacing: MobileComponents.Units.smallSpacing - - - GridLayout { - id: editorDetails - width: parent.width - columns: 2 - - MobileComponents.Heading { - Layout.columnSpan: 2 - text: "Dive " + number + " (" + date + ")" - } - - Item { - Layout.columnSpan: 2 - Layout.fillWidth: true - Layout.preferredHeight: qmlProfile.visible ? qmlProfile.height : profileHideButton.height - QMLProfile { - id: qmlProfile - height: MobileComponents.Units.gridUnit * 25 - anchors { - top: parent.top - left: parent.left - right: parent.right - } - //Rectangle { color: "green"; opacity: 0.4; anchors.fill: parent } // used for debugging the dive profile sizing, will be removed later + Flickable { + id: flick + anchors.fill: parent + contentHeight: content.height + clip: true + Item { + id: content + width: flick.width + height: childrenRect.height + MobileComponents.Units.smallSpacing * 2 + + ColumnLayout { + anchors { + left: parent.left + right: parent.right + top: parent.top + margins: MobileComponents.Units.smallSpacing + } + spacing: MobileComponents.Units.smallSpacing + + + GridLayout { + id: editorDetails + width: parent.width + columns: 2 + + MobileComponents.Heading { + Layout.columnSpan: 2 + text: "Dive " + number + " (" + date + ")" } - Button { - id: profileHideButton - anchors { - right: parent.right - top: parent.top + + Item { + Layout.columnSpan: 2 + Layout.fillWidth: true + Layout.preferredHeight: qmlProfile.visible ? qmlProfile.height : profileHideButton.height + QMLProfile { + id: qmlProfile + height: MobileComponents.Units.gridUnit * 25 + anchors { + top: parent.top + left: parent.left + right: parent.right + } + //Rectangle { color: "green"; opacity: 0.4; anchors.fill: parent } // used for debugging the dive profile sizing, will be removed later } - text: "Hide Dive Profile" - onClicked: { - qmlProfile.visible = !qmlProfile.visible - if (qmlProfile.visible) { - text = "Hide Dive Profile" - } else { - text = "Show Dive Profile" + Button { + id: profileHideButton + anchors { + right: parent.right + top: parent.top + } + text: "Hide Dive Profile" + onClicked: { + qmlProfile.visible = !qmlProfile.visible + if (qmlProfile.visible) { + text = "Hide Dive Profile" + } else { + text = "Show Dive Profile" + } } } } - } - MobileComponents.Label { - text: "Location:" - } - TextField { - id: txtLocation; text: location; - Layout.fillWidth: true - } + MobileComponents.Label { + text: "Location:" + } + TextField { + id: txtLocation; text: location; + Layout.fillWidth: true + } - MobileComponents.Label { - text: "Air Temp:" - } - TextField { - id: txtAirTemp - text: airtemp - Layout.fillWidth: true - } + MobileComponents.Label { + text: "Air Temp:" + } + TextField { + id: txtAirTemp + text: airtemp + Layout.fillWidth: true + } - MobileComponents.Label { - text: "Water Temp:" - } - TextField { - id: txtWaterTemp - text: watertemp - Layout.fillWidth: true - } + MobileComponents.Label { + text: "Water Temp:" + } + TextField { + id: txtWaterTemp + text: watertemp + Layout.fillWidth: true + } - MobileComponents.Label { - text: "Suit:" + MobileComponents.Label { + text: "Suit:" - } - TextField { - id: txtSuit - text: suit - Layout.fillWidth: true - } + } + TextField { + id: txtSuit + text: suit + Layout.fillWidth: true + } - MobileComponents.Label { - text: "Buddy:" - } - TextField { - id: txtBuddy - text: buddy - Layout.fillWidth: true - } + MobileComponents.Label { + text: "Buddy:" + } + TextField { + id: txtBuddy + text: buddy + Layout.fillWidth: true + } - MobileComponents.Label { - text: "Dive Master:" - } - TextField { - id: txtDiveMaster - text: divemaster - Layout.fillWidth: true - } + MobileComponents.Label { + text: "Dive Master:" + } + TextField { + id: txtDiveMaster + text: divemaster + Layout.fillWidth: true + } - MobileComponents.Label { - text: "Notes:" + MobileComponents.Label { + text: "Notes:" + } + TextEdit{ + id: txtNotes + text: notes + focus: true + Layout.fillWidth: true + Layout.fillHeight: true + selectByMouse: true + wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere + } } - TextEdit{ - id: txtNotes - text: notes - focus: true - Layout.fillWidth: true - Layout.fillHeight: true - selectByMouse: true - wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere + Item { + height: MobileComponents.Units.gridUnit * 3 + width: height // just to make sure the spacer doesn't produce scrollbars, but also isn't null } } - Item { - height: MobileComponents.Units.gridUnit * 3 - width: height // just to make sure the spacer doesn't produce scrollbars, but also isn't null - } } } } -- cgit v1.2.3-70-g09d2 From 092677687744b7798d0603b10b884916d6962d7e Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Mon, 30 Nov 2015 01:14:43 +0100 Subject: Align the labels ar right uniform look for forms: labels aligned at the right, fileds at the left Signed-off-by: Marco Martin --- qt-mobile/qml/DiveDetails.qml | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml index 14cf8dcc4..d07cdcae9 100644 --- a/qt-mobile/qml/DiveDetails.qml +++ b/qt-mobile/qml/DiveDetails.qml @@ -92,6 +92,7 @@ MobileComponents.Page { } } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Location:" } TextField { @@ -100,6 +101,7 @@ MobileComponents.Page { } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Air Temp:" } TextField { @@ -109,6 +111,7 @@ MobileComponents.Page { } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Water Temp:" } TextField { @@ -118,6 +121,7 @@ MobileComponents.Page { } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Suit:" } @@ -128,6 +132,7 @@ MobileComponents.Page { } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Buddy:" } TextField { @@ -137,6 +142,7 @@ MobileComponents.Page { } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Dive Master:" } TextField { @@ -146,6 +152,7 @@ MobileComponents.Page { } MobileComponents.Label { + Layout.alignment: Qt.AlignRight text: "Notes:" } TextEdit{ -- cgit v1.2.3-70-g09d2 From fd3bb4a84df0df991b37e8a7781a02d16a2918f3 Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Mon, 30 Nov 2015 01:17:43 +0100 Subject: The system integrated component is TextArea this will give graphical styling and behavior Signed-off-by: Marco Martin --- qt-mobile/qml/DiveDetails.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml index d07cdcae9..bff64537a 100644 --- a/qt-mobile/qml/DiveDetails.qml +++ b/qt-mobile/qml/DiveDetails.qml @@ -155,7 +155,7 @@ MobileComponents.Page { Layout.alignment: Qt.AlignRight text: "Notes:" } - TextEdit{ + TextArea { id: txtNotes text: notes focus: true -- cgit v1.2.3-70-g09d2 From c5722773d210928b52fb36b65ac50954b9c01d50 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 01:32:55 +0100 Subject: Easy access to enable/disable location service MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Add a checkbox in the global drawer which allows quick access enabling and disabling the location service. This is something the user wants to keep an eye on, quickly enable it before a trip, so it makes sense to give it some prominence. It also helps reminding that the user switched the device into battery-monster-mode. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/main.qml | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/main.qml b/qt-mobile/qml/main.qml index bf282608c..cf0e1078e 100644 --- a/qt-mobile/qml/main.qml +++ b/qt-mobile/qml/main.qml @@ -106,6 +106,13 @@ MobileComponents.ApplicationWindow { } } ] + CheckBox { + text: "Run location service" + checked: manager.locationServiceEnabled + onCheckedChanged: { + manager.locationServiceEnabled = checked; + } + } } QtObject { -- cgit v1.2.3-70-g09d2 From 5f40ac6da3b7550aacc3b80a594ffc18c03f9efa Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 01:48:10 +0100 Subject: Style the checkbox MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Using a normal checkbox, we get black text, not our styled Label. Since, short of doing a style, this is the only way to get the label the right color, and thus not screw up the visual appearance of the drawer, we hand-roll it. This is a bit clunky, but I prefer visual continuity here over code complexity concerns. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/main.qml | 32 +++++++++++++++++++++++++++----- 1 file changed, 27 insertions(+), 5 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/main.qml b/qt-mobile/qml/main.qml index cf0e1078e..1888a77e8 100644 --- a/qt-mobile/qml/main.qml +++ b/qt-mobile/qml/main.qml @@ -106,11 +106,33 @@ MobileComponents.ApplicationWindow { } } ] - CheckBox { - text: "Run location service" - checked: manager.locationServiceEnabled - onCheckedChanged: { - manager.locationServiceEnabled = checked; + MouseArea { + height: childrenRect.height + width: MobileComponents.Units.gridUnit * 10 + CheckBox { + //text: "Run location service" + id: locationCheckbox + anchors { + left: parent.left + top: parent.top + } + checked: manager.locationServiceEnabled + onCheckedChanged: { + manager.locationServiceEnabled = checked; + } + } + MobileComponents.Label { + x: MobileComponents.Units.gridUnit * 1.5 + anchors { + left: locationCheckbox.right + //leftMargin: units.smallSpacing + verticalCenter: locationCheckbox.verticalCenter + } + text: "Run location service" + } + onClicked: { + print("Click.") + locationCheckbox.checked = !locationCheckbox.checked } } } -- cgit v1.2.3-70-g09d2 From 6381c2eb2a79be8ca799f65c0b69a894292a8be6 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 01:57:29 +0100 Subject: improve preferences layout MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Use the component's heading for more consistency - spacing between items: largeSpacing above, half of that below, this makes the title visually connect to the widgets it refers to. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/Preferences.qml | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/Preferences.qml b/qt-mobile/qml/Preferences.qml index 8cae95ff0..575474ac8 100644 --- a/qt-mobile/qml/Preferences.qml +++ b/qt-mobile/qml/Preferences.qml @@ -20,10 +20,9 @@ Item { anchors.fill: parent anchors.margins: MobileComponents.Units.gridUnit - Label { + MobileComponents.Heading { text: "Cloud credentials" - Layout.bottomMargin: MobileComponents.Units.largeSpacing - font.pointSize: subsurfaceTheme.titlePointSize + Layout.bottomMargin: MobileComponents.Units.largeSpacing / 2 Layout.columnSpan: 2 } @@ -73,10 +72,10 @@ Item { id: savePassword } - Label { + MobileComponents.Heading { text: "Subsurface GPS data webservice" - Layout.bottomMargin: MobileComponents.Units.largeSpacing - font.pointSize: subsurfaceTheme.titlePointSize + Layout.topMargin: MobileComponents.Units.largeSpacing + Layout.bottomMargin: MobileComponents.Units.largeSpacing / 2 Layout.columnSpan: 2 } -- cgit v1.2.3-70-g09d2 From f8fb9181b2e95f76bb1170d2cd7c7bf920a9c414 Mon Sep 17 00:00:00 2001 From: Sebastian Kügler Date: Mon, 30 Nov 2015 02:35:17 +0100 Subject: sync with mobilecomponents 68c6dc9 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This fixes spacing around the icon in the left drawer, the stretched-out icons in the navigation menu, the unnecessary scrolling in the same menu, and a few other things. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/mobilecomponents/GlobalDrawer.qml | 10 +++++++--- .../qml/mobilecomponents/private/ActionButton.qml | 20 ++++++++++++++++++-- 2 files changed, 25 insertions(+), 5 deletions(-) (limited to 'qt-mobile') diff --git a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml index 363042505..638222ada 100644 --- a/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml +++ b/qt-mobile/qml/mobilecomponents/GlobalDrawer.qml @@ -84,7 +84,7 @@ OverlayDrawer { anchors { left: parent.left top: parent.top - margins: Units.smallSpacing + margins: Units.smallSpacing * 2 } Icon { id: headingIcon @@ -140,6 +140,8 @@ OverlayDrawer { model: actions property int level: 0 + interactive: contentHeight > height + footer: ListItem { visible: level > 0 enabled: true @@ -149,7 +151,8 @@ OverlayDrawer { left: parent.left } Icon { - Layout.maximumWidth: height + Layout.minimumWidth: height + Layout.maximumWidth: Layout.minimumWidth Layout.fillHeight: true source: "go-previous" } @@ -179,7 +182,8 @@ OverlayDrawer { text: modelData.text } Icon { - Layout.maximumWidth: height + Layout.minimumWidth: height + Layout.maximumWidth: Layout.minimumWidth Layout.fillHeight: true source: "go-next" visible: modelData.children != undefined diff --git a/qt-mobile/qml/mobilecomponents/private/ActionButton.qml b/qt-mobile/qml/mobilecomponents/private/ActionButton.qml index bfc8c5875..4dbea98b8 100644 --- a/qt-mobile/qml/mobilecomponents/private/ActionButton.qml +++ b/qt-mobile/qml/mobilecomponents/private/ActionButton.qml @@ -35,6 +35,15 @@ MouseArea { minimumX: contextDrawer ? 0 : parent.width/2 - width/2 maximumX: globalDrawer ? parent.width : parent.width/2 - width/2 } + function toggle() { + showAnimation.running = false; + if (transform[0].y < button.height) { + showAnimation.to = button.height; + } else { + showAnimation.to = 0; + } + showAnimation.running = true; + } transform: Translate {} onReleased: { @@ -88,6 +97,13 @@ MouseArea { } } + NumberAnimation { + id: showAnimation + target: button.transform[0] + properties: "y" + duration: Units.longDuration + easing.type: Easing.InOutQuad + } Item { id: background anchors { @@ -140,8 +156,8 @@ MouseArea { DropShadow { anchors.fill: background horizontalOffset: 0 - verticalOffset: Units.smallSpacing/2 - radius: Units.gridUnit / 2.4 + verticalOffset: Units.smallSpacing/3 + radius: Units.gridUnit / 3.5 samples: 16 color: button.pressed ? "transparent" : Qt.rgba(0, 0, 0, 0.5) source: background -- cgit v1.2.3-70-g09d2