diff options
-rw-r--r-- | qt-mobile/DiveList.qml | 73 | ||||
-rw-r--r-- | qt-mobile/TopBar.qml | 26 | ||||
-rw-r--r-- | qt-mobile/main.qml | 10 | ||||
-rw-r--r-- | qt-mobile/mobile-resources.qrc | 1 |
4 files changed, 91 insertions, 19 deletions
diff --git a/qt-mobile/DiveList.qml b/qt-mobile/DiveList.qml index 6c03daa5f..86a57b614 100644 --- a/qt-mobile/DiveList.qml +++ b/qt-mobile/DiveList.qml @@ -40,23 +40,84 @@ Rectangle { //Layout of the page: (mini profile, dive no, date at the top //And other details at the bottom. - Column { + Item { x: units.spacing width: parent.width - units.spacing * 2 height: childrenRect.height + units.spacing * 2 - spacing: units.spacing / 2 + //spacing: units.spacing / 2 anchors.margins: units.spacing Text { - text: diveNumber + ' (' + date + ')' + id: locationText + text: location + color: theme.textColor + scale: 1.1 // Let's see how this works, otherwise, we'll need the default point size somewhere + transformOrigin: Item.TopLeft + anchors { + left: parent.left + top: parent.top + } + } + Text { + text: date + opacity: 0.6 + color: theme.textColor + anchors { + right: parent.right + top: parent.top + bottomMargin: units.spacing / 2 + } + } + Row { + id: descriptionText + anchors { + left: parent.left + right: parent.right + bottom: numberText.bottom + } + Text { + text: 'Depth: ' + opacity: 0.6 + color: theme.textColor + } + Text { + text: depth + width: Math.max(units.gridUnit * 3, paintedWidth) // helps vertical alignment throughout listview + color: theme.textColor + } + Text { + text: 'Duration: ' + opacity: 0.6 + color: theme.textColor + } + Text { + text: duration + color: theme.textColor + } + } + Text { + id: numberText + text: "#" + diveNumber + color: theme.textColor + scale: 1.2 + transformOrigin: Item.BottomRight + opacity: 0.4 + anchors { + right: parent.right + topMargin: units.spacing + top: locationText.bottom + } } - Text { text: location; width: parent.width } - Text { text: '<b>Depth:</b> ' + depth + ' <b>Duration:</b> ' + duration; width: parent.width } + //Text { text: location; width: parent.width } Rectangle { color: theme.textColor opacity: .2 - width: parent.width height: Math.max(1, units.gridUnit / 24) // we really want a thin line + anchors { + left: parent.left + right: parent.right + top: numberText.bottom + } } } } diff --git a/qt-mobile/TopBar.qml b/qt-mobile/TopBar.qml index 1edd868c2..da000c469 100644 --- a/qt-mobile/TopBar.qml +++ b/qt-mobile/TopBar.qml @@ -9,31 +9,31 @@ import org.subsurfacedivelog.mobile 1.0 Rectangle { id: topBar - color: "#2C4882" + color: theme.accentColor Layout.fillWidth: true Layout.margins: 0 - Layout.minimumHeight: prefsButton.height * 1.2 + Layout.minimumHeight: prefsButton.height + units.spacing * 2 RowLayout { anchors.bottom: topBar.bottom - anchors.bottomMargin: prefsButton.height * 0.1 + anchors.bottomMargin: units.spacing anchors.left: topBar.left - anchors.leftMargin: prefsButton.height * 0.1 + anchors.leftMargin: units.spacing anchors.right: topBar.right - anchors.rightMargin: prefsButton.height * 0.1 + anchors.rightMargin: units.spacing Button { id: backButton Layout.maximumHeight: prefsButton.height Layout.minimumHeight: prefsButton.height - Layout.preferredWidth: Screen.width * 0.1 + Layout.preferredWidth: units.gridUnit * 2 text: "\u2190" style: ButtonStyle { background: Rectangle { - color: "#2C4882" - implicitWidth: 50 + color: theme.accentColor + implicitWidth: units.gridUnit * 2 } label: Text { id: txt - color: "white" + color: theme.accentTextColor font.pointSize: 18 font.bold: true text: control.text @@ -58,10 +58,10 @@ Rectangle { Text { text: qsTr("Subsurface mobile") font.pointSize: 18 - font.bold: true - color: "white" - anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter + color: theme.accentTextColor + anchors.left: backButton.right + anchors.leftMargin: units.spacing + //horizontalAlignment: Text.AlignHCenter } } } diff --git a/qt-mobile/main.qml b/qt-mobile/main.qml index 97f1da6bb..5c8c04b2c 100644 --- a/qt-mobile/main.qml +++ b/qt-mobile/main.qml @@ -100,11 +100,21 @@ ApplicationWindow { anchors.leftMargin: units.spacing anchors.right: topPart.right anchors.rightMargin: units.spacing + Image { + source: "qrc:/qml/subsurface-mobile-icon.png" + Layout.maximumWidth: units.gridUnit * 2 + Layout.preferredWidth: units.gridUnit * 2 + Layout.preferredHeight: units.gridUnit * 2 + } Text { text: qsTr("Subsurface mobile") font.pointSize: 18 + Layout.fillWidth: false color: theme.accentTextColor } + Item { + Layout.fillWidth: true + } Button { id: prefsButton text: "\u22ee" diff --git a/qt-mobile/mobile-resources.qrc b/qt-mobile/mobile-resources.qrc index 93cda6dc9..2241fa667 100644 --- a/qt-mobile/mobile-resources.qrc +++ b/qt-mobile/mobile-resources.qrc @@ -8,6 +8,7 @@ <file>DownloadFromDiveComputer.qml</file> <file>Log.qml</file> <file>TopBar.qml</file> + <file alias="subsurface-mobile-icon.png">../icons/subsurface-mobile-icon.png</file> </qresource> <qresource prefix="/qml/theme"> <file alias="Theme.qml">theme/Theme.qml</file> |