mirror of https://github.com/status-im/StatusQ.git
feat(StatusListItem): Added new properties to handle inline tags needed in the wallet section (#879)
This commit is contained in:
parent
384924ce58
commit
7108ac87cf
|
@ -576,4 +576,42 @@ ColumnLayout {
|
|||
asset.isLetterIdenticon: true
|
||||
loadingFailed: true
|
||||
}
|
||||
|
||||
StatusListItem {
|
||||
implicitWidth: 600
|
||||
title: "List Item with Tags"
|
||||
subTitle: "03:32"
|
||||
asset.isLetterIdenticon: true
|
||||
inlineTagModel: 6
|
||||
inlineTagDelegate: StatusListItemTag {
|
||||
height: 24
|
||||
title: "tag"
|
||||
asset.isLetterIdenticon: true
|
||||
}
|
||||
components: [
|
||||
ColumnLayout {
|
||||
Row {
|
||||
Layout.alignment: Qt.AlignRight
|
||||
spacing: 4
|
||||
StatusIcon {
|
||||
color: Theme.palette.successColor1
|
||||
icon: "arrow-up"
|
||||
rotation: 135
|
||||
height: 18
|
||||
}
|
||||
StatusBaseText {
|
||||
text: "0.0000015 ETH"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.directColor1
|
||||
}
|
||||
}
|
||||
StatusBaseText {
|
||||
Layout.alignment: Qt.AlignRight
|
||||
text: "1201.10 USD"
|
||||
font.pixelSize: 15
|
||||
color: Theme.palette.baseColor1
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
|
@ -31,6 +31,8 @@ Rectangle {
|
|||
property Component bottomDelegate
|
||||
property alias tagsModel: tagsRepeater.model
|
||||
property Component tagsDelegate
|
||||
property var inlineTagModel: []
|
||||
property Component inlineTagDelegate
|
||||
property bool loading: false
|
||||
property bool loadingFailed: false
|
||||
|
||||
|
@ -278,25 +280,67 @@ Rectangle {
|
|||
anchors.leftMargin: 4
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemSubTitle
|
||||
objectName: "statusListItemSubTitle"
|
||||
RowLayout {
|
||||
id: statusListItemSubtitleTagsRow
|
||||
anchors.top: statusListItemTitle.bottom
|
||||
anchors.topMargin: 4
|
||||
width: parent.width
|
||||
text: statusListItem.subTitle
|
||||
font.pixelSize: 15
|
||||
color: statusListItem.loadingFailed ? Theme.palette.dangerColor1
|
||||
: !statusListItem.enabled || !statusListItem.tertiaryTitle
|
||||
? Theme.palette.baseColor1
|
||||
: Theme.palette.directColor1
|
||||
height: visible ? contentHeight : 0
|
||||
visible: !!statusListItem.subTitle
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
spacing: 4
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemSubTitle
|
||||
objectName: "statusListItemSubTitle"
|
||||
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: inlineTagModelRepeater.count > 0 ? contentWidth : parent.width
|
||||
|
||||
text: statusListItem.subTitle
|
||||
font.pixelSize: 15
|
||||
color: statusListItem.loadingFailed ? Theme.palette.dangerColor1
|
||||
: !statusListItem.enabled || !statusListItem.tertiaryTitle
|
||||
? Theme.palette.baseColor1
|
||||
: Theme.palette.directColor1
|
||||
visible: !!statusListItem.subTitle
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: dot
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.topMargin: -48
|
||||
|
||||
text: "."
|
||||
font.pixelSize: 40
|
||||
color: Theme.palette.baseColor1
|
||||
lineHeightMode: Text.FixedHeight
|
||||
lineHeight: 24
|
||||
|
||||
visible: inlineTagModelRepeater.count > 0
|
||||
}
|
||||
|
||||
StatusScrollView {
|
||||
id: inlineTagModelRepeaterRow
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredHeight: row.height
|
||||
contentHeight: row.height
|
||||
contentWidth: row.width
|
||||
padding: 0
|
||||
clip: true
|
||||
Row {
|
||||
id: row
|
||||
Repeater {
|
||||
id: inlineTagModelRepeater
|
||||
model: inlineTagModel
|
||||
delegate: inlineTagDelegate
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StatusBaseText {
|
||||
id: statusListItemTertiaryTitle
|
||||
anchors.top: statusListItemSubTitle.bottom
|
||||
anchors.top: statusListItemSubtitleTagsRow.bottom
|
||||
width: parent.width
|
||||
height: visible ? contentHeight : 0
|
||||
text: statusListItem.tertiaryTitle
|
||||
|
|
Loading…
Reference in New Issue