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

fix(StatusListItem): Make text always fit boundaries

This commit is contained in:
mishkarogachev 2022-05-04 13:35:15 +03:00 committed by r4bbit.eth
parent b09210cf1f
commit 0f511ebc60
2 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
sandbox/controls/ListItems.qml
View File

@ -26,7 +26,7 @@ GridLayout {
badge.value: 1 badge.value: 1
} }
StatusNavigationListItem { StatusNavigationListItem {
title: "Menu Item (selected)" title: "Menu Item (selected) with very long text"
selected: true selected: true
icon.name: "info" icon.name: "info"
badge.value: 1 badge.value: 1
@ -420,10 +420,16 @@ CExPynn1gWf9bx498P7/nzPcxEzGExhBdJGYihtAYQlO+tUZvqrPbqeudo5iJGEJjCE15a3VtodH3q2I
trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy
} }
StatusMemberListItem {
nickName: "very-long-annoying-nickname.eth"
isOnline: false
trustIndicator: StatusContactVerificationIcons.TrustedType.Untrustworthy
}
StatusMemberListItem { StatusMemberListItem {
nickName: "This girl I know from work" nickName: "This girl I know from work"
userName: "annabelle" userName: "annabelle"
isOnline: true isOnline: true
} }
StatusMemberListItem { StatusMemberListItem {

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

@ -14,13 +14,13 @@ Rectangle {
property string title: "" property string title: ""
property string titleAsideText: "" property string titleAsideText: ""
property string subTitle: "" property string subTitle: ""
property string tertiaryTitle: "" property string tertiaryTitle: ""
property string label: "" property string label: ""
property real leftPadding: 16 property real leftPadding: 16
property real rightPadding: 16 property real rightPadding: 16
property bool enabled: true property bool enabled: true
property bool highlighted: false property bool highlighted: false
property bool propagateTitleClicks: true property bool propagateTitleClicks: true
property int type: StatusListItem.Type.Primary property int type: StatusListItem.Type.Primary
property list<Item> components property list<Item> components
property var bottomModel: [] property var bottomModel: []
@ -169,26 +169,34 @@ Rectangle {
text: statusListItem.title text: statusListItem.title
font.pixelSize: 15 font.pixelSize: 15
height: visible ? contentHeight : 0 height: visible ? contentHeight : 0
wrapMode: Text.WrapAtWordBoundaryOrAnywhere elide: Text.ElideRight
anchors.left: parent.left anchors.left: parent.left
anchors.right: !statusListItem.titleAsideText && !titleIconsRow.sourceComponent ? parent.right : undefined
anchors.top: bottomModel.length === 0 ? undefined: parent.top anchors.top: bottomModel.length === 0 ? undefined: parent.top
anchors.topMargin: bottomModel.length === 0 ? undefined : 20 anchors.topMargin: bottomModel.length === 0 ? undefined : 20
width: Math.min(implicitWidth, parent.width)
color: { color: {
if (!statusListItem.enabled) { if (!statusListItem.enabled) {
return Theme.palette.baseColor1 return Theme.palette.baseColor1
} }
switch (statusListItem.type) { switch (statusListItem.type) {
case StatusListItem.Type.Primary: case StatusListItem.Type.Primary:
return Theme.palette.directColor1 return Theme.palette.directColor1
case StatusListItem.Type.Secondary: case StatusListItem.Type.Secondary:
return Theme.palette.primaryColor1 return Theme.palette.primaryColor1
case StatusListItem.Type.Danger: case StatusListItem.Type.Danger:
return Theme.palette.dangerColor1 return Theme.palette.dangerColor1
} }
}
StatusToolTip {
id: statusListItemTitleTooltip
text: statusListItemTitle.text
delay: 0
visible: statusListItemTitle.truncated && statusListItemTitleMouseArea.containsMouse
} }
MouseArea { MouseArea {
id: statusListItemTitleMouseArea
anchors.fill: parent anchors.fill: parent
enabled: statusListItem.enabled enabled: statusListItem.enabled
cursorShape: sensor.enabled && containsMouse ? Qt.PointingHandCursor : Qt.ArrowCursor cursorShape: sensor.enabled && containsMouse ? Qt.PointingHandCursor : Qt.ArrowCursor