summaryrefslogtreecommitdiffstats
path: root/qt-mobile/qml/DiveDetails.qml
diff options
context:
space:
mode:
authorGravatar Sebastian Kügler <sebas@kde.org>2015-12-04 01:38:04 +0100
committerGravatar Sebastian Kügler <sebas@kde.org>2015-12-07 18:46:32 +0100
commitbd7af5a511053f1ac35f9b250039aa76f9096e99 (patch)
tree64eb19af6a590314d6906a1f3a35c362eb4a4abb /qt-mobile/qml/DiveDetails.qml
parent54da517e9d9326ffe572a3aa75ffe6697ee2ce56 (diff)
downloadsubsurface-bd7af5a511053f1ac35f9b250039aa76f9096e99.tar.gz
state machine controls edit/view dive details
This is the first part of splitting the dive details into edit/view modes. - introduce a state machine to switch between view and edit mode - factor out the editor into its own component Both components are almost the same, but we can change them individually now. Signed-off-by: Sebastian Kügler <sebas@kde.org>
Diffstat (limited to 'qt-mobile/qml/DiveDetails.qml')
-rw-r--r--qt-mobile/qml/DiveDetails.qml47
1 files changed, 46 insertions, 1 deletions
diff --git a/qt-mobile/qml/DiveDetails.qml b/qt-mobile/qml/DiveDetails.qml
index b3356313a..10fe57c01 100644
--- a/qt-mobile/qml/DiveDetails.qml
+++ b/qt-mobile/qml/DiveDetails.qml
@@ -23,6 +23,18 @@ MobileComponents.Page {
property string date
property string number
+ states: [
+ State {
+ name: "view"
+ PropertyChanges { target: detailsView; opacity: 1 }
+ PropertyChanges { target: detailsEdit; opacity: 0 }
+ },
+ State {
+ name: "edit"
+ PropertyChanges { target: detailsView; opacity: 0 }
+ PropertyChanges { target: detailsEdit; opacity: 1 }
+ }
+ ]
onDive_idChanged: {
qmlProfile.diveId = dive_id
qmlProfile.update()
@@ -40,7 +52,36 @@ MobileComponents.Page {
width: flick.width
height: childrenRect.height + MobileComponents.Units.smallSpacing * 2
+ Button {
+ checkable: true
+ text: "Edit"
+ z: 999
+ anchors {
+ top: parent.top
+ right: parent.right
+ margins: MobileComponents.Units.gridUnit / 2
+ }
+ onCheckedChanged: {
+ diveDetailsWindow.state = checked ? "edit" : "view"
+ }
+ }
+
+ DiveDetailsEdit {
+ id: detailsEdit
+ anchors {
+ left: parent.left
+ right: parent.right
+ top: parent.top
+ margins: MobileComponents.Units.smallSpacing
+ }
+
+ Behavior on opacity {
+ NumberAnimation { duration: MobileComponents.Units.shortDuration }
+ }
+ }
+
ColumnLayout {
+ id: detailsView
anchors {
left: parent.left
right: parent.right
@@ -49,6 +90,10 @@ MobileComponents.Page {
}
spacing: MobileComponents.Units.smallSpacing
+ Behavior on opacity {
+ NumberAnimation { duration: MobileComponents.Units.shortDuration }
+ }
+
GridLayout {
id: editorDetails
@@ -57,7 +102,7 @@ MobileComponents.Page {
MobileComponents.Heading {
Layout.columnSpan: 2
- text: "Dive " + number + " (" + date + ")"
+ text: "VIEW Dive " + number + " (" + date + ")"
}
Item {