QML UI: display rating and visibility stars

Display rating and visibility stars on the dive details page. See #495

Signed-off-by: Joakim Bygdell <j.bygdell@gmail.com>
This commit is contained in:
Joakim Bygdell 2017-07-28 17:43:26 +02:00 committed by Dirk Hohndel
parent ee17d54753
commit 9d7eb33a33
3 changed files with 93 additions and 1 deletions

View file

@ -38,6 +38,8 @@ Kirigami.Page {
property alias gasmix: detailsEdit.gasmixText
property alias gpsCheckbox: detailsEdit.gpsCheckbox
property int updateCurrentIdx: manager.updateSelectedDive
property alias rating: detailsEdit.rating
property alias visibility: detailsEdit.visibility
title: currentItem && currentItem.modelData ? currentItem.modelData.dive.location : qsTr("Dive details")
state: "view"
@ -174,6 +176,8 @@ Kirigami.Page {
endpressure = currentItem.modelData.dive.endPressure
gasmix = currentItem.modelData.dive.firstGas
cylinderIndex = currentItem.modelData.dive.cylinderList.indexOf(currentItem.modelData.dive.getCylinder)
rating = currentItem.modelData.dive.rating
visibility = currentItem.modelData.dive.visibility
diveDetailsPage.state = "edit"
}

View file

@ -35,6 +35,8 @@ Item {
property alias divemasterModel: divemasterBox.model
property alias buddyModel: buddyBox.model
property alias cylinderModel: cylinderBox.model
property int rating
property int visibility
function saveData() {
// apply the changes to the dive_table

View file

@ -66,6 +66,7 @@ Item {
}
}
Row {
id: dateRow
anchors {
left: locationText.left
top: locationText.bottom
@ -96,6 +97,91 @@ Item {
top: locationText.bottom
}
}
Row {
anchors {
left: dateRow.left
top: numberText.bottom
}
Kirigami.Label {
id: ratingText
text: qsTr("Rating:")
font.pointSize: subsurfaceTheme.smallPointSize
color: subsurfaceTheme.textColor
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: ratingText.verticalCenter
source: (dive.rating >= 1) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: ratingText.verticalCenter
source: (dive.rating >= 2) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: ratingText.verticalCenter
source: (dive.rating >= 3) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: ratingText.verticalCenter
source: (dive.rating >= 4) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: ratingText.verticalCenter
source: (dive.rating === 5) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
}
Row {
anchors {
right: numberText.right
top: numberText.bottom
}
Kirigami.Label {
id: visibilityText
text: qsTr("Visibility:")
font.pointSize: subsurfaceTheme.smallPointSize
color: subsurfaceTheme.textColor
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: visibilityText.verticalCenter
source: (dive.visibility >= 1) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: visibilityText.verticalCenter
source: (dive.visibility >= 2) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: visibilityText.verticalCenter
source: (dive.visibility >= 3) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: visibilityText.verticalCenter
source: (dive.visibility >= 4) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
Kirigami.Icon {
width: height
height: subsurfaceTheme.regularPointSize
anchors.verticalCenter: visibilityText.verticalCenter
source: (dive.visibility === 5) ? "icons/ic_star.svg" : "icons/ic_star_border.svg"
}
}
}
GridLayout {
id: bottomLayout
@ -104,7 +190,7 @@ Item {
left: parent.left
right: parent.right
margins: Math.round(Kirigami.Units.gridUnit / 2)
topMargin: Kirigami.Units.gridUnit * 2
topMargin: Kirigami.Units.gridUnit
}
columns: 3
rowSpacing: Kirigami.Units.smallSpacing * 2