Hi all,

as promised, this patch makes the dive edits view fully functional again and 
ports most of the things to QtQuickcontrols2 (advantage is that it would look 
way more at home with android material apps

some issues:
* combobox in the edit view is still not ported, it's a bit tricky with qqc2 
comboboxes as they are not editable. however, it seemed it wasn't really 
semantically a combobox, rather a textfield that used the combo for typing 
suggestions? that could be reimplmented easily with a textfiled that has an 
internal listview for displaying suggestions
* downloadfromdivecomputer.qml is not ported, as it didn't seem to be used at 
all in the app?
* StyledTextField and subsurfacebutton components would go, making code a bit 
simpler (in qqc2 they are styled more android-like, is still possible to write 
a text field styled completely different, if needed)


screenshot: http://imgur.com/a/yX6Kb

-- 
Marco Martin
>From 5f773d9e4549c82ba92434a9e69d8a94d41a3f1f Mon Sep 17 00:00:00 2001
From: Marco Martin <[email protected]>
Date: Fri, 31 Mar 2017 14:12:17 +0200
Subject: [PATCH] Fully port dive edit to Kirigami2

completely adapt to the api changes of OverlaySheet in Kirigami2
in order to achieve the same look and behavior for the dive
edits that had with kirigami1

port most components to QtQuickContrls2, except comboboxes
in the dive edit sheet that will be a bit more complicated
---
 mobile-widgets/qml/About.qml             |  1 -
 mobile-widgets/qml/CloudCredentials.qml  |  8 ++--
 mobile-widgets/qml/DiveDetails.qml       | 72 +++++++++++++++-----------------
 mobile-widgets/qml/DiveDetailsEdit.qml   | 35 ++++++++--------
 mobile-widgets/qml/DiveDetailsView.qml   |  3 +-
 mobile-widgets/qml/DiveList.qml          | 13 +++---
 mobile-widgets/qml/GpsList.qml           |  2 -
 mobile-widgets/qml/Log.qml               |  2 -
 mobile-widgets/qml/Preferences.qml       |  8 ++--
 mobile-widgets/qml/StartPage.qml         |  2 -
 mobile-widgets/qml/ThemeTest.qml         |  1 -
 mobile-widgets/qml/main.qml              |  3 +-
 mobile-widgets/qml/mobile-resources.qrc  |  1 +
 mobile-widgets/qml/qtquickcontrols2.conf | 11 +++++
 14 files changed, 82 insertions(+), 80 deletions(-)
 create mode 100644 mobile-widgets/qml/qtquickcontrols2.conf

diff --git a/mobile-widgets/qml/About.qml b/mobile-widgets/qml/About.qml
index 113eac7..0d978bc 100644
--- a/mobile-widgets/qml/About.qml
+++ b/mobile-widgets/qml/About.qml
@@ -1,5 +1,4 @@
 import QtQuick 2.3
-import QtQuick.Controls 1.2
 import QtQuick.Layouts 1.1
 import org.kde.kirigami 2.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
diff --git a/mobile-widgets/qml/CloudCredentials.qml b/mobile-widgets/qml/CloudCredentials.qml
index 980e64c..e1d2e04 100644
--- a/mobile-widgets/qml/CloudCredentials.qml
+++ b/mobile-widgets/qml/CloudCredentials.qml
@@ -1,5 +1,5 @@
 import QtQuick 2.3
-import QtQuick.Controls 1.2
+import QtQuick.Controls 2.0
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
@@ -56,7 +56,7 @@ Item {
 			text: qsTr("Email")
 		}
 
-		StyledTextField {
+		TextField {
 			id: login
 			text: manager.cloudUserName
 			Layout.fillWidth: true
@@ -68,7 +68,7 @@ Item {
 			text: qsTr("Password")
 		}
 
-		StyledTextField {
+		TextField {
 			id: password
 			text: manager.cloudPassword
 			echoMode: TextInput.Password
@@ -97,7 +97,7 @@ Item {
 			text: qsTr("PIN")
 			visible: rootItem.showPin
 		}
-		StyledTextField {
+		TextField {
 			id: pin
 			text: ""
 			Layout.fillWidth: true
diff --git a/mobile-widgets/qml/DiveDetails.qml b/mobile-widgets/qml/DiveDetails.qml
index d6695c5..73e4f4f 100644
--- a/mobile-widgets/qml/DiveDetails.qml
+++ b/mobile-widgets/qml/DiveDetails.qml
@@ -1,6 +1,5 @@
 import QtQuick 2.4
-import QtQuick.Controls 1.4
-import QtQuick.Controls.Styles 1.4
+import QtQuick.Controls 2.0
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.2
 import org.subsurfacedivelog.mobile 1.0
@@ -52,23 +51,23 @@ Kirigami.Page {
 					left: diveDetailsListView.currentItem.modelData.dive.gps !== "" ? mapAction : null
 				}
 			}
-			PropertyChanges { target: detailsEditScroll; opened: false }
+			PropertyChanges { target: detailsEditScroll; sheetOpen: false }
 			PropertyChanges { target: pageStack.contentItem; interactive: true }
 		},
 		State {
 			name: "edit"
-			PropertyChanges { target: detailsEditScroll; opened: true }
+			PropertyChanges { target: detailsEditScroll; sheetOpen: true }
 			PropertyChanges { target: pageStack.contentItem; interactive: false }
 		},
 		State {
 			name: "add"
-			PropertyChanges { target: detailsEditScroll; opened: true }
+			PropertyChanges { target: detailsEditScroll; sheetOpen: true }
 			PropertyChanges { target: pageStack.contentItem; interactive: false }
 		}
 
 	]
 
-	property QtObject deleteAction: Action {
+	property QtObject deleteAction: Kirigami.Action {
 		text: qsTr("Delete dive")
 		iconName: "trash-empty"
 		onTriggered: {
@@ -85,7 +84,7 @@ Kirigami.Page {
 		}
 	}
 
-	property QtObject mapAction: Action {
+	property QtObject mapAction: Kirigami.Action {
 		text: qsTr("Show on map")
 		iconName: "gps"
 		onTriggered: {
@@ -93,7 +92,7 @@ Kirigami.Page {
 		}
 	}
 
-	actions.main: Action {
+	actions.main: Kirigami.Action {
 		iconName: state !== "view" ? "document-save" : "document-edit"
 		onTriggered: {
             manager.appendTextToLog("save/edit button triggered")
@@ -182,45 +181,42 @@ Kirigami.Page {
 
 	Item {
 		anchors.fill: parent
-		ScrollView {
-			id: diveDetailList
+		ListView {
+			id: diveDetailsListView
 			anchors.fill: parent
-			ListView {
-				id: diveDetailsListView
-				anchors.fill: parent
-				model: diveModel
-				currentIndex: -1
+			model: diveModel
+			currentIndex: -1
+			boundsBehavior: Flickable.StopAtBounds
+			maximumFlickVelocity: parent.width * 5
+			orientation: ListView.Horizontal
+			focus: true
+			clip: true
+			snapMode: ListView.SnapOneItem
+			onMovementEnded: {
+				currentIndex = indexAt(contentX+1, 1);
+			}
+			delegate: Flickable {
+				id: internalScrollView
+				width: diveDetailsListView.width
+				height: diveDetailsListView.height
+				property var modelData: model
+				contentHeight: diveDetails.height
 				boundsBehavior: Flickable.StopAtBounds
-				maximumFlickVelocity: parent.width * 5
-				orientation: ListView.Horizontal
-				focus: true
-				clip: true
-				snapMode: ListView.SnapOneItem
-				onMovementEnded: {
-					currentIndex = indexAt(contentX+1, 1);
-				}
-				delegate: ScrollView {
-					id: internalScrollView
-					width: diveDetailsListView.width
-					height: diveDetailsListView.height
-					property var modelData: model
-					Flickable {
-						//contentWidth: parent.width
-						contentHeight: diveDetails.height
-						boundsBehavior: Flickable.StopAtBounds
-						DiveDetailsView {
-							id: diveDetails
-							width: internalScrollView.width
-						}
-					}
+				DiveDetailsView {
+					id: diveDetails
+					width: internalScrollView.width
 				}
+				ScrollBar.vertical: ScrollBar { }
 			}
+			ScrollIndicator.horizontal: ScrollIndicator { }
 		}
 		Kirigami.OverlaySheet {
 			id: detailsEditScroll
+			parent: diveDetailsPage
+			rootItem.z: 0
 			// anchors.fill: parent
 			onSheetOpenChanged: {
-				if (!opened) {
+				if (!sheetOpen) {
 					endEditMode()
 				}
 			}
diff --git a/mobile-widgets/qml/DiveDetailsEdit.qml b/mobile-widgets/qml/DiveDetailsEdit.qml
index 94b1baa..51d087a 100644
--- a/mobile-widgets/qml/DiveDetailsEdit.qml
+++ b/mobile-widgets/qml/DiveDetailsEdit.qml
@@ -1,5 +1,6 @@
 import QtQuick 2.3
-import QtQuick.Controls 1.2
+import QtQuick.Controls 2.0
+import QtQuick.Controls 1.2 as QQC1
 import QtQuick.Controls.Styles 1.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
@@ -83,7 +84,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Date:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtDate;
 				Layout.fillWidth: true
 			}
@@ -91,7 +92,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Location:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtLocation;
 				Layout.fillWidth: true
 			}
@@ -100,7 +101,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Coordinates:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtGps
 				Layout.fillWidth: true
 			}
@@ -123,7 +124,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Depth:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtDepth
 				Layout.fillWidth: true
 				validator: RegExpValidator { regExp: /[^-]*/ }
@@ -132,7 +133,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Duration:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtDuration
 				Layout.fillWidth: true
 				validator: RegExpValidator { regExp: /[^-]*/ }
@@ -142,7 +143,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Air Temp:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtAirTemp
 				Layout.fillWidth: true
 			}
@@ -151,7 +152,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Water Temp:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtWaterTemp
 				Layout.fillWidth: true
 			}
@@ -160,7 +161,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Suit:")
 			}
-			ComboBox {
+			QQC1.ComboBox {
 				id: suitBox
 				editable: true
 				model: diveDetailsListView.currentItem.modelData.dive.suitList
@@ -175,7 +176,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Buddy:")
 			}
-			ComboBox {
+			QQC1.ComboBox {
 				id: buddyBox
 				editable: true
 				model: diveDetailsListView.currentItem.modelData.dive.buddyList
@@ -190,7 +191,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Dive Master:")
 			}
-			ComboBox {
+			QQC1.ComboBox {
 				id: divemasterBox
 				editable: true
 				model: diveDetailsListView.currentItem.modelData.dive.divemasterList
@@ -205,9 +206,9 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Weight:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtWeight
-				fixed: text === "cannot edit multiple weight systems"
+				readOnly: text === "cannot edit multiple weight systems"
 				Layout.fillWidth: true
 			}
 
@@ -215,7 +216,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Cylinder:")
 			}
-			ComboBox {
+			QQC1.ComboBox {
 				id: cylinderBox
 				editable: true
 				model: diveDetailsListView.currentItem.modelData.dive.cylinderList
@@ -230,7 +231,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Gas mix:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtGasMix
 				Layout.fillWidth: true
 				validator: RegExpValidator { regExp: /(EAN100|EAN\d\d|AIR|100|\d{1,2}|\d{1,2}\/\d{1,2})/i }
@@ -240,7 +241,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("Start Pressure:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtStartPressure
 				Layout.fillWidth: true
 			}
@@ -249,7 +250,7 @@ Item {
 				Layout.alignment: Qt.AlignRight
 				text: qsTr("End Pressure:")
 			}
-			StyledTextField {
+			TextField {
 				id: txtEndPressure
 				Layout.fillWidth: true
 			}
diff --git a/mobile-widgets/qml/DiveDetailsView.qml b/mobile-widgets/qml/DiveDetailsView.qml
index 4afc7d4..f9935c2 100644
--- a/mobile-widgets/qml/DiveDetailsView.qml
+++ b/mobile-widgets/qml/DiveDetailsView.qml
@@ -2,8 +2,7 @@ import QtQuick 2.3
 /*
 import QtWebView 1.0
 */
-import QtQuick.Controls 1.2
-import QtQuick.Controls.Styles 1.2
+
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
 import org.subsurfacedivelog.mobile 1.0
diff --git a/mobile-widgets/qml/DiveList.qml b/mobile-widgets/qml/DiveList.qml
index 49753b8..245eb41 100644
--- a/mobile-widgets/qml/DiveList.qml
+++ b/mobile-widgets/qml/DiveList.qml
@@ -1,5 +1,5 @@
 import QtQuick 2.4
-import QtQuick.Controls 1.2
+import QtQuick.Controls 2.0
 import QtQuick.Layouts 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
@@ -209,11 +209,13 @@ Kirigami.ScrollablePage {
 		}
 	}
 
-	ScrollView {
+	Flickable {
 		id: startPageWrapper
 		anchors.fill: parent
 		opacity: credentialStatus === QMLManager.NOCLOUD || (credentialStatus === QMLManager.VALID || credentialStatus === QMLManager.VALID_EMAIL) ? 0 : 1
 		visible: opacity > 0
+		contentWidth: width
+		contentHeight: startPage.height
 		Behavior on opacity { NumberAnimation { duration: Kirigami.Units.shortDuration } }
 		onVisibleChanged: {
 			print("startPageWrapper onVisibleChanged credentialStatus " + credentialStatus + " diveListView.count " + diveListView.count)
@@ -242,6 +244,7 @@ Kirigami.ScrollablePage {
 			page.actions.main = page.saveAction
 			page.actions.right = page.offlineAction
 		}
+		ScrollBar.vertical: ScrollBar { }
 	}
 
 	Kirigami.Label {
@@ -278,14 +281,14 @@ Kirigami.ScrollablePage {
 		}
 	}
 
-	property QtObject addDiveAction: Action {
+	property QtObject addDiveAction: Kirigami.Action {
 		iconName: "list-add"
 		onTriggered: {
 			startAddDive()
 		}
 	}
 
-	property QtObject saveAction: Action {
+	property QtObject saveAction: Kirigami.Action {
 		iconName: "document-save"
 		onTriggered: {
 			Qt.inputMethod.hide()
@@ -293,7 +296,7 @@ Kirigami.ScrollablePage {
 		}
 	}
 
-	property QtObject offlineAction: Action {
+	property QtObject offlineAction: Kirigami.Action {
 		iconName: "qrc:/qml/nocloud.svg"
 		onTriggered: {
 			manager.syncToCloud = false
diff --git a/mobile-widgets/qml/GpsList.qml b/mobile-widgets/qml/GpsList.qml
index 411677f..866b5be 100644
--- a/mobile-widgets/qml/GpsList.qml
+++ b/mobile-widgets/qml/GpsList.qml
@@ -1,6 +1,4 @@
 import QtQuick 2.3
-import QtQuick.Controls 1.2
-import QtQuick.Controls.Styles 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
diff --git a/mobile-widgets/qml/Log.qml b/mobile-widgets/qml/Log.qml
index cd45424..a0260e5 100644
--- a/mobile-widgets/qml/Log.qml
+++ b/mobile-widgets/qml/Log.qml
@@ -1,6 +1,4 @@
 import QtQuick 2.3
-import QtQuick.Controls 1.2
-import QtQuick.Controls.Styles 1.2
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
diff --git a/mobile-widgets/qml/Preferences.qml b/mobile-widgets/qml/Preferences.qml
index 17b9e2d..ad21f81 100644
--- a/mobile-widgets/qml/Preferences.qml
+++ b/mobile-widgets/qml/Preferences.qml
@@ -1,5 +1,5 @@
 import QtQuick 2.3
-import QtQuick.Controls 1.2
+import QtQuick.Controls 2.0
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
@@ -10,7 +10,7 @@ Kirigami.Page {
 
 	title: qsTr("Preferences")
 	actions {
-		main: Action {
+		main: Kirigami.Action {
 			text: qsTr("Save")
 			iconName: "document-save"
 			onTriggered: {
@@ -52,7 +52,7 @@ Kirigami.Page {
 			Layout.alignment: Qt.AlignRight
 		}
 
-		StyledTextField {
+		TextField {
 			id: distanceThreshold
 			text: manager.distanceThreshold
 			Layout.fillWidth: true
@@ -63,7 +63,7 @@ Kirigami.Page {
 			Layout.alignment: Qt.AlignRight
 		}
 
-		StyledTextField {
+		TextField {
 			id: timeThreshold
 			text: manager.timeThreshold
 			Layout.fillWidth: true
diff --git a/mobile-widgets/qml/StartPage.qml b/mobile-widgets/qml/StartPage.qml
index f8ee614..26ebb08 100644
--- a/mobile-widgets/qml/StartPage.qml
+++ b/mobile-widgets/qml/StartPage.qml
@@ -1,6 +1,4 @@
 import QtQuick 2.5
-import QtQuick.Controls 1.2
-import QtQuick.Controls.Styles 1.2
 import QtQuick.Layouts 1.1
 import org.kde.kirigami 2.0 as Kirigami
 import org.subsurfacedivelog.mobile 1.0
diff --git a/mobile-widgets/qml/ThemeTest.qml b/mobile-widgets/qml/ThemeTest.qml
index 8684c1e..3005032 100644
--- a/mobile-widgets/qml/ThemeTest.qml
+++ b/mobile-widgets/qml/ThemeTest.qml
@@ -1,5 +1,4 @@
 import QtQuick 2.5
-import QtQuick.Controls 1.4
 import QtQuick.Layouts 1.1
 import QtQuick.Window 2.2
 import org.kde.kirigami 2.0 as Kirigami
diff --git a/mobile-widgets/qml/main.qml b/mobile-widgets/qml/main.qml
index 753e1d4..59c584d 100644
--- a/mobile-widgets/qml/main.qml
+++ b/mobile-widgets/qml/main.qml
@@ -1,6 +1,5 @@
 import QtQuick 2.4
-import QtQuick.Controls 1.2
-import QtQuick.Controls.Styles 1.2
+import QtQuick.Controls 2.0
 import QtQuick.Window 2.2
 import QtQuick.Dialogs 1.2
 import QtQuick.Layouts 1.1
diff --git a/mobile-widgets/qml/mobile-resources.qrc b/mobile-widgets/qml/mobile-resources.qrc
index b95ce41..8354833 100644
--- a/mobile-widgets/qml/mobile-resources.qrc
+++ b/mobile-widgets/qml/mobile-resources.qrc
@@ -24,6 +24,7 @@
 		<file alias="nocloud.svg">icons/nocloud.svg</file>
 	</qresource>
 	<qresource prefix="/">
+		<file>qtquickcontrols2.conf</file>
 		<file alias="icons/go-next.svg">kirigami/icons/go-next.svg</file>
 		<file alias="icons/go-previous.svg">kirigami/icons/go-previous.svg</file>
 		<file alias="icons/handle-left.svg">kirigami/icons/handle-left.svg</file>
diff --git a/mobile-widgets/qml/qtquickcontrols2.conf b/mobile-widgets/qml/qtquickcontrols2.conf
new file mode 100644
index 0000000..777a4a5
--- /dev/null
+++ b/mobile-widgets/qml/qtquickcontrols2.conf
@@ -0,0 +1,11 @@
+[Controls]
+Style=Material
+
+[Material]
+Primary=#2d5b9a
+Accent=#2d5b9a
+Theme=System
+
+[Universal]
+Accent=#2d5b9a
+Theme=System
-- 
2.6.2

_______________________________________________
subsurface mailing list
[email protected]
http://lists.subsurface-divelog.org/cgi-bin/mailman/listinfo/subsurface

Reply via email to