From 6ffef818a8d34fdc8aef70c3515c2b91d8d297ac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20K=C3=BCgler?= Date: Sun, 29 Nov 2015 17:43:56 +0100 Subject: [PATCH] Rework central navigation MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This patch is the part implementing the drawers and in-app page navigation. In more detail: - main.qml uses the mobilecomponents plugin and the APIs as already changed in the other components - The extended properties have moved into the root item (for now, they'll get properly encapsulated later) - A menu can be swiped in from the left - The application makes better use when used horizontally (if there's enough space, so depending on the display you can get divelist and -details next to each other, one phone/portrait formfactor, the layout stays in a single column. - The options for GPS have been grouped into a submenu This change follows the Plasma mobile human interface guidelines. These changes are actually relatively small considered what they're doing, most of the logic is encapsulated in mobilecomponents' PageRow and *Drawer classes. The previous navigation pattern is actually a subset of this one, so it still works. Signed-off-by: Sebastian Kügler --- qt-mobile/qml/main.qml | 140 ++++++++++++++++++++++++++++++++++------- 1 file changed, 118 insertions(+), 22 deletions(-) diff --git a/qt-mobile/qml/main.qml b/qt-mobile/qml/main.qml index c3117b9d5..0feaa002e 100644 --- a/qt-mobile/qml/main.qml +++ b/qt-mobile/qml/main.qml @@ -1,4 +1,4 @@ -import QtQuick 2.3 +import QtQuick 2.4 import QtQuick.Controls 1.2 import QtQuick.Controls.Styles 1.2 import QtQuick.Window 2.2 @@ -6,29 +6,125 @@ import QtQuick.Dialogs 1.2 import QtQuick.Layouts 1.1 import QtQuick.Window 2.2 import org.subsurfacedivelog.mobile 1.0 -import "qrc:/qml/theme" as Theme +import org.kde.plasma.mobilecomponents 0.2 as MobileComponents - -Window { +MobileComponents.ApplicationWindow { title: qsTr("Subsurface mobile") property bool fullscreen: true property alias messageText: message.text + + property int titlePointSize: Math.round(fontMetrics.font.pointSize * 1.5) + property int smallPointSize: Math.round(fontMetrics.font.pointSize * 0.7) + + FontMetrics { + id: fontMetrics + } + visible: true - Theme.Units { - id: units + globalDrawer: MobileComponents.GlobalDrawer{ + title: "Subsurface" + titleIcon: "qrc:/qml/subsurface-mobile-icon.png" - property int titlePointSize: Math.round(fontMetrics.font.pointSize * 1.5) - property int smallPointSize: Math.round(fontMetrics.font.pointSize * 0.7) + bannerImageSource: "dive.jpg" + actions: [ + Action { + text: "Preferences" + onTriggered: { + stackView.push(prefsWindow) + } + }, + Action { + text: "Load Dives" + onTriggered: { + manager.loadDives(); + } + }, + + Action { + text: "Download Dives" + onTriggered: { + stackView.push(downloadDivesWindow) + } + }, + + Action { + text: "Add Dive" + onTriggered: { + manager.addDive(); + stackView.push(detailsWindow) + } + }, + + Action { + text: "Save Changes" + onTriggered: { + manager.saveChanges(); + } + }, + + MobileComponents.ActionGroup { + text: "GPS" + Action { + text: "Run location service" + checkable: true + checked: manager.locationServiceEnabled + onToggled: { + manager.locationServiceEnabled = checked; + } + } + Action { + text: "Apply GPS data to dives" + onTriggered: { + manager.applyGpsData(); + } + } + + Action { + text: "Send GPS data to server" + onTriggered: { + manager.sendGpsData(); + } + } + + Action { + text: "Clear stored GPS data" + onTriggered: { + manager.clearGpsData(); + } + } + }, + + Action { + text: "View Log" + onTriggered: { + stackView.push(logWindow) + } + }, + + Action { + text: "Theme Information" + onTriggered: { + stackView.push(themetest) + } + } + ] } - - Theme.Theme { - id: theme - /* Added for subsurface */ - property color accentColor: "#2d5b9a" - property color accentTextColor: "#ececec" - } +// MobileComponents.Units { +// id: units +// +// property int titlePointSize: Math.round(fontMetrics.font.pointSize * 1.5) +// property int smallPointSize: Math.round(fontMetrics.font.pointSize * 0.7) +// +// } +// +// MobileComponents.Theme { +// id: theme +// /* Added for subsurface */ +// property color accentColor: "#2d5b9a" +// property color accentTextColor: "#ececec" +// } Menu { id: prefsMenu @@ -138,7 +234,7 @@ Window { ColumnLayout { id: awLayout anchors.fill: parent - spacing: units.gridUnit / 2 + spacing: MobileComponents.Units.gridUnit / 2 Rectangle { id: detailsPage @@ -148,7 +244,7 @@ Window { DiveList { anchors.fill: detailsPage id: diveDetails - color: theme.backgroundColor + color: MobileComponents.Theme.backgroundColor } } @@ -156,14 +252,14 @@ Window { id: messageArea height: childrenRect.height Layout.fillWidth: true - color: theme.backgroundColor + color: MobileComponents.Theme.backgroundColor Text { id: message - color: theme.textColor + color: MobileComponents.Theme.textColor wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere - styleColor: theme.textColor - font.pointSize: units.smallPointSize + styleColor: MobileComponents.Theme.textColor + font.pointSize: MobileComponents.Units.smallPointSize } } } @@ -201,6 +297,6 @@ Window { } Component.onCompleted: { - print("units.gridUnit is: " + units.gridUnit); + print("MobileComponents.Units.gridUnit is: " + MobileComponents.Units.gridUnit); } }