QML UI: add transition when switching to edit mode

The hard switch was not ideal. This isn't perfect, yet, but a step in
the right direction. The 'transitions' to change the visibility
properties are a bit odd, but that's how it's done in the examples as
well.

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

mobile-widgets/qml/DiveDetails.qml

@@ -79,7 +79,49 @@ Kirigami.Page {
 				}
 			}
 		}
+	]
+	transitions: [
+		Transition {
+			from: "view"
+			to: "*"
+			SequentialAnimation {
+				NumberAnimation {
+					target: detailsEditFlickable
+					properties: "visible"
+					from: 0
+					to: 1
+					duration: 10
+				}
+				ScaleAnimator {
+					target: detailsEditFlickable
+					from: 0.3
+					to: 1
+					duration: 400
+					easing.type: Easing.InOutQuad
+				}
+			}
+		},
+		Transition {
+			from: "*"
+			to: "view"
+			SequentialAnimation {
+				ScaleAnimator {
+					target: detailsEditFlickable
+					from: 1
+					to: 0.3
+					duration: 400
+					easing.type: Easing.InOutQuad
+				}
+				NumberAnimation {
+					target: detailsEditFlickable
+					properties: "visible"
+					from: 1
+					to: 0
+					duration: 10
+				}
+			}
 
+		}
 	]
 
 	property QtObject deleteAction: Kirigami.Action {
@@ -236,11 +278,14 @@ Kirigami.Page {
 	}
 	Flickable {
 		id: detailsEditFlickable
-		visible: diveDetailsPage.state != "view" ? true : false
 		anchors.fill: parent
 		leftMargin: Kirigami.Units.smallSpacing
 		rightMargin: Kirigami.Units.smallSpacing
 		contentHeight: detailsEdit.height
+		// start invisible and scaled down, to get the transition
+		// off to the right start
+		visible: false
+		scale: 0.3
 		DiveDetailsEdit {
 			id: detailsEdit
 		}

mobile-widgets/qml/DiveDetailsEdit.qml

@@ -39,6 +39,7 @@ Item {
 	property int visibility
 
 	function saveData() {
+		diveDetailsPage.state = "view" // run the transition
 		// apply the changes to the dive_table
 		manager.commitChanges(dive_id, detailsEdit.dateText, detailsEdit.locationText, detailsEdit.gpsText, detailsEdit.durationText,
 				      detailsEdit.depthText, detailsEdit.airtempText, detailsEdit.watertempText, suitBox.text, buddyBox.text,
@@ -66,7 +67,6 @@ Item {
 		diveDetailsListView.currentItem.modelData.notes = detailsEdit.notesText
 		diveDetailsListView.currentItem.modelData.rating = detailsEdit.rating
 		diveDetailsListView.currentItem.modelData.visibility = detailsEdit.visibility
-		diveDetailsPage.state = "view"
 		Qt.inputMethod.hide()
 		// now make sure we directly show the saved dive (this may be a new dive, or it may have moved)
 		showDiveIndex(newIdx)