Make the whole right sidebar scrollable
The sidebar grew a lot and now contains some tools. This makes the space left for the room members very small. Particuliary on mobile. So make the whole sidebar contained inside the ScrollView This also refactor a few things (e.g. use a plain ToolBar for the header)
This commit is contained in:
Carl Schwan
committed by
Tobias Fella
Tobias Fella
parent
213aaf3ac4
commit
b1c42c3d3d
@@ -48,7 +48,7 @@ ColumnLayout {
|
||||
room: room,
|
||||
user: room.getUser(room.directChatRemoteUser.id),
|
||||
})
|
||||
popup.closed.connect(function() {
|
||||
popup.closed.connect(() => {
|
||||
userListItem.highlighted = false
|
||||
})
|
||||
if (roomDrawer.modal) {
|
||||
@@ -61,7 +61,6 @@ ColumnLayout {
|
||||
|
||||
Kirigami.Heading {
|
||||
Layout.fillWidth: true
|
||||
level: 1
|
||||
type: Kirigami.Heading.Type.Primary
|
||||
wrapMode: QQC2.Label.Wrap
|
||||
text: room.displayName
|
||||
|
||||
@@ -11,7 +11,9 @@ import org.kde.neochat 1.0
|
||||
|
||||
ColumnLayout {
|
||||
id: root
|
||||
|
||||
Layout.fillWidth: true
|
||||
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: Kirigami.Units.largeSpacing
|
||||
@@ -30,8 +32,11 @@ ColumnLayout {
|
||||
|
||||
width: Kirigami.Units.gridUnit
|
||||
height: Kirigami.Units.gridUnit
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.right: parent.right
|
||||
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
right: parent.right
|
||||
}
|
||||
|
||||
radius: Math.round(width / 2)
|
||||
|
||||
@@ -49,12 +54,12 @@ ColumnLayout {
|
||||
|
||||
Kirigami.Heading {
|
||||
Layout.fillWidth: true
|
||||
level: 1
|
||||
type: Kirigami.Heading.Type.Primary
|
||||
wrapMode: QQC2.Label.Wrap
|
||||
text: room ? room.displayName : i18n("No name")
|
||||
textFormat: Text.PlainText
|
||||
}
|
||||
|
||||
Kirigami.SelectableLabel {
|
||||
Layout.fillWidth: true
|
||||
textFormat: TextEdit.PlainText
|
||||
@@ -63,36 +68,15 @@ ColumnLayout {
|
||||
}
|
||||
}
|
||||
|
||||
QQC2.ScrollView {
|
||||
Kirigami.SelectableLabel {
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: Kirigami.Units.largeSpacing
|
||||
Layout.rightMargin: Kirigami.Units.largeSpacing
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.maximumHeight: Math.min(topicText.contentHeight, Kirigami.Units.gridUnit * 15)
|
||||
|
||||
// HACK: Hide unnecessary horizontal scrollbar (https://bugreports.qt.io/browse/QTBUG-83890)
|
||||
QQC2.ScrollBar.horizontal.policy: QQC2.ScrollBar.AlwaysOff
|
||||
|
||||
QQC2.TextArea {
|
||||
id: topicText
|
||||
padding: 0
|
||||
text: room && room.topic ? room.topic.replace(replaceLinks, "<a href=\"$1\">$1</a>") : i18n("No Topic")
|
||||
readonly property var replaceLinks: /(http[s]?:\/\/[^ \r\n]*)/g
|
||||
textFormat: TextEdit.MarkdownText
|
||||
wrapMode: Text.Wrap
|
||||
selectByMouse: true
|
||||
color: Kirigami.Theme.textColor
|
||||
selectedTextColor: Kirigami.Theme.highlightedTextColor
|
||||
selectionColor: Kirigami.Theme.highlightColor
|
||||
onLinkActivated: UrlHelper.openUrl(link)
|
||||
readOnly: true
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
acceptedButtons: Qt.NoButton
|
||||
cursorShape: parent.hoveredLink ? Qt.PointingHandCursor : Qt.IBeamCursor
|
||||
}
|
||||
background: Item {}
|
||||
}
|
||||
text: room && room.topic ? room.topic.replace(replaceLinks, "<a href=\"$1\">$1</a>") : i18n("No Topic")
|
||||
readonly property var replaceLinks: /(http[s]?:\/\/[^ \r\n]*)/g
|
||||
textFormat: TextEdit.MarkdownText
|
||||
wrapMode: Text.Wrap
|
||||
onLinkActivated: UrlHelper.openUrl(link)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -71,26 +71,24 @@ Kirigami.OverlayDrawer {
|
||||
contentItem: Loader {
|
||||
id: loader
|
||||
active: roomDrawer.drawerOpen
|
||||
|
||||
sourceComponent: ColumnLayout {
|
||||
id: columnLayout
|
||||
property alias userSearchText: userListSearchField.text
|
||||
readonly property string userSearchText: userListView.headerItem.userListSearchField.text
|
||||
property alias highlightedUser: userListView.currentIndex
|
||||
spacing: Kirigami.Units.largeSpacing
|
||||
|
||||
Kirigami.AbstractApplicationHeader {
|
||||
spacing: 0
|
||||
|
||||
QQC2.ToolBar {
|
||||
Layout.fillWidth: true
|
||||
topPadding: Kirigami.Units.smallSpacing / 2;
|
||||
bottomPadding: Kirigami.Units.smallSpacing / 2;
|
||||
rightPadding: Kirigami.Units.largeSpacing
|
||||
leftPadding: Kirigami.Units.largeSpacing
|
||||
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
Layout.preferredHeight: pageStack.globalToolBar.preferredHeight
|
||||
|
||||
contentItem: RowLayout {
|
||||
Kirigami.Heading {
|
||||
Layout.fillWidth: true
|
||||
text: i18n("Room information")
|
||||
level: 1
|
||||
}
|
||||
|
||||
QQC2.ToolButton {
|
||||
id: settingsButton
|
||||
|
||||
@@ -99,124 +97,14 @@ Kirigami.OverlayDrawer {
|
||||
display: QQC2.AbstractButton.IconOnly
|
||||
|
||||
onClicked: QQC2.ApplicationWindow.window.pageStack.pushDialogLayer('qrc:/Categories.qml', {room: room}, { title: i18n("Room Settings") })
|
||||
QQC2.ToolTip {
|
||||
text: settingsButton.text
|
||||
}
|
||||
|
||||
QQC2.ToolTip.text: text
|
||||
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
|
||||
QQC2.ToolTip.visible: hovered
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loader {
|
||||
active: true
|
||||
Layout.fillWidth: true
|
||||
sourceComponent: room.isDirectChat() ? directChatDrawerHeader : groupChatDrawerHeader
|
||||
}
|
||||
|
||||
Kirigami.ListSectionHeader {
|
||||
label: i18n("Options")
|
||||
activeFocusOnTab: false
|
||||
}
|
||||
|
||||
Kirigami.BasicListItem {
|
||||
id: devtoolsButton
|
||||
|
||||
icon: "tools"
|
||||
text: i18n("Open developer tools")
|
||||
visible: Config.developerTools
|
||||
|
||||
onClicked: {
|
||||
applicationWindow().pageStack.layers.push("qrc:/DevtoolsPage.qml", {room: room}, {title: i18n("Developer Tools")})
|
||||
roomDrawer.close();
|
||||
}
|
||||
}
|
||||
Kirigami.BasicListItem {
|
||||
id: searchButton
|
||||
|
||||
icon: "search"
|
||||
text: i18n("Search in this room")
|
||||
|
||||
onClicked: {
|
||||
pageStack.pushDialogLayer("qrc:/SearchPage.qml", {
|
||||
currentRoom: room
|
||||
}, {
|
||||
title: i18nc("@action:title", "Search")
|
||||
})
|
||||
}
|
||||
}
|
||||
Kirigami.BasicListItem {
|
||||
id: locationsButton
|
||||
|
||||
icon: "map-flat"
|
||||
text: i18n("Show locations for this room")
|
||||
|
||||
onClicked: pageStack.pushDialogLayer("qrc:/LocationsPage.qml", {
|
||||
room: room
|
||||
}, {
|
||||
title: i18nc("Locations on a map", "Locations")
|
||||
})
|
||||
}
|
||||
Kirigami.BasicListItem {
|
||||
id: favouriteButton
|
||||
|
||||
icon: room && room.isFavourite ? "rating" : "rating-unrated"
|
||||
text: room && room.isFavourite ? i18n("Remove room from favorites") : i18n("Make room favorite")
|
||||
|
||||
onClicked: room.isFavourite ? room.removeTag("m.favourite") : room.addTag("m.favourite", 1.0)
|
||||
}
|
||||
|
||||
Kirigami.ListSectionHeader {
|
||||
label: i18n("Members")
|
||||
activeFocusOnTab: false
|
||||
spacing: 0
|
||||
visible: !room.isDirectChat()
|
||||
|
||||
QQC2.ToolButton {
|
||||
id: memberSearchToggle
|
||||
checkable: true
|
||||
icon.name: "search"
|
||||
QQC2.ToolTip.text: i18n("Search user in room")
|
||||
QQC2.ToolTip.visible: hovered
|
||||
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
|
||||
onToggled: {
|
||||
userListSearchField.text = "";
|
||||
}
|
||||
}
|
||||
|
||||
QQC2.ToolButton {
|
||||
visible: roomDrawer.room.canSendState("invite")
|
||||
icon.name: "list-add-user"
|
||||
|
||||
onClicked: {
|
||||
applicationWindow().pageStack.layers.push("qrc:/InviteUserPage.qml", {room: roomDrawer.room})
|
||||
roomDrawer.close();
|
||||
}
|
||||
|
||||
QQC2.ToolTip.text: i18n("Invite user to room")
|
||||
QQC2.ToolTip.visible: hovered
|
||||
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
|
||||
}
|
||||
|
||||
QQC2.Label {
|
||||
Layout.alignment: Qt.AlignRight
|
||||
text: room ? i18np("%1 member", "%1 members", room.joinedCount) : i18n("No member count")
|
||||
}
|
||||
}
|
||||
|
||||
Kirigami.SearchField {
|
||||
id: userListSearchField
|
||||
visible: memberSearchToggle.checked
|
||||
|
||||
onVisibleChanged: if (visible) forceActiveFocus()
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: Kirigami.Units.largeSpacing - 1
|
||||
Layout.rightMargin: Kirigami.Units.largeSpacing - 1
|
||||
Layout.bottomMargin: Kirigami.Units.smallSpacing
|
||||
|
||||
focusSequence: "Ctrl+Shift+F"
|
||||
|
||||
onAccepted: sortedMessageEventModel.filterString = text;
|
||||
}
|
||||
|
||||
QQC2.ScrollView {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
@@ -226,11 +114,130 @@ Kirigami.OverlayDrawer {
|
||||
|
||||
ListView {
|
||||
id: userListView
|
||||
clip: true
|
||||
activeFocusOnTab: true
|
||||
visible: !room.isDirectChat()
|
||||
|
||||
model: KSortFilterProxyModel {
|
||||
header: ColumnLayout {
|
||||
id: columnLayout
|
||||
|
||||
property alias userListSearchField: userListSearchField
|
||||
|
||||
spacing: Kirigami.Units.largeSpacing
|
||||
width: userListView.width
|
||||
|
||||
Loader {
|
||||
active: true
|
||||
Layout.fillWidth: true
|
||||
Layout.topMargin: Kirigami.Units.smallSpacing
|
||||
sourceComponent: room.isDirectChat() ? directChatDrawerHeader : groupChatDrawerHeader
|
||||
}
|
||||
|
||||
Kirigami.ListSectionHeader {
|
||||
label: i18n("Options")
|
||||
activeFocusOnTab: false
|
||||
}
|
||||
|
||||
Kirigami.BasicListItem {
|
||||
id: devtoolsButton
|
||||
|
||||
icon: "tools"
|
||||
text: i18n("Open developer tools")
|
||||
visible: Config.developerTools
|
||||
|
||||
onClicked: {
|
||||
applicationWindow().pageStack.layers.push("qrc:/DevtoolsPage.qml", {room: room}, {title: i18n("Developer Tools")})
|
||||
roomDrawer.close();
|
||||
}
|
||||
}
|
||||
Kirigami.BasicListItem {
|
||||
id: searchButton
|
||||
|
||||
icon: "search"
|
||||
text: i18n("Search in this room")
|
||||
|
||||
onClicked: {
|
||||
pageStack.pushDialogLayer("qrc:/SearchPage.qml", {
|
||||
currentRoom: room
|
||||
}, {
|
||||
title: i18nc("@action:title", "Search")
|
||||
})
|
||||
}
|
||||
}
|
||||
Kirigami.BasicListItem {
|
||||
id: favouriteButton
|
||||
|
||||
icon: room && room.isFavourite ? "rating" : "rating-unrated"
|
||||
text: room && room.isFavourite ? i18n("Remove room from favorites") : i18n("Make room favorite")
|
||||
|
||||
onClicked: room.isFavourite ? room.removeTag("m.favourite") : room.addTag("m.favourite", 1.0)
|
||||
}
|
||||
|
||||
Kirigami.BasicListItem {
|
||||
id: locationsButton
|
||||
|
||||
icon: "map-flat"
|
||||
text: i18n("Show locations for this room")
|
||||
|
||||
onClicked: pageStack.pushDialogLayer("qrc:/LocationsPage.qml", {
|
||||
room: room
|
||||
}, {
|
||||
title: i18nc("Locations on a map", "Locations")
|
||||
})
|
||||
}
|
||||
|
||||
Kirigami.ListSectionHeader {
|
||||
label: i18n("Members")
|
||||
activeFocusOnTab: false
|
||||
spacing: 0
|
||||
visible: !room.isDirectChat()
|
||||
|
||||
QQC2.ToolButton {
|
||||
id: memberSearchToggle
|
||||
checkable: true
|
||||
icon.name: "search"
|
||||
QQC2.ToolTip.text: i18n("Search user in room")
|
||||
QQC2.ToolTip.visible: hovered
|
||||
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
|
||||
onToggled: {
|
||||
userListSearchField.text = "";
|
||||
}
|
||||
}
|
||||
|
||||
QQC2.ToolButton {
|
||||
visible: roomDrawer.room.canSendState("invite")
|
||||
icon.name: "list-add-user"
|
||||
|
||||
onClicked: {
|
||||
applicationWindow().pageStack.layers.push("qrc:/InviteUserPage.qml", {room: roomDrawer.room})
|
||||
roomDrawer.close();
|
||||
}
|
||||
|
||||
QQC2.ToolTip.text: i18n("Invite user to room")
|
||||
QQC2.ToolTip.visible: hovered
|
||||
QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
|
||||
}
|
||||
|
||||
QQC2.Label {
|
||||
Layout.alignment: Qt.AlignRight
|
||||
text: room ? i18np("%1 member", "%1 members", room.joinedCount) : i18n("No member count")
|
||||
}
|
||||
}
|
||||
|
||||
Kirigami.SearchField {
|
||||
id: userListSearchField
|
||||
visible: memberSearchToggle.checked
|
||||
|
||||
onVisibleChanged: if (visible) forceActiveFocus()
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: Kirigami.Units.largeSpacing - 1
|
||||
Layout.rightMargin: Kirigami.Units.largeSpacing - 1
|
||||
Layout.bottomMargin: Kirigami.Units.smallSpacing
|
||||
|
||||
focusSequence: "Ctrl+Shift+F"
|
||||
|
||||
onAccepted: sortedMessageEventModel.filterString = text;
|
||||
}
|
||||
}
|
||||
|
||||
KSortFilterProxyModel {
|
||||
id: sortedMessageEventModel
|
||||
|
||||
sourceModel: UserListModel {
|
||||
@@ -243,6 +250,11 @@ Kirigami.OverlayDrawer {
|
||||
filterCaseSensitivity: Qt.CaseInsensitive
|
||||
}
|
||||
|
||||
model: room.isDirectChat() ? 0 : sortedMessageEventModel
|
||||
|
||||
clip: true
|
||||
activeFocusOnTab: true
|
||||
|
||||
delegate: Kirigami.BasicListItem {
|
||||
id: userListItem
|
||||
|
||||
|
||||
Reference in New Issue
Block a user