ESCA111/neochat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix #2.

Browse Source 
Issue #2 is actually fixed!
A somewhat primitive UI for room management.
A new style for AutoTextField.
Limit max width of drawers.
This commit is contained in:
Black Hat
2019-04-22 19:49:22 +08:00
parent dda8738e8c
commit c727eb3bfd
6 changed files with 309 additions and 234 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
imports/Spectral/Component/AutoTextField.qml
View File

@@ -1,8 +1,62 @@
import QtQuick 2.12
import QtQuick.Controls 2.12
import Spectral.Setting 0.1
import QtQuick.Controls.Material 2.3
TextField {
id: textField
selectByMouse: true
topPadding: 8
bottomPadding: 8
background: Item {
Label {
id: floatingPlaceholder
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: textField.topPadding
anchors.leftMargin: textField.leftPadding
transformOrigin: Item.TopLeft
visible: false
color: Material.accent
states: [
State {
name: "shown"
when: textField.text.length !== 0
PropertyChanges { target: floatingPlaceholder; scale: 0.8 }
PropertyChanges { target: floatingPlaceholder; anchors.topMargin: -floatingPlaceholder.height * 0.4 }
}
]
transitions: [
Transition {
to: "shown"
SequentialAnimation {
PropertyAction { target: floatingPlaceholder; property: "text"; value: textField.placeholderText }
PropertyAction { target: floatingPlaceholder; property: "visible"; value: true }
PropertyAction { target: textField; property: "placeholderTextColor"; value: "transparent" }
ParallelAnimation {
NumberAnimation { target: floatingPlaceholder; property: "scale"; duration: 250; easing.type: Easing.InOutQuad }
NumberAnimation { target: floatingPlaceholder; property: "anchors.topMargin"; duration: 250; easing.type: Easing.InOutQuad }
}
}
},
Transition {
from: "shown"
SequentialAnimation {
ParallelAnimation {
NumberAnimation { target: floatingPlaceholder; property: "scale"; duration: 250; easing.type: Easing.InOutQuad }
NumberAnimation { target: floatingPlaceholder; property: "anchors.topMargin"; duration: 250; easing.type: Easing.InOutQuad }
}
PropertyAction { target: textField; property: "placeholderTextColor"; value: "grey" }
PropertyAction { target: floatingPlaceholder; property: "visible"; value: false }
}
}
]
}
}
}

200
imports/Spectral/Panel/RoomDrawer.qml
View File

@@ -59,54 +59,62 @@ Drawer {
Layout.fillWidth: true
}
RowLayout {
Control {
Layout.fillWidth: true
spacing: 8
padding: 0
MaterialIcon {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
Layout.alignment: Qt.AlignTop
contentItem: RowLayout {
spacing: 8
icon: "\ue88f"
color: MPalette.lighter
MaterialIcon {
Layout.preferredWidth: 32
Layout.preferredHeight: 32
Layout.alignment: Qt.AlignTop
icon: "\ue88f"
color: MPalette.lighter
}
ColumnLayout {
Layout.fillWidth: true
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.foreground
}
Label {
Layout.fillWidth: true
wrapMode: Label.Wrap
text: "Topic"
color: MPalette.lighter
}
}
}
ColumnLayout {
Layout.fillWidth: true
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.foreground
}
Label {
Layout.fillWidth: true
wrapMode: Label.Wrap
text: "Topic"
color: MPalette.lighter
}
background: RippleEffect {
onPrimaryClicked: roomDetailDialog.open()
}
}
@@ -209,9 +217,115 @@ Drawer {
contentItem: AutoTextField {
id: inviteUserDialogTextField
placeholderText: "@bot:matrix.org"
placeholderText: "User ID"
}
onAccepted: room.inviteToRoom(inviteUserDialogTextField.text)
}
Dialog {
anchors.centerIn: parent
width: 480
id: roomDetailDialog
parent: ApplicationWindow.overlay
title: "Room Settings - " + (room ? room.displayName : "")
modal: true
contentItem: ColumnLayout {
RowLayout {
Layout.fillWidth: true
spacing: 16
Avatar {
Layout.preferredWidth: 72
Layout.preferredHeight: 72
Layout.alignment: Qt.AlignTop
hint: room ? room.displayName : "No name"
source: room ? room.avatarMediaId : null
}
ColumnLayout {
Layout.fillWidth: true
Layout.margins: 4
AutoTextField {
Layout.fillWidth: true
text: room ? room.name : ""
placeholderText: "Room Name"
}
AutoTextField {
Layout.fillWidth: true
text: room ? room.topic : ""
placeholderText: "Room Topic"
}
}
}
MenuSeparator {
Layout.fillWidth: true
}
ColumnLayout {
Layout.fillWidth: true
RowLayout {
Layout.fillWidth: true
Label {
Layout.preferredWidth: 100
wrapMode: Label.Wrap
text: "Main Alias"
color: MPalette.lighter
}
ComboBox {
Layout.fillWidth: true
model: room ? room.aliases : null
currentIndex: room ? room.aliases.indexOf(room.canonicalAlias) : -1
}
}
RowLayout {
Layout.fillWidth: true
Label {
Layout.preferredWidth: 100
Layout.alignment: Qt.AlignTop
wrapMode: Label.Wrap
text: "Aliases"
color: MPalette.lighter
}
ColumnLayout {
Layout.fillWidth: true
Repeater {
model: room ? room.aliases : null
delegate: Label {
Layout.fillWidth: true
text: modelData
font.pixelSize: 12
color: MPalette.lighter
}
}
}
}
}
}
}
}

148
imports/Spectral/Panel/RoomListPanel.qml
View File

@@ -44,8 +44,8 @@ Item {
switch (category) {
case 1: return "Invited"
case 2: return "Favorites"
case 3: return "Rooms"
case 4: return "People"
case 3: return "People"
case 4: return "Rooms"
case 5: return "Low Priority"
}
}
@@ -80,135 +80,6 @@ Item {
]
}
// Drawer {
// width: Math.max(root.width, 400)
// height: root.height
// id: drawer
// edge: Qt.LeftEdge
// ColumnLayout {
// anchors.fill: parent
// id: mainColumn
// spacing: 0
// Control {
// Layout.fillWidth: true
// Layout.preferredHeight: 330
// padding: 24
// contentItem: ColumnLayout {
// spacing: 4
// Avatar {
// Layout.preferredWidth: 200
// Layout.preferredHeight: 200
// Layout.margins: 12
// Layout.alignment: Qt.AlignHCenter
// source: root.user ? root.user.avatarMediaId : null
// hint: root.user ? root.user.displayName : "?"
// }
// Label {
// Layout.alignment: Qt.AlignHCenter
// text: root.user ? root.user.displayName : "No Name"
// color: "white"
// font.pixelSize: 22
// }
// Label {
// Layout.alignment: Qt.AlignHCenter
// text: root.user ? root.user.id : "@example:matrix.org"
// color: "white"
// opacity: 0.7
// font.pixelSize: 13
// }
// }
// background: Rectangle { color: Material.primary }
// RippleEffect {
// anchors.fill: parent
// }
// }
// ScrollView {
// Layout.fillWidth: true
// Layout.fillHeight: true
// clip: true
// ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
// ColumnLayout {
// width: mainColumn.width
// spacing: 0
// Repeater {
// model: AccountListModel {
// controller: spectralController
// }
// delegate: ItemDelegate {
// Layout.fillWidth: true
// text: user.displayName
// onClicked: {
// controller.connection = connection
// drawer.close()
// }
// }
// }
// ItemDelegate {
// Layout.fillWidth: true
// text: "Add Account"
// onClicked: loginDialog.open()
// }
// Rectangle {
// Layout.fillWidth: true
// Layout.preferredHeight: 1
// color: MSettings.darkTheme ? "#424242" : "#e7ebeb"
// }
// ItemDelegate {
// Layout.fillWidth: true
// text: "Settings"
// }
// ItemDelegate {
// Layout.fillWidth: true
// text: "Logout"
// onClicked: controller.logout(controller.connection)
// }
// ItemDelegate {
// Layout.fillWidth: true
// text: "Exit"
// onClicked: Qt.quit()
// }
// }
// }
// }
// }
ColumnLayout {
anchors.fill: parent
spacing: 0
@@ -225,7 +96,7 @@ Item {
rightPadding: 18
contentItem: RowLayout {
ItemDelegate {
ToolButton {
Layout.preferredWidth: height
Layout.fillHeight: true
@@ -275,7 +146,7 @@ Item {
onClicked: filterMenu.popup()
}
ItemDelegate {
ToolButton {
Layout.preferredWidth: height
Layout.fillHeight: true
@@ -290,16 +161,12 @@ Item {
readonly property bool active: text
Layout.fillWidth: true
Layout.fillHeight: true
Layout.alignment: Qt.AlignVCenter
id: searchField
topPadding: 0
bottomPadding: 0
placeholderText: "Search..."
color: MPalette.lighter
background: Item {}
}
Avatar {
@@ -520,6 +387,7 @@ Item {
onTriggered: category === RoomType.Favorite ? currentRoom.removeTag("m.favourite") : currentRoom.addTag("m.favourite", 1.0)
}
MenuItem {
text: "Deprioritize"
checkable: true
@@ -527,14 +395,18 @@ Item {
onTriggered: category === RoomType.Deprioritized ? currentRoom.removeTag("m.lowpriority") : currentRoom.addTag("m.lowpriority", 1.0)
}
MenuSeparator {}
MenuItem {
text: "Mark as Read"
onTriggered: currentRoom.markAllMessagesAsRead()
}
MenuItem {
text: "Leave Room"
Material.foreground: Material.Red
onTriggered: currentRoom.forget()
}