From 75152a98a3b484f30d0f10cdc18dd69d7c74ec52 Mon Sep 17 00:00:00 2001 From: Black Hat Date: Sun, 21 Apr 2019 21:21:48 +0800 Subject: [PATCH] Tweak room drawer. --- imports/Spectral/Panel/RoomDrawer.qml | 188 ++++++++++++++++---------- qml/main.qml | 4 +- 2 files changed, 118 insertions(+), 74 deletions(-) diff --git a/imports/Spectral/Panel/RoomDrawer.qml b/imports/Spectral/Panel/RoomDrawer.qml index 05e942f..7b8c887 100644 --- a/imports/Spectral/Panel/RoomDrawer.qml +++ b/imports/Spectral/Panel/RoomDrawer.qml @@ -4,6 +4,7 @@ import QtQuick.Controls.Material 2.12 import QtQuick.Layouts 1.12 import Spectral.Component 2.0 +import Spectral.Setting 0.1 import Spectral 0.1 @@ -16,79 +17,133 @@ Drawer { ColumnLayout { anchors.fill: parent - anchors.margins: 16 + anchors.margins: 24 - Avatar { - Layout.preferredWidth: 96 - Layout.preferredHeight: 96 - Layout.alignment: Qt.AlignHCenter - - hint: room ? room.displayName : "No name" - source: room ? room.avatarMediaId : null - } - - Label { + RowLayout { Layout.fillWidth: true - wrapMode: Label.Wrap - horizontalAlignment: Text.AlignHCenter - text: room && room.id ? room.id : "" + spacing: 16 + + Avatar { + Layout.preferredWidth: 72 + Layout.preferredHeight: 72 + + hint: room ? room.displayName : "No name" + source: room ? room.avatarMediaId : null + } + + ColumnLayout { + Layout.fillWidth: true + + Label { + Layout.fillWidth: true + + font.pixelSize: 18 + font.bold: true + wrapMode: Label.Wrap + text: room ? room.displayName : "No Name" + } + + Label { + Layout.fillWidth: true + + wrapMode: Label.Wrap + text: room ? room.totalMemberCount + " Members" : "No Member Count" + color: MPalette.lighter + } + } } - Label { + MenuSeparator { Layout.fillWidth: true - - wrapMode: Label.Wrap - horizontalAlignment: Text.AlignHCenter - text: room && room.canonicalAlias ? room.canonicalAlias : "No Canonical Alias" - } - - Label { - Layout.fillWidth: true - - wrapMode: Label.Wrap - horizontalAlignment: Text.AlignHCenter - text: room ? room.totalMemberCount + " Members" : "No Member Count" } RowLayout { Layout.fillWidth: true - AutoTextField { + spacing: 8 + + MaterialIcon { + Layout.preferredWidth: 32 + Layout.preferredHeight: 32 + Layout.alignment: Qt.AlignTop + + icon: "\ue88e" + color: MPalette.lighter + } + + ColumnLayout { Layout.fillWidth: true - id: roomNameField - text: room && room.name ? room.name : "" + Label { + Layout.fillWidth: true + + wrapMode: Label.Wrap + text: room && room.canonicalAlias ? room.canonicalAlias : "No Canonical Alias" + color: MPalette.accent + } + + Label { + Layout.fillWidth: true + + wrapMode: Label.Wrap + text: "Main Alias" + color: MPalette.lighter + } + + Label { + Layout.fillWidth: true + + wrapMode: Label.Wrap + text: room && room.topic ? room.topic : "No Topic" + color: MPalette.accent + } + + Label { + Layout.fillWidth: true + + wrapMode: Label.Wrap + text: "Topic" + color: MPalette.lighter + } } + } - ItemDelegate { - Layout.preferredWidth: height - Layout.preferredHeight: parent.height - - contentItem: MaterialIcon { icon: "\ue5ca" } - - onClicked: room.setName(roomNameField.text) - } + MenuSeparator { + Layout.fillWidth: true } RowLayout { Layout.fillWidth: true - AutoTextField { - Layout.fillWidth: true + spacing: 8 - id: roomTopicField + MaterialIcon { + Layout.preferredWidth: 32 + Layout.preferredHeight: 32 - text: room && room.topic ? room.topic : "" + icon: "\ue7ff" + color: MPalette.lighter } - ItemDelegate { - Layout.preferredWidth: height - Layout.preferredHeight: parent.height + Label { + Layout.fillWidth: true - contentItem: MaterialIcon { icon: "\ue5ca" } + wrapMode: Label.Wrap + text: room ? room.totalMemberCount + " Members" : "No Member Count" + color: MPalette.lighter + } - onClicked: room.setTopic(roomTopicField.text) + ToolButton { + Layout.preferredWidth: 32 + Layout.preferredHeight: 32 + + contentItem: MaterialIcon { + icon: "\ue145" + color: MPalette.lighter + } + + onClicked: inviteUserDialog.open() } } @@ -153,36 +208,25 @@ Drawer { ScrollBar.vertical: ScrollBar {} } + } - Button { - Layout.fillWidth: true + Dialog { + anchors.centerIn: parent + width: 360 - text: "Invite User" - flat: true - highlighted: true + id: inviteUserDialog - onClicked: inviteUserDialog.open() + parent: ApplicationWindow.overlay - Dialog { - x: (window.width - width) / 2 - y: (window.height - height) / 2 - width: 360 + title: "Invite User" + modal: true + standardButtons: Dialog.Ok | Dialog.Cancel - id: inviteUserDialog - - parent: ApplicationWindow.overlay - - title: "Input User ID" - modal: true - standardButtons: Dialog.Ok | Dialog.Cancel - - contentItem: AutoTextField { - id: inviteUserDialogTextField - placeholderText: "@bot:matrix.org" - } - - onAccepted: room.inviteToRoom(inviteUserDialogTextField.text) - } + contentItem: AutoTextField { + id: inviteUserDialogTextField + placeholderText: "@bot:matrix.org" } + + onAccepted: room.inviteToRoom(inviteUserDialogTextField.text) } } diff --git a/qml/main.qml b/qml/main.qml index 663122f..5c40681 100644 --- a/qml/main.qml +++ b/qml/main.qml @@ -493,7 +493,7 @@ ApplicationWindow { position: inPortrait ? 0 : 1 visible: !inPortrait - id: drawer + id: roomListDrawer RoomListPanel { anchors.fill: parent @@ -510,7 +510,7 @@ ApplicationWindow { RoomPanel { anchors.fill: parent - anchors.leftMargin: !inPortrait ? drawer.width : undefined + anchors.leftMargin: !inPortrait ? roomListDrawer.width : undefined anchors.rightMargin: !inPortrait && roomDrawer.visible ? roomDrawer.width : undefined id: roomForm