split divedetails into view and edit parts

This splits the dive detail page into two modes: view and edit

- The edit part loses the profile (it's not editable anyway)

- The view part gets a new layout, friendlier for viewing

- Properties for diveNumber, duration, depth and weight are added

Signed-off-by: Sebastian Kügler <sebas@kde.org>
This commit is contained in:
Sebastian Kügler 2015-12-04 02:28:48 +01:00
parent bd7af5a511
commit 8cf4725742
5 changed files with 168 additions and 127 deletions

View file

@ -13,15 +13,22 @@ MobileComponents.Page {
flickable: flick
property string location
property string depth
property string dive_id
property string diveNumber
property string duration
property string airtemp
property string watertemp
property string suit
property int rating
property string buddy
property string divemaster;
property string notes;
property string date
property string number
property string weight
state: "view"
states: [
State {
@ -35,10 +42,6 @@ MobileComponents.Page {
PropertyChanges { target: detailsEdit; opacity: 1 }
}
]
onDive_idChanged: {
qmlProfile.diveId = dive_id
qmlProfile.update()
}
ScrollView {
anchors.fill: parent
@ -79,8 +82,7 @@ MobileComponents.Page {
NumberAnimation { duration: MobileComponents.Units.shortDuration }
}
}
ColumnLayout {
DiveDetailsView {
id: detailsView
anchors {
left: parent.left
@ -88,116 +90,11 @@ MobileComponents.Page {
top: parent.top
margins: MobileComponents.Units.smallSpacing
}
spacing: MobileComponents.Units.smallSpacing
Behavior on opacity {
NumberAnimation { duration: MobileComponents.Units.shortDuration }
}
GridLayout {
id: editorDetails
width: parent.width
columns: 2
MobileComponents.Heading {
Layout.columnSpan: 2
text: "VIEW Dive " + number + " (" + date + ")"
}
Item {
Layout.columnSpan: 2
Layout.fillWidth: true
Layout.preferredHeight: qmlProfile.height
QMLProfile {
id: qmlProfile
height: MobileComponents.Units.gridUnit * 25
anchors {
top: parent.top
left: parent.left
right: parent.right
}
//Rectangle { color: "green"; opacity: 0.4; anchors.fill: parent } // used for debugging the dive profile sizing, will be removed later
}
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Location:"
}
TextField {
id: txtLocation; text: location;
Layout.fillWidth: true
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Air Temp:"
}
TextField {
id: txtAirTemp
text: airtemp
Layout.fillWidth: true
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Water Temp:"
}
TextField {
id: txtWaterTemp
text: watertemp
Layout.fillWidth: true
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Suit:"
}
TextField {
id: txtSuit
text: suit
Layout.fillWidth: true
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Buddy:"
}
TextField {
id: txtBuddy
text: buddy
Layout.fillWidth: true
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Dive Master:"
}
TextField {
id: txtDiveMaster
text: divemaster
Layout.fillWidth: true
}
MobileComponents.Label {
Layout.alignment: Qt.AlignRight
text: "Notes:"
}
TextArea {
id: txtNotes
text: notes
focus: true
Layout.fillWidth: true
Layout.fillHeight: true
selectByMouse: true
wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
}
}
Item {
height: MobileComponents.Units.gridUnit * 3
width: height // just to make sure the spacer doesn't produce scrollbars, but also isn't null
}
}
}
}