feat(StatusListItem) expose content children and introduce padding properties

These properties are needed to enable more control over how a list
item implementation can look like.

Content children are exposed as follows:

```qml
StatusListItem {
    statusListItemTitle.[...]: ... // StatusBaseText
    sensor.[...]: ... // MouseArea

    rightPadding: ... // default 16
    leftPadding: .. // default 16
}
```
This commit is contained in:
Pascal Precht 2021-06-07 12:56:24 +02:00 committed by Michał Cieślak
parent ae9c1d810f
commit f4005ed52c
1 changed files with 9 additions and 3 deletions

View File

@ -15,6 +15,8 @@ Rectangle {
property string title: ""
property string subTitle: ""
property real leftPadding: 16
property real rightPadding: 16
property StatusIconSettings icon: StatusIconSettings {
height: 20
width: 20
@ -27,6 +29,10 @@ Rectangle {
property StatusImageSettings image: StatusImageSettings {}
property string label: ""
property alias sensor: sensor
property alias statusListItemTitle: statusListItemTitle
property alias statusListItemComponentsSlot: statusListItemComponentsSlot
property list<Item> components
onComponentsChanged: {
@ -47,7 +53,7 @@ Rectangle {
Loader {
id: iconOrImage
anchors.left: parent.left
anchors.leftMargin: 16
anchors.leftMargin: statusListItem.leftPadding
anchors.verticalCenter: parent.verticalCenter
sourceComponent: !!statusListItem.icon.name ? statusRoundedIcon : statusRoundedImage
active: !!statusListItem.icon.name || !!statusListItem.image.source.toString()
@ -74,7 +80,7 @@ Rectangle {
Item {
anchors.left: iconOrImage.active ? iconOrImage.right : parent.left
anchors.leftMargin: 16
anchors.leftMargin: statusListItem.leftPadding
anchors.verticalCenter: parent.verticalCenter
height: statusListItemTitle.height + (statusListItemSubTitle.visible ? statusListItemSubTitle.height : 0)
@ -111,7 +117,7 @@ Rectangle {
Row {
id: statusListItemComponentsSlot
anchors.right: parent.right
anchors.rightMargin: 16
anchors.rightMargin: statusListItem.rightPadding
anchors.verticalCenter: parent.verticalCenter
spacing: 10
}