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>
This commit is contained in:
Dirk Hohndel 2016-01-20 14:07:06 -08:00
parent 3116bc06fb
commit f84e823879
2 changed files with 32 additions and 31 deletions

View file

@ -7,16 +7,29 @@ import org.subsurfacedivelog.mobile 1.0
import org.kde.plasma.mobilecomponents 0.2 as MobileComponents
MobileComponents.Page {
id: page
objectName: "DiveList"
id: diveDetailsPage
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) {
editDrawer.close();
return;
if (state === "edit") {
state = "view"
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 {
id: editDrawer
Flickable {
id: detailsEditScroll
anchors.fill: parent
edge: Qt.BottomEdge
contentItem: DiveDetailsEdit {
anchors.margins: MobileComponents.Units.gridUnit
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();
}
}
}
}

View file

@ -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 {
left: parent.left
right: parent.right
top: parent.top
margins: MobileComponents.Units.gridUnit
}
id: editArea
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 {