QML UI: switch edit back to not being a drawer

With this edit seems to work again. The edit page can be scrolled around on
smaller screens to allow editing every part of it and to allow the user to
press the "save" button.

This is mainly intended to make sure testing can continue - it's unclear if
this will be the final design.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>

qt-mobile/qml/DiveDetails.qml

@@ -7,16 +7,29 @@ import org.subsurfacedivelog.mobile 1.0
 import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
 
 MobileComponents.Page {
-	id: page
+	id: diveDetailsPage
-	objectName: "DiveList"
 	property alias currentIndex: diveListView.currentIndex
 
+	state: "view"
+
+	states: [
+		State {
+			name: "view"
+			PropertyChanges { target: diveDetailList; visible: true }
+			PropertyChanges { target: detailsEditScroll; visible: false }
+		},
+		State {
+			name: "edit"
+			PropertyChanges { target: diveDetailList; visible: false }
+			PropertyChanges { target: detailsEditScroll; visible: true }
+		}
+	]
 	mainAction: Action {
-		iconName: editDrawer.opened ? "dialog-cancel" : "document-edit"
+		iconName: state === "edit" ? "dialog-cancel" : "document-edit"
 		onTriggered: {
-			if (editDrawer.opened) {
+			if (state === "edit") {
-				editDrawer.close();
+				state = "view"
-				return;
+				return
 			}
 			// After saving, the list may be shuffled, so first of all make sure that
 			// the listview's currentIndex is the visible item
@@ -34,7 +47,7 @@ MobileComponents.Page {
 			detailsEdit.buddyText = diveListView.currentItem.modelData.dive.buddy
 			detailsEdit.divemasterText = diveListView.currentItem.modelData.dive.divemaster
 			detailsEdit.notesText = diveListView.currentItem.modelData.dive.notes
-			editDrawer.open();
+			diveDetailsPage.state = "edit"
 		}
 	}
 
@@ -45,6 +58,7 @@ MobileComponents.Page {
 	onWidthChanged: diveListView.positionViewAtIndex(diveListView.currentIndex, ListView.Beginning);
 
 	ScrollView {
+		id: diveDetailList
 		anchors.fill: parent
 		ListView {
 			id: diveListView
@@ -60,9 +74,6 @@ MobileComponents.Page {
 			onMovementEnded: {
 				currentIndex = indexAt(contentX+1, 1);
 			}
-			onCurrentIndexChanged: {
-				editDrawer.close();
-			}
 			delegate: ScrollView {
 				id: internalScrollView
 				width: diveListView.width
@@ -80,22 +91,16 @@ MobileComponents.Page {
 			}
 		}
 	}
-	MobileComponents.OverlayDrawer {
+	Flickable {
-		id: editDrawer
+		id: detailsEditScroll
 		anchors.fill: parent
-		edge: Qt.BottomEdge
+		anchors.margins: MobileComponents.Units.gridUnit
-		contentItem: DiveDetailsEdit {
+		contentWidth: contentItem.childrenRect.width;
+		contentHeight: contentItem.childrenRect.height
+		clip: true
+		bottomMargin: MobileComponents.Units.gridUnit * 3
+		DiveDetailsEdit {
 			id: detailsEdit
-			implicitHeight: page.height - MobileComponents.Units.gridUnit*3
-		}
-		// Close the editDrawer when the pageStack navigates away, for example going
-		// back to the listview after the Back button was pressed
-		Connections {
-			target: rootItem.pageStack
-			onCurrentPageChanged: {
-				editDrawer.close();
-			}
 		}
 	}
-
 }

qt-mobile/qml/DiveDetailsEdit.qml

@@ -21,13 +21,9 @@ Item {
 	property alias notesText: txtNotes.text
 	property alias durationText: txtDuration.text
 	property alias depthText: txtDepth.text
+	height: editArea.height
 	ColumnLayout {
-		anchors {
+		id: editArea
-			left: parent.left
-			right: parent.right
-			top: parent.top
-			margins: MobileComponents.Units.gridUnit
-		}
 		spacing: MobileComponents.Units.smallSpacing
 
 
@@ -169,7 +165,7 @@ Item {
 				diveListView.currentItem.modelData.buddy = detailsEdit.buddyText
 				diveListView.currentItem.modelData.divemaster = detailsEdit.divemasterText
 				diveListView.currentItem.modelData.notes = detailsEdit.notesText
-				editDrawer.close()
+				diveDetailsPage.state = "view"
 			}
 		}
 		Item {