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

8
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,6 +420,12 @@ 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"

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

@ -169,11 +169,11 @@ 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
@ -188,7 +188,15 @@ Rectangle {
} }
} }
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