120 lines
2.9 KiB
QML
120 lines
2.9 KiB
QML
import QtQuick 2.15
|
|
import QtQml 2.15
|
|
import QtQuick.Controls 2.15
|
|
import QtGraphicalEffects 1.15
|
|
|
|
import StatusQ.Components 0.1
|
|
import StatusQ.Controls 0.1
|
|
import StatusQ.Core.Theme 0.1
|
|
|
|
import utils 1.0
|
|
|
|
StatusListItem {
|
|
id: root
|
|
|
|
// input/output property
|
|
property int checkState: Qt.Unchecked
|
|
|
|
//input property
|
|
// Defines the next state of the checkbox when clicked
|
|
// By default, it toggles between checked and unchecked
|
|
property int nextCheckState: checkState === Qt.Checked ? Qt.Unchecked : Qt.Checked
|
|
|
|
required property string iconUrl
|
|
property bool showIndicator: true
|
|
property bool multiSelection: false
|
|
property bool interactive: true
|
|
|
|
// output signal
|
|
// Emitted when the checkbox is clicked
|
|
// This signal is useful when the check state needs to change
|
|
// only after processing the toggle event E.g backend call
|
|
signal toggled
|
|
|
|
objectName: root.title
|
|
asset.height: 24
|
|
asset.width: 24
|
|
asset.isImage: true
|
|
asset.name: root.iconUrl
|
|
onClicked: {
|
|
d.toggled()
|
|
}
|
|
|
|
leftPadding: 16
|
|
rightPadding: 16
|
|
statusListItemTitleArea.anchors.leftMargin: 12
|
|
highlighted: d.checkState !== Qt.Unchecked && !showIndicator
|
|
|
|
Binding on bgColor {
|
|
when: highlighted && !root.sensor.containsMouse
|
|
value: root.interactive ? Theme.palette.baseColor4 : Theme.palette.primaryColor3
|
|
restoreMode: Binding.RestoreBindingOrValue
|
|
}
|
|
|
|
onCheckStateChanged: {
|
|
if (checkState !== d.checkState) {
|
|
d.checkState = checkState
|
|
}
|
|
}
|
|
|
|
components: [
|
|
Loader {
|
|
id: indicatorLoader
|
|
sourceComponent: root.multiSelection ? checkBoxComponent : radioButtonComponent
|
|
active: root.showIndicator
|
|
}
|
|
]
|
|
|
|
|
|
Component {
|
|
id: checkBoxComponent
|
|
StatusCheckBox {
|
|
id: checkBox
|
|
|
|
objectName: "networkSelectionCheckbox_" + root.title
|
|
checkState: d.checkState
|
|
tristate: true
|
|
nextCheckState: () => d.checkState
|
|
enabled: root.interactive
|
|
|
|
onClicked: {
|
|
d.toggled()
|
|
}
|
|
}
|
|
}
|
|
|
|
Component {
|
|
id: radioButtonComponent
|
|
StatusRadioButton {
|
|
id: radioButton
|
|
objectName: "networkSelectionRadioButton_" + root.title
|
|
size: StatusRadioButton.Size.Large
|
|
checked: d.checkState !== Qt.Unchecked
|
|
enabled: root.interactive
|
|
|
|
onClicked: {
|
|
d.toggled()
|
|
}
|
|
}
|
|
}
|
|
|
|
QtObject {
|
|
id: d
|
|
property int checkState: root.checkState
|
|
|
|
function toggled() {
|
|
if (!root.interactive) {
|
|
return
|
|
}
|
|
d.checkState = root.nextCheckState
|
|
root.toggled()
|
|
}
|
|
|
|
onCheckStateChanged: {
|
|
if (checkState !== root.checkState) {
|
|
root.checkState = checkState
|
|
}
|
|
}
|
|
}
|
|
}
|