status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix(StatusTagSelector): Adjusted name tags list width and scrolling (#653) 

Needed for https://github.com/status-im/status-desktop/issues/5643
This commit is contained in:
Alexandra Betouni 2022-05-10 19:04:27 +03:00 committed by Michał Cieślak
parent 76c9411329
commit ef891ea02c
2 changed files with 25 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui/StatusQ/sandbox/demoapp/StatusAppChatView.qml
View File

@ -129,8 +129,6 @@ StatusAppThreePanelLayout {
centerPanel: Loader { centerPanel: Loader {
anchors.fill: parent anchors.fill: parent
sourceComponent: root.createChat ? createChatView : chatChannelView sourceComponent: root.createChat ? createChatView : chatChannelView
}
Component { Component {
id: createChatView id: createChatView
CreateChatView { CreateChatView {
@ -144,6 +142,7 @@ StatusAppThreePanelLayout {
model: Models.chatMessagesModel model: Models.chatMessagesModel
} }
} }
}
rightPanel: Item { rightPanel: Item {
anchors.fill: parent anchors.fill: parent

27
ui/StatusQ/src/StatusQ/Components/StatusTagSelector.qml
View File

@ -60,14 +60,14 @@ Item {
id: root id: root
implicitWidth: 448 implicitWidth: 448
implicitHeight: 44 + ((userListView.model.count > 0) ? 44 + contactsLabel.height + contactsLabel.anchors.topMargin + implicitHeight: (104 + contactsLabel.height + contactsLabel.anchors.topMargin + (userListView.model.count * 64)) > root.maxHeight ? root.maxHeight :
((((userListView.model.count * 64) > root.maxHeight) ? root.maxHeight : (userListView.model.count * 64))) :0) (104 + contactsLabel.height + contactsLabel.anchors.topMargin + (userListView.model.count * 64))
/*! /*!
\qmlproperty real StatusTagSelector::maxHeight \qmlproperty real StatusTagSelector::maxHeight
This property holds the maximum height of the component. This property holds the maximum height of the component.
*/ */
property real maxHeight property real maxHeight: (488 + contactsLabel.height + contactsLabel.anchors.topMargin) //default min
/*! /*!
\qmlproperty alias StatusTagSelector::textEdit \qmlproperty alias StatusTagSelector::textEdit
This property holds a reference to the TextEdit component. This property holds a reference to the TextEdit component.
@ -169,7 +169,6 @@ Item {
height: 44 height: 44
radius: 8 radius: 8
color: Theme.palette.baseColor2 color: Theme.palette.baseColor2
RowLayout { RowLayout {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: 16 anchors.leftMargin: 16
@ -183,8 +182,8 @@ Item {
} }
ScrollView { ScrollView {
Layout.preferredWidth: (namesList.contentWidth > (parent.width - 142)) ? Layout.preferredWidth: (namesList.contentWidth > (parent.width - 177)) ?
(parent.width - 142) : namesList.contentWidth (parent.width - 177) : namesList.contentWidth
implicitHeight: 30 implicitHeight: 30
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
visible: (namesList.count > 0) visible: (namesList.count > 0)
@ -198,9 +197,13 @@ Item {
model: namesModel model: namesModel
orientation: ListView.Horizontal orientation: ListView.Horizontal
spacing: 8 spacing: 8
onCountChanged: { function scrollToEnd() {
if (contentWidth > width) {
contentX = contentWidth; contentX = contentWidth;
} }
}
onWidthChanged: { scrollToEnd(); }
onCountChanged: { scrollToEnd(); }
delegate: Rectangle { delegate: Rectangle {
id: nameDelegate id: nameDelegate
width: (nameText.contentWidth + 34) width: (nameText.contentWidth + 34)
@ -238,8 +241,6 @@ Item {
TextInput { TextInput {
id: edit id: edit
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
visible: (namesModel.count < 5)
enabled: visible
focus: true focus: true
color: Theme.palette.directColor1 color: Theme.palette.directColor1
clip: true clip: true
@ -248,7 +249,6 @@ Item {
font.family: Theme.palette.baseFont.name font.family: Theme.palette.baseFont.name
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 44 Layout.preferredHeight: 44
Keys.onPressed: { Keys.onPressed: {
if ((event.key === Qt.Key_Backspace || event.key === Qt.Key_Escape) if ((event.key === Qt.Key_Backspace || event.key === Qt.Key_Escape)
&& getText(cursorPosition, (cursorPosition-1)) === "" && getText(cursorPosition, (cursorPosition-1)) === ""
@ -267,7 +267,7 @@ Item {
StatusBaseText { StatusBaseText {
id: warningTextLabel id: warningTextLabel
visible: (namesModel.count === root.nameCountLimit) visible: (namesModel.count === root.nameCountLimit)
Layout.preferredWidth: 120 Layout.preferredWidth: visible ? 120 : 0
Layout.alignment: Qt.AlignVCenter | Qt.AlignRight Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
font.pixelSize: 10 font.pixelSize: 10
color: Theme.palette.dangerColor1 color: Theme.palette.dangerColor1
@ -294,10 +294,11 @@ Item {
width: 360 width: 360
anchors { anchors {
top: (root.sortedList.count > 0) ? tagSelectorRect.bottom : contactsLabel.bottom top: (root.sortedList.count > 0) ? tagSelectorRect.bottom : contactsLabel.bottom
topMargin: 8//Style.current.padding topMargin: 8//Style.current.halfPadding
bottom: parent.bottom bottom: parent.bottom
bottomMargin: 20//Style.current.bigPadding bottomMargin: 16//Style.current.padding
} }
clip: true
visible: ((edit.text === "") || (root.sortedList.count > 0)) visible: ((edit.text === "") || (root.sortedList.count > 0))
x: ((root.namesModel.count > 0) && (root.sortedList.count > 0) && ((edit.x + 8) <= (root.width - suggestionsContainer.width))) x: ((root.namesModel.count > 0) && (root.sortedList.count > 0) && ((edit.x + 8) <= (root.width - suggestionsContainer.width)))
? (edit.x + 8) : 0 ? (edit.x + 8) : 0