mifr/subsurface
1
0
Fork 0
mirror of https://github.com/subsurface/subsurface.git synced 2025-01-20 06:45:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

QML UI: improve the dive list layout

Browse source 
Based on Davide's ideas, but with a few tweaks:
I really like the dive number on the far right; that gives a clean
consistent look. I tried it with date on the left and depth/duration in
the middle and liked the result.

This doesn't change the font, just addresses the layout and bold heading
vs smaller sub-heading.

See #427

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Dirk Hohndel 2017-06-18 17:06:53 -07:00
parent 6afe6baa14
commit 47a01b1dcd
1 changed files with 10 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
mobile-widgets/qml/DiveList.qml
View file

@ -64,7 +64,7 @@ Kirigami.ScrollablePage {
Kirigami.Label {
id: locationText
text: dive.location
font.weight: Font.Light
font.weight: Font.Bold
elide: Text.ElideRight
maximumLineCount: 1 // needed for elide to work at all
color: textColor
@ -72,49 +72,30 @@ Kirigami.ScrollablePage {
left: parent.left
leftMargin: horizontalPadding
top: parent.top
right: dateLabel.left
}
}
Kirigami.Label {
id: dateLabel
text: dive.date + " " + dive.time
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
anchors {
right: parent.right
top: parent.top
}
}
Row {
anchors {
left: parent.left
leftMargin: horizontalPadding
right: parent.right
rightMargin: horizontalPadding
left: locationText.left
top: locationText.bottom
topMargin: - Kirigami.Units.smallSpacing * 2
bottom: numberText.bottom
}
Kirigami.Label {
text: qsTr('Depth: ')
id: dateLabel
text: dive.date + " " + dive.time
width: Math.max(locationText.width * 0.45, paintedWidth) // helps vertical alignment throughout listview
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
// let's try to show the depth / duration very compact
Kirigami.Label {
text: dive.depth
text: dive.depth + ' / ' + dive.duration
width: Math.max(Kirigami.Units.gridUnit * 3, paintedWidth) // helps vertical alignment throughout listview
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
Kirigami.Label {
text: qsTr('Duration: ')
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
Kirigami.Label {
text: dive.duration
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
}
Kirigami.Label {
id: numberText
@ -123,6 +104,7 @@ Kirigami.ScrollablePage {
color: textColor
anchors {
right: parent.right
rightMargin: horizontalPadding
top: locationText.bottom
topMargin: - Kirigami.Units.smallSpacing * 2
}