diff options
Diffstat (limited to 'qt-mobile')
| -rw-r--r-- | qt-mobile/main.qml | 298 |
1 files changed, 160 insertions, 138 deletions
diff --git a/qt-mobile/main.qml b/qt-mobile/main.qml index 4efa34093..d3447a0c7 100644 --- a/qt-mobile/main.qml +++ b/qt-mobile/main.qml @@ -2,12 +2,12 @@ import QtQuick 2.3 import QtQuick.Controls 1.2 import QtQuick.Window 2.2 import QtQuick.Dialogs 1.2 +import QtQuick.Layouts 1.1 import org.subsurfacedivelog.mobile 1.0 ApplicationWindow { title: qsTr("Subsurface") width: 500; - height: 700 FileDialog { id: fileOpen @@ -23,179 +23,201 @@ ApplicationWindow { id: manager } - menuBar: MenuBar { - Menu { - title: qsTr("File") - MenuItem { - text: qsTr("Open") - onTriggered: fileOpen.open() - } - - MenuItem { - text: qsTr("Exit") - onTriggered: Qt.quit(); - } - } + Preferences { + id: prefsWindow } - Rectangle { - id: page - width: parent.width; height: parent.height + ColumnLayout { + id: layout + anchors.fill: parent + spacing: 4 + + Rectangle { + id: topPart + height: 35 + Layout.fillWidth: true + Layout.maximumHeight: 35 + + RowLayout { + Button { + id: prefsButton + text: "Preferences" + onClicked: { + prefsWindow.show() + } + } - Component { - id: diveDelegate + Button { + id: openFile + text: "Open File" + onClicked: { + fileOpen.open(); + } + } + } - Item { - id: dive + } - property real detailsOpacity : 0 + Rectangle { + id: page + Layout.fillHeight: true + Layout.fillWidth: true - width: diveListView.width - height: 70 + Component { + id: diveDelegate - //Bounded rect for the background - Rectangle { - id: background - x: 2; y: 2; width: parent.width - x*2; height: parent.height - y*2; - color: "ivory" - border.color: "orange" - radius: 5 - } + Item { + id: dive - //Mouse region: When clicked, the mode changes to details view - MouseArea { - anchors.fill: parent - onClicked: dive.state = 'Details' - } + property real detailsOpacity : 0 - //Layout of the page: (mini profile, dive no, date at the tio - //And other details at the bottom. - Row { - id: topLayout - x: 10; y: 10; height: 60; width: parent.width - spacing: 10 + width: diveListView.width + height: 70 - Column { - width: background.width; height: 60 - spacing: 5 + //Bounded rect for the background + Rectangle { + id: background + x: 2; y: 2; width: parent.width - x*2; height: parent.height - y*2; + color: "ivory" + border.color: "orange" + radius: 5 + } - Text { - text: diveNumber + ' (' + date + ')' + //Mouse region: When clicked, the mode changes to details view + MouseArea { + anchors.fill: parent + onClicked: dive.state = 'Details' + } + + //Layout of the page: (mini profile, dive no, date at the tio + //And other details at the bottom. + Row { + id: topLayout + x: 10; y: 10; height: 60; width: parent.width + spacing: 10 + + Column { + width: background.width; height: 60 + spacing: 5 + + Text { + text: diveNumber + ' (' + date + ')' + } + Text { text: location; width: details.width } + Text { text: '<b>Depth:</b> ' + depth + ' <b>Duration:</b>' + duration; width: details.width } } - Text { text: location; width: details.width } - Text { text: '<b>Depth:</b> ' + depth + ' <b>Duration:</b>' + duration; width: details.width } } - } - Item { - id: details - x: 10; width: parent.width - 20 - anchors { top: topLayout.bottom; topMargin: 10; bottom:parent.bottom; bottomMargin: 10 } - opacity: dive.detailsOpacity + Item { + id: details + x: 10; width: parent.width - 20 + anchors { top: topLayout.bottom; topMargin: 10; bottom:parent.bottom; bottomMargin: 10 } + opacity: dive.detailsOpacity - Text { - id: detailsTitle - anchors.top: parent.top - text: "Dive Details" - font.pointSize: 12; font.bold: true - } + Text { + id: detailsTitle + anchors.top: parent.top + text: "Dive Details" + font.pointSize: 12; font.bold: true + } - Flickable { - id: flick - width: parent.width - anchors { top: detailsTitle.bottom; bottom: parent.bottom } - contentHeight: detailsView.height - clip: true - Row { - Text { text: - '<b>Location: </b>' + location + - '<br><b>Air temp: </b>' + airtemp + ' <b> Water temp: </b>' + watertemp + - '<br><b>Suit: </b>' + suit + - '<br><b>Buddy: </b>' + buddy + - '<br><b>Dive Master: </b>' + divemaster + - '<br/><b>Notes:</b><br/>' + notes; wrapMode: Text.WordWrap; width: details.width } + Flickable { + id: flick + width: parent.width + anchors { top: detailsTitle.bottom; bottom: parent.bottom } + contentHeight: detailsView.height + clip: true + Row { + Text { text: + '<b>Location: </b>' + location + + '<br><b>Air temp: </b>' + airtemp + ' <b> Water temp: </b>' + watertemp + + '<br><b>Suit: </b>' + suit + + '<br><b>Buddy: </b>' + buddy + + '<br><b>Dive Master: </b>' + divemaster + + '<br/><b>Notes:</b><br/>' + notes; wrapMode: Text.WordWrap; width: details.width } + } } } - } - TextButton { - y: 10 - anchors { right: background.right; rightMargin: 10 } - opacity: dive.detailsOpacity - text: "Close" + TextButton { + y: 10 + anchors { right: background.right; rightMargin: 10 } + opacity: dive.detailsOpacity + text: "Close" - onClicked: dive.state = ''; - } + onClicked: dive.state = ''; + } - states: State { - name: "Details" + states: State { + name: "Details" - PropertyChanges { - target: background - color: "white" - } + PropertyChanges { + target: background + color: "white" + } - PropertyChanges { - target: dive - detailsOpacity: 1; x:0 //Make details visible - height: diveListView.height //Fill entire list area with the details - } + PropertyChanges { + target: dive + detailsOpacity: 1; x:0 //Make details visible + height: diveListView.height //Fill entire list area with the details + } - //Move the list so that this item is at the top - PropertyChanges { - target: dive.ListView.view - explicit: true - contentY: dive.y - } + //Move the list so that this item is at the top + PropertyChanges { + target: dive.ListView.view + explicit: true + contentY: dive.y + } - //Disable flicking while we are in detailed view - PropertyChanges { - target: dive.ListView.view - interactive: false + //Disable flicking while we are in detailed view + PropertyChanges { + target: dive.ListView.view + interactive: false + } } - } - transitions: Transition { - //make the state changes smooth - ParallelAnimation { - ColorAnimation { - property: "color" - duration: 500 - } - NumberAnimation { - duration: 300 - properties: "detailsOpacity,x,contentY,height,width" + transitions: Transition { + //make the state changes smooth + ParallelAnimation { + ColorAnimation { + property: "color" + duration: 500 + } + NumberAnimation { + duration: 300 + properties: "detailsOpacity,x,contentY,height,width" + } } } } } - } - Component { - id: tripHeading - Rectangle { - width: page.width - height: childrenRect.height - color: "lightsteelblue" - - Text { - text: section - font.bold: true - font.pointSize: 16 + Component { + id: tripHeading + Rectangle { + width: page.width + height: childrenRect.height + color: "lightsteelblue" + + Text { + text: section + font.bold: true + font.pointSize: 16 + } } } - } - ListView { - id: diveListView - anchors.fill: parent - model: diveModel - delegate: diveDelegate - focus: true + ListView { + id: diveListView + anchors.fill: parent + model: diveModel + delegate: diveDelegate + focus: true - section.property: "trip" - section.criteria: ViewSection.FullString - section.delegate: tripHeading + section.property: "trip" + section.criteria: ViewSection.FullString + section.delegate: tripHeading + } } } } |