subsurface/mobile-widgets/qml/TripDetails.qml
Dirk Hohndel d9661a7be8 mobile/UI: initialize Kirigami theme to use our colors
With this we should finally get the correct button colors even when
switching color theme.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
2020-12-23 09:44:39 -08:00

139 lines
3.3 KiB
QML

// SPDX-License-Identifier: GPL-2.0
import QtQuick 2.6
import QtQuick.Controls 2.2 as Controls
import QtQuick.Layouts 1.2
import org.subsurfacedivelog.mobile 1.0
import org.kde.kirigami 2.4 as Kirigami
Kirigami.Page {
id: tripEditPage
objectName: "TripDetails"
property string tripId
property string tripLocation
property string tripNotes
title: "" !== tripLocation ? tripLocation : qsTr("Trip details")
state: "view"
padding: Kirigami.Units.largeSpacing
background: Rectangle { color: subsurfaceTheme.backgroundColor }
// we want to use our own colors for Kirigami, so let's define our colorset
Kirigami.Theme.inherit: false
Kirigami.Theme.colorSet: Kirigami.Theme.Button
Kirigami.Theme.backgroundColor: subsurfaceTheme.backgroundColor
Kirigami.Theme.textColor: subsurfaceTheme.textColor
actions.main: saveAction
actions.right: cancelAction
onVisibleChanged: {
resetState()
}
onTripIdChanged: {
resetState()
}
function resetState() {
// make sure we have the right width and reset focus / state if there aren't any unsaved changes
if (parent)
width = parent.width
if (tripLocation === tripLocationField.text && tripNotes === tripNotesField.text) {
tripLocationField.focus = false
tripNotesField.focus = false
state = "view"
}
}
states: [
State {
name: "view"
PropertyChanges { target: saveAction; enabled: false }
},
State {
name: "edit"
PropertyChanges { target: saveAction; enabled: true }
}
]
property QtObject saveAction: Kirigami.Action {
icon {
name: ":/icons/document-save.svg"
color: enabled ? subsurfaceTheme.primaryColor : subsurfaceTheme.backgroundColor
}
text: enabled ? qsTr("Save edits") : ""
onTriggered: {
manager.appendTextToLog("Save trip details triggered")
manager.updateTripDetails(tripId, tripLocationField.text, tripNotesField.text)
Qt.inputMethod.hide()
pageStack.pop()
}
}
property QtObject cancelAction: Kirigami.Action {
text: qsTr("Cancel edit")
icon {
name: ":/icons/dialog-cancel.svg"
}
onTriggered: {
manager.appendTextToLog("Cancel trip details edit")
state = "view"
pageStack.pop()
}
}
Flickable {
id: tripEditFlickable
anchors.fill: parent
GridLayout {
columns: 2
width: tripEditFlickable.width
TemplateLabel {
Layout.columnSpan: 2
id: title
text: qsTr("Edit trip details")
font.pointSize: subsurfaceTheme.titlePointSize
font.bold: true
}
Rectangle {
id: spacer
Layout.columnSpan: 2
color: subsurfaceTheme.backgroundColor
height: Kirigami.Units.gridUnit
width: 1
}
TemplateLabel {
text: qsTr("Trip location:")
opacity: 0.6
}
SsrfTextField {
id: tripLocationField
Layout.fillWidth: true
text: tripLocation
flickable: tripEditFlickable
onFocusChanged: {
tripEditPage.state = "edit"
}
}
TemplateLabel {
Layout.columnSpan: 2
text: qsTr("Trip notes")
opacity: 0.6
}
Controls.TextArea {
id: tripNotesField
text: tripNotes
textFormat: TextEdit.PlainText
color: subsurfaceTheme.textColor
Layout.columnSpan: 2
Layout.fillWidth: true
Layout.fillHeight: true
Layout.minimumHeight: Kirigami.Units.gridUnit * 6
selectByMouse: true
wrapMode: TextEdit.WrapAtWordBoundaryOrAnywhere
onActiveFocusChanged: {
tripEditPage.state = "edit"
}
}
}
}
}