mifr/subsurface
1
0
Fork 0
mirror of https://github.com/subsurface/subsurface.git synced 2024-11-30 22:20:21 +00:00
Code Issues Projects Releases Packages Wiki Activity

QML-UI: improve list painting

Browse source 
- section headers get underline with a thick line
- items are separated by spacing and a thin grey line at the bottom
- spacing on both sides, aligning with header

Signed-off-by: Sebastian Kügler <sebas@kde.org>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Sebastian Kügler 2015-10-09 03:56:36 +02:00 committed by Dirk Hohndel
parent 0ed2584231
commit 5195fcf919
1 changed files with 41 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
qt-mobile/DiveList.qml
View file

@ -16,18 +16,9 @@ Rectangle {
property real detailsOpacity : 0
width: diveListView.width
width: diveListView.width - units.spacing
height: childrenRect.height
//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: "lightblue"
radius: 5
}
//Mouse region: When clicked, the mode changes to details view
MouseArea {
anchors.fill: parent
@ -49,19 +40,23 @@ Rectangle {
//Layout of the page: (mini profile, dive no, date at the top
//And other details at the bottom.
Row {
id: topLayout
x: 10; y: 10; height: childrenRect.height; width: parent.width
Column {
x: units.spacing
width: parent.width - units.spacing * 2
height: childrenRect.height + units.spacing * 2
spacing: units.spacing / 2
anchors.margins: units.spacing
Column {
width: background.width; height: childrenRect.height * 1.1
spacing: 5
Text {
text: diveNumber + ' (' + date + ')'
}
Text { text: location; width: parent.width }
Text { text: '<b>Depth:</b> ' + depth + ' <b>Duration:</b> ' + duration; width: parent.width }
Text {
text: diveNumber + ' (' + date + ')'
}
Text { text: location; width: parent.width }
Text { text: '<b>Depth:</b> ' + depth + ' <b>Duration:</b> ' + duration; 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
}
}
}
@ -69,16 +64,32 @@ Rectangle {
Component {
id: tripHeading
Rectangle {
width: page.width
height: childrenRect.height
color: "lightsteelblue"
Item {
width: page.width - units.spacing * 2
height: childrenRect.height + units.spacing * 2
Text {
id: sectionText
text: section
font.bold: true
anchors {
top: parent.top
left: parent.left
leftMargin: units.spacing
right: parent.right
}
color: theme.textColor
font.pointSize: 16
}
Rectangle {
height: Math.max(2, units.gridUnit / 12) // we want a thicker line
anchors {
top: sectionText.bottom
left: parent.left
leftMargin: units.spacing
right: parent.right
}
color: theme.accentColor
}
}
}
@ -87,8 +98,10 @@ Rectangle {
anchors.fill: parent
model: diveModel
delegate: diveDelegate
boundsBehavior: Flickable.StopAtBounds
//highlight: Rectangle { color: theme.highlightColor; width: units.spacing }
focus: true
clip: true
section.property: "trip"
section.criteria: ViewSection.FullString
section.delegate: tripHeading