First UI redesign.
This commit is contained in:
Black Hat
@@ -14,215 +14,183 @@ Item {
|
||||
property alias listModel: roomListProxyModel.sourceModel
|
||||
property var enteredRoom: null
|
||||
|
||||
Label {
|
||||
z: 10
|
||||
text: MSettings.miniMode ? "Empty" : "Here? No, not here."
|
||||
anchors.centerIn: parent
|
||||
visible: listView.count === 0
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
anchors.fill: parent
|
||||
spacing: 0
|
||||
|
||||
Rectangle {
|
||||
z: 10
|
||||
TextField {
|
||||
id: searchField
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 80
|
||||
color: Qt.tint(Material.accent, "#20FFFFFF")
|
||||
Layout.preferredHeight: 40
|
||||
Layout.margins: 12
|
||||
leftPadding: MSettings.miniMode ? 4 : 32
|
||||
topPadding: 0
|
||||
bottomPadding: 0
|
||||
placeholderText: "Search..."
|
||||
|
||||
TextField {
|
||||
id: searchField
|
||||
width: parent.width - 18
|
||||
height: 36
|
||||
color: "white"
|
||||
leftPadding: MSettings.miniMode ? 4 : 32
|
||||
topPadding: 0
|
||||
bottomPadding: 0
|
||||
anchors.centerIn: parent
|
||||
background: Rectangle {
|
||||
color: MSettings.darkTheme ? "#242424" : "#fafafa"
|
||||
}
|
||||
|
||||
background: Row {
|
||||
visible: !parent.text
|
||||
|
||||
MaterialIcon {
|
||||
icon: "\ue8b6"
|
||||
color: "white"
|
||||
|
||||
width: MSettings.miniMode ? parent.width : parent.height
|
||||
height: parent.height
|
||||
}
|
||||
|
||||
Label {
|
||||
height: parent.height
|
||||
visible: !MSettings.miniMode
|
||||
text: "Search"
|
||||
color: "white"
|
||||
font.pointSize: 12
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
|
||||
Shortcut {
|
||||
sequence: StandardKey.Find
|
||||
onActivated: searchField.forceActiveFocus()
|
||||
}
|
||||
Shortcut {
|
||||
sequence: StandardKey.Find
|
||||
onActivated: searchField.forceActiveFocus()
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
SortFilterProxyModel {
|
||||
id: roomListProxyModel
|
||||
filters: RegExpFilter {
|
||||
roleName: "name"
|
||||
pattern: searchField.text
|
||||
caseSensitivity: Qt.CaseInsensitive
|
||||
}
|
||||
proxyRoles: ExpressionRole {
|
||||
name: "display"
|
||||
expression: {
|
||||
switch (category) {
|
||||
case 1: return "Invited"
|
||||
case 2: return "Favorites"
|
||||
case 3: return "Rooms"
|
||||
case 4: return "People"
|
||||
case 5: return "Low Priorities"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sorters: [
|
||||
RoleSorter { roleName: "category" },
|
||||
RoleSorter {
|
||||
enabled: MSettings.rearrangeByActivity
|
||||
roleName: "unreadCount"
|
||||
sortOrder: Qt.DescendingOrder
|
||||
},
|
||||
StringSorter { roleName: "name" }
|
||||
]
|
||||
}
|
||||
|
||||
ListView {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
color: MSettings.darkTheme ? "#242424" : "#eaeaea"
|
||||
id: listView
|
||||
|
||||
Label {
|
||||
z: 10
|
||||
text: MSettings.miniMode ? "Empty" : "Here? No, not here."
|
||||
anchors.centerIn: parent
|
||||
visible: listView.count === 0
|
||||
}
|
||||
spacing: 1
|
||||
clip: true
|
||||
|
||||
SortFilterProxyModel {
|
||||
id: roomListProxyModel
|
||||
filters: RegExpFilter {
|
||||
roleName: "name"
|
||||
pattern: searchField.text
|
||||
caseSensitivity: Qt.CaseInsensitive
|
||||
}
|
||||
proxyRoles: ExpressionRole {
|
||||
name: "display"
|
||||
expression: {
|
||||
switch (category) {
|
||||
case 1: return "Invited"
|
||||
case 2: return "Favorites"
|
||||
case 3: return "Rooms"
|
||||
case 4: return "People"
|
||||
case 5: return "Low Priorities"
|
||||
}
|
||||
}
|
||||
model: roomListProxyModel
|
||||
|
||||
currentIndex: -1
|
||||
|
||||
boundsBehavior: Flickable.DragOverBounds
|
||||
|
||||
ScrollBar.vertical: ScrollBar {}
|
||||
|
||||
delegate: Rectangle {
|
||||
readonly property bool highlighted: currentRoom === enteredRoom
|
||||
|
||||
width: parent.width
|
||||
height: 64
|
||||
|
||||
color: "#fafafa"
|
||||
|
||||
AutoMouseArea {
|
||||
anchors.fill: parent
|
||||
|
||||
hoverEnabled: MSettings.miniMode
|
||||
|
||||
onSecondaryClicked: Qt.createComponent("qrc:/qml/menu/RoomContextMenu.qml").createObject(this)
|
||||
onPrimaryClicked: category === RoomType.Invited ? inviteDialog.open() : enteredRoom = currentRoom
|
||||
|
||||
ToolTip.visible: MSettings.miniMode && containsMouse
|
||||
ToolTip.text: name
|
||||
}
|
||||
|
||||
sorters: [
|
||||
RoleSorter { roleName: "category" },
|
||||
RoleSorter {
|
||||
enabled: MSettings.rearrangeByActivity
|
||||
roleName: "unreadCount"
|
||||
sortOrder: Qt.DescendingOrder
|
||||
},
|
||||
StringSorter { roleName: "name" }
|
||||
]
|
||||
}
|
||||
Rectangle {
|
||||
width: 4
|
||||
height: parent.height
|
||||
color: Material.accent
|
||||
visible: unreadCount > 0 || highlighted
|
||||
}
|
||||
|
||||
ListView {
|
||||
id: listView
|
||||
anchors.fill: parent
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
anchors.margins: 12
|
||||
spacing: 12
|
||||
|
||||
model: roomListProxyModel
|
||||
ImageStatus {
|
||||
Layout.preferredWidth: height
|
||||
Layout.fillHeight: true
|
||||
|
||||
currentIndex: -1
|
||||
|
||||
boundsBehavior: Flickable.DragOverBounds
|
||||
|
||||
ScrollBar.vertical: ScrollBar { id: scrollBar }
|
||||
|
||||
delegate: Rectangle {
|
||||
readonly property bool highlighted: currentRoom === enteredRoom
|
||||
|
||||
id: swipeDelegate
|
||||
width: parent.width
|
||||
height: 80
|
||||
|
||||
color: highlighted ? Material.background : "transparent"
|
||||
|
||||
AutoMouseArea {
|
||||
anchors.fill: parent
|
||||
|
||||
hoverEnabled: MSettings.miniMode
|
||||
|
||||
onSecondaryClicked: Qt.createComponent("qrc:/qml/menu/RoomContextMenu.qml").createObject(this)
|
||||
onPrimaryClicked: category === RoomType.Invited ? inviteDialog.open() : enteredRoom = currentRoom
|
||||
|
||||
ToolTip.visible: MSettings.miniMode && containsMouse
|
||||
ToolTip.text: name
|
||||
source: avatar ? "image://mxc/" + avatar : ""
|
||||
displayText: name
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
width: 4
|
||||
height: parent.height
|
||||
color: Qt.tint(Material.accent, "#20FFFFFF")
|
||||
visible: unreadCount > 0 || highlighted
|
||||
}
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
anchors.margins: 16
|
||||
spacing: 16
|
||||
visible: parent.width > 64
|
||||
|
||||
ImageStatus {
|
||||
Layout.preferredWidth: height
|
||||
Layout.fillHeight: true
|
||||
|
||||
source: avatar ? "image://mxc/" + avatar : ""
|
||||
displayText: name
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
Label {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
visible: parent.width > 80
|
||||
text: name || "No Name"
|
||||
font.pointSize: 12
|
||||
elide: Text.ElideRight
|
||||
wrapMode: Text.NoWrap
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Label {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
text: name || "No Name"
|
||||
font.pointSize: 16
|
||||
elide: Text.ElideRight
|
||||
wrapMode: Text.NoWrap
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
text: lastEvent || topic
|
||||
elide: Text.ElideRight
|
||||
wrapMode: Text.NoWrap
|
||||
}
|
||||
text: (lastEvent || topic).replace(/(\r\n\t|\n|\r\t)/gm,"");
|
||||
elide: Text.ElideRight
|
||||
wrapMode: Text.NoWrap
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.property: "display"
|
||||
section.criteria: ViewSection.FullString
|
||||
section.delegate: Label {
|
||||
width: parent.width
|
||||
height: 24
|
||||
text: section
|
||||
color: "grey"
|
||||
leftPadding: MSettings.miniMode ? undefined : 16
|
||||
elide: Text.ElideRight
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
horizontalAlignment: MSettings.miniMode ? Text.AlignHCenter : undefined
|
||||
background: Rectangle {
|
||||
anchors.fill: parent
|
||||
color: MSettings.darkTheme ? "#363636" : "#dbdbdb"
|
||||
}
|
||||
}
|
||||
section.property: "display"
|
||||
section.criteria: ViewSection.FullString
|
||||
section.delegate: Label {
|
||||
width: parent.width
|
||||
height: 24
|
||||
text: section
|
||||
color: "grey"
|
||||
leftPadding: MSettings.miniMode ? undefined : 16
|
||||
elide: Text.ElideRight
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
horizontalAlignment: MSettings.miniMode ? Text.AlignHCenter : undefined
|
||||
}
|
||||
|
||||
Dialog {
|
||||
id: inviteDialog
|
||||
parent: ApplicationWindow.overlay
|
||||
Dialog {
|
||||
id: inviteDialog
|
||||
parent: ApplicationWindow.overlay
|
||||
|
||||
x: (window.width - width) / 2
|
||||
y: (window.height - height) / 2
|
||||
width: 360
|
||||
x: (window.width - width) / 2
|
||||
y: (window.height - height) / 2
|
||||
width: 360
|
||||
|
||||
title: "Action Required"
|
||||
modal: true
|
||||
standardButtons: Dialog.Ok | Dialog.Cancel
|
||||
title: "Action Required"
|
||||
modal: true
|
||||
standardButtons: Dialog.Ok | Dialog.Cancel
|
||||
|
||||
contentItem: Label { text: "Accept this invitation?" }
|
||||
contentItem: Label { text: "Accept this invitation?" }
|
||||
|
||||
onAccepted: currentRoom.acceptInvitation()
|
||||
onRejected: currentRoom.forget()
|
||||
}
|
||||
onAccepted: currentRoom.acceptInvitation()
|
||||
onRejected: currentRoom.forget()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user