QML UI: use stackView to show sub windows

QML on Android doesn't support multiple windows, so dialogs that work on
the desktop are not a good solution on Android. A much more natural way to
present sub windows is a stackView.

In order to do this Preferences needs to be an item and the structure of
the ApplicationWindow needs to change a bit.

This also removes the hard coded sizes and instead tries to design this in
a resolution independent manner.

The diff appears larger than the actual change because of an increase of
indentation for the ApplicationWindow content.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Dirk Hohndel 2015-07-12 10:56:48 -07:00
parent 57e9784d27
commit 164cafe5d3
2 changed files with 66 additions and 52 deletions

View file

@ -5,7 +5,7 @@ import QtQuick.Dialogs 1.2
import QtQuick.Layouts 1.1 import QtQuick.Layouts 1.1
import org.subsurfacedivelog.mobile 1.0 import org.subsurfacedivelog.mobile 1.0
Window { Item {
id: loginWindow id: loginWindow
signal accept signal accept
@ -14,8 +14,6 @@ Window {
property string password: password.text; property string password: password.text;
property bool issave: savePassword.checked; property bool issave: savePassword.checked;
flags: Qt.Dialog
modality: Qt.WindowModal
GridLayout { GridLayout {
columns: 2 columns: 2
anchors.centerIn: parent anchors.centerIn: parent
@ -66,8 +64,7 @@ Window {
manager.cloudUserName = login.text manager.cloudUserName = login.text
manager.cloudPassword = password.text manager.cloudPassword = password.text
manager.savePreferences() manager.savePreferences()
loginWindow.close(); stackView.pop()
loginWindow.accept();
} }
} }
} }
@ -80,7 +77,7 @@ Window {
text: "Cancel" text: "Cancel"
onClicked: { onClicked: {
loginWindow.close(); stackView.pop();
} }
} }
} }

View file

@ -10,31 +10,39 @@ ApplicationWindow {
property bool fullscreen: true property bool fullscreen: true
visible: true visible: true
QMLManager { StackView {
id: manager id: stackView
} anchors.fill: parent
focus: true
Preferences { Keys.onReleased: if (event.key == Qt.Key_Back && stackView.depth > 1) {
id: prefsWindow stackView.pop()
event.accepted = true;
} }
initialItem: Item {
width: parent.width
height: parent.height
ColumnLayout { ColumnLayout {
id: layout id: awLayout
anchors.fill: parent anchors.fill: parent
spacing: 4 spacing: prefsButton.height * 0.1
Rectangle { Rectangle {
id: topPart id: topPart
height: 35 Layout.minimumHeight: prefsButton.height * 1.2
Layout.fillWidth: true Layout.fillWidth: true
Layout.maximumHeight: 35 anchors.bottom: detailsPage.top
anchors.bottomMargin: prefsButton.height * 0.1
RowLayout { RowLayout {
anchors.bottom: topPart.bottom
anchors.bottomMargin: prefsButton.height * 0.1
anchors.left: topPart.left
anchors.leftMargin: prefsButton.height * 0.1
Button { Button {
id: prefsButton id: prefsButton
text: "Preferences" text: "Preferences"
onClicked: { onClicked: {
prefsWindow.show() stackView.push(prefsWindow)
} }
} }
@ -53,9 +61,6 @@ ApplicationWindow {
id: detailsPage id: detailsPage
Layout.fillHeight: true Layout.fillHeight: true
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumWidth: 100
Layout.preferredHeight: 400
Layout.preferredWidth: 200
DiveList { DiveList {
anchors.fill: detailsPage anchors.fill: detailsPage
@ -64,4 +69,16 @@ ApplicationWindow {
} }
} }
}
}
QMLManager {
id: manager
}
Preferences {
id: prefsWindow
visible: false
}
} }