status-im
/
status-qml
mirror of
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(@StatusListItem): Use tags model

This commit is contained in:
Anthony Laibe 2022-03-09 11:31:04 +01:00 committed by r4bbit.eth
parent 7e9c7a52fd
commit 9dbb7ec53f
3 changed files with 26 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
sandbox/controls/ListItems.qml
View File

@ -331,12 +331,11 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
StatusListItem {
title: "List Item with Tags"
icon.isLetterIdenticon: true
tags: [
StatusListItemTag {
title: qsTr("Tag 1")
bottomModel: 3
bottomDelegate: StatusListItemTag {
title: "tag"
icon.isLetterIdenticon: true
}
]
}
StatusDescriptionListItem {

40
src/StatusQ/Components/StatusListItem.qml
View File

@ -23,7 +23,8 @@ Rectangle {
property bool propagateTitleClicks: true
property int type: StatusListItem.Type.Primary
property list<Item> components
property list<StatusListItemTag> tags
property var bottomModel: []
property Component bottomDelegate
property StatusIconSettings icon: StatusIconSettings {
height: isLetterIdenticon ? 40 : 20
@ -81,7 +82,7 @@ Rectangle {
implicitWidth: 448
implicitHeight: {
if (tags.length === 0) {
if (bottomModel.length === 0) {
return Math.max(64, statusListItemTitleArea.height + 16)
}
return Math.max(64, statusListItemTitleArea.height + 90)
@ -109,14 +110,6 @@ Rectangle {
}
}
onTagsChanged: {
if (tags.length) {
for (let idx in tags) {
tags[idx].parent = statusListItemTagsSlot
}
}
}
MouseArea {
id: sensor
@ -162,7 +155,7 @@ Rectangle {
anchors.right: statusListItemLabel.visible ? statusListItemLabel.left : statusListItemComponentsSlot.left
anchors.leftMargin: iconOrImage.active ? 16 : statusListItem.leftPadding
anchors.rightMargin: statusListItem.rightPadding
anchors.verticalCenter: tags.length === 0 ? parent.verticalCenter : undefined
anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined
height: childrenRect.height
@ -174,8 +167,8 @@ Rectangle {
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
anchors.left: parent.left
anchors.right: !statusListItem.titleAsideText && !titleIconsRow.sourceComponent ? parent.right : undefined
anchors.top: tags.length === 0 ? undefined: parent.top
anchors.topMargin: tags.length === 0 ? undefined : 20
anchors.top: bottomModel.length === 0 ? undefined: parent.top
anchors.topMargin: bottomModel.length === 0 ? undefined : 20
color: {
if (!statusListItem.enabled) {
return Theme.palette.baseColor1
@ -208,8 +201,8 @@ Rectangle {
anchors.left: statusListItemTitle.right
anchors.leftMargin: 4
anchors.verticalCenter: statusListItemTitle.verticalCenter
anchors.top: tags.length === 0 ? undefined: parent.top
anchors.topMargin: tags.length === 0 ? undefined : 20
anchors.top: bottomModel.length === 0 ? undefined: parent.top
anchors.topMargin: bottomModel.length === 0 ? undefined : 20
text: statusListItem.titleAsideText
font.pixelSize: 10
color: Theme.palette.baseColor1
@ -265,13 +258,18 @@ Rectangle {
width: contentItem.width
spacing: 10
anchors.verticalCenter: parent.verticalCenter
Repeater {
model: bottomModel
delegate: bottomDelegate
}
}
StatusBaseText {
id: statusListItemLabel
anchors.verticalCenter: tags.length === 0 ? parent.verticalCenter : undefined
anchors.top: tags.length === 0 ? undefined: parent.top
anchors.topMargin: tags.length === 0 ? undefined : 16
anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined
anchors.top: bottomModel.length === 0 ? undefined: parent.top
anchors.topMargin: bottomModel.length === 0 ? undefined : 16
anchors.right: statusListItemComponentsSlot.left
anchors.rightMargin: statusListItemComponentsSlot.width > 0 ? 10 : 0
@ -285,9 +283,9 @@ Rectangle {
id: statusListItemComponentsSlot
anchors.right: parent.right
anchors.rightMargin: statusListItem.rightPadding
anchors.verticalCenter: tags.length === 0 ? parent.verticalCenter : undefined
anchors.top: tags.length === 0 ? undefined: parent.top
anchors.topMargin: tags.length === 0 ? undefined : 12
anchors.verticalCenter: bottomModel.length === 0 ? parent.verticalCenter : undefined
anchors.top: bottomModel.length === 0 ? undefined: parent.top
anchors.topMargin: bottomModel.length === 0 ? undefined : 12
spacing: 10
}
}

4
src/StatusQ/Components/StatusListItemTag.qml
View File

@ -8,7 +8,7 @@ Rectangle {
id: root
width: titleText.contentWidth + 60
height: 30
color: Theme.palette.primaryColor2
color: Theme.palette.primaryColor3
radius: 15
property string title: ""
@ -62,7 +62,7 @@ Rectangle {
anchors.leftMargin: 5
anchors.verticalCenter: parent.verticalCenter
color: Theme.palette.primaryColor1
icon: "close"
icon: "close-circle"
}
MouseArea {