Improve Kirigami
This commit is contained in:
BIN
imports/Spectral/Panel/.RoomListPanel.qml.swo
Normal file
BIN
imports/Spectral/Panel/.RoomListPanel.qml.swo
Normal file
Binary file not shown.
@@ -2,7 +2,7 @@ import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12 as Controls
|
||||
import QtQuick.Layouts 1.12
|
||||
|
||||
import org.kde.kirigami 2.4 as Kirigami
|
||||
import org.kde.kirigami 2.13 as Kirigami
|
||||
|
||||
import SortFilterProxyModel 0.2
|
||||
|
||||
@@ -10,20 +10,25 @@ import Spectral.Component 2.0
|
||||
import Spectral 0.1
|
||||
|
||||
Kirigami.ScrollablePage {
|
||||
id: page
|
||||
property var roomListModel
|
||||
property var enteredRoom
|
||||
property var searchText
|
||||
|
||||
signal enterRoom(var room)
|
||||
signal leaveRoom(var room)
|
||||
|
||||
title: "Rooms"
|
||||
actions {
|
||||
main: Kirigami.Action {
|
||||
iconName: "document-edit"
|
||||
}
|
||||
contextualActions: []
|
||||
|
||||
titleDelegate: Kirigami.SearchField {
|
||||
Layout.topMargin: Kirigami.Units.smallSpacing
|
||||
Layout.bottomMargin: Kirigami.Units.smallSpacing
|
||||
Layout.fillHeight: true
|
||||
Layout.fillWidth: true
|
||||
onTextChanged: page.searchText = text
|
||||
}
|
||||
|
||||
|
||||
ListView {
|
||||
id: messageListView
|
||||
|
||||
@@ -66,6 +71,11 @@ Kirigami.ScrollablePage {
|
||||
filters: [
|
||||
ExpressionFilter {
|
||||
expression: joinState != "upgraded"
|
||||
},
|
||||
RegExpFilter {
|
||||
roleName: "name"
|
||||
pattern: searchText
|
||||
caseSensitivity: Qt.CaseInsensitive
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -89,12 +99,12 @@ Kirigami.ScrollablePage {
|
||||
contentItem: RowLayout {
|
||||
spacing: Kirigami.Units.largeSpacing
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: height
|
||||
Layout.fillHeight: true
|
||||
|
||||
source: avatar
|
||||
hint: name || "No Name"
|
||||
source: avatar ? "image://mxc/" + avatar : ""
|
||||
name: model.name || "No Name"
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
@@ -108,11 +118,17 @@ Kirigami.ScrollablePage {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
||||
text: name || "No Name"
|
||||
font.pixelSize: 16
|
||||
font.bold: unreadCount >= 0
|
||||
elide: Text.ElideRight
|
||||
wrapMode: Text.NoWrap
|
||||
}
|
||||
|
||||
Controls.Label {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
text: (lastEvent == "" ? topic : lastEvent).replace(/(\r\n\t|\n|\r\t)/gm," ")
|
||||
font.pixelSize: 13
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12 as Controls
|
||||
import QtQuick.Controls 2.12 as QQC2
|
||||
import QtQuick.Layouts 1.12
|
||||
import Qt.labs.qmlmodels 1.0
|
||||
import QtQuick.Controls.Material 2.12
|
||||
|
||||
import org.kde.kirigami 2.4 as Kirigami
|
||||
|
||||
@@ -9,6 +10,8 @@ import SortFilterProxyModel 0.2
|
||||
|
||||
import Spectral.Component 2.0
|
||||
import Spectral.Component.Timeline 2.0
|
||||
import Spectral.Dialog 2.0
|
||||
import Spectral.Effect 2.0
|
||||
import Spectral 0.1
|
||||
|
||||
Kirigami.ScrollablePage {
|
||||
@@ -18,18 +21,73 @@ Kirigami.ScrollablePage {
|
||||
|
||||
title: "Messages"
|
||||
|
||||
actions {
|
||||
main: Kirigami.Action {
|
||||
iconName: "document-edit"
|
||||
}
|
||||
contextualActions: []
|
||||
}
|
||||
|
||||
MessageEventModel {
|
||||
id: messageEventModel
|
||||
|
||||
room: currentRoom
|
||||
}
|
||||
|
||||
ImageClipboard {
|
||||
id: imageClipboard
|
||||
}
|
||||
|
||||
QQC2.Popup {
|
||||
anchors.centerIn: parent
|
||||
|
||||
id: attachDialog
|
||||
|
||||
padding: 16
|
||||
|
||||
contentItem: RowLayout {
|
||||
QQC2.ToolButton {
|
||||
Layout.preferredWidth: 160
|
||||
Layout.fillHeight: true
|
||||
|
||||
icon.name: 'mail-attachment'
|
||||
|
||||
text: "Choose local file"
|
||||
|
||||
onClicked: {
|
||||
attachDialog.close()
|
||||
|
||||
var fileDialog = openFileDialog.createObject(ApplicationWindow.overlay)
|
||||
|
||||
fileDialog.chosen.connect(function(path) {
|
||||
if (!path) return
|
||||
|
||||
roomPanelInput.attach(path)
|
||||
})
|
||||
|
||||
fileDialog.open()
|
||||
}
|
||||
}
|
||||
|
||||
Kirigami.Separator {}
|
||||
|
||||
QQC2.ToolButton {
|
||||
Layout.preferredWidth: 160
|
||||
Layout.fillHeight: true
|
||||
|
||||
padding: 16
|
||||
|
||||
icon.name: 'insert-image'
|
||||
text: "Clipboard image"
|
||||
onClicked: {
|
||||
var localPath = StandardPaths.writableLocation(StandardPaths.CacheLocation) + "/screenshots/" + (new Date()).getTime() + ".png"
|
||||
if (!imageClipboard.saveImage(localPath)) return
|
||||
roomPanelInput.attach(localPath)
|
||||
attachDialog.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Component {
|
||||
id: openFileDialog
|
||||
|
||||
OpenFileDialog {}
|
||||
}
|
||||
|
||||
|
||||
SortFilterProxyModel {
|
||||
id: sortedMessageEventModel
|
||||
@@ -232,16 +290,9 @@ Kirigami.ScrollablePage {
|
||||
}
|
||||
}
|
||||
|
||||
footer: RowLayout {
|
||||
Controls.ToolButton {
|
||||
contentItem: Kirigami.Icon {
|
||||
source: "mail-attachment"
|
||||
}
|
||||
}
|
||||
|
||||
Controls.TextField {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
footer: RoomPanelInput {
|
||||
id: roomPanelInput
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
background: Item {}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12
|
||||
import QtQuick.Layouts 1.12
|
||||
import QtQuick.Controls.Material 2.12
|
||||
import org.kde.kirigami 2.13 as Kirigami
|
||||
|
||||
import Spectral.Component 2.0
|
||||
import Spectral.Component.Emoji 2.0
|
||||
@@ -30,14 +30,20 @@ Control {
|
||||
id: root
|
||||
|
||||
padding: 0
|
||||
|
||||
|
||||
background: Rectangle {
|
||||
color: MSettings.darkTheme ? "#303030" : "#fafafa"
|
||||
radius: 24
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: ElevationEffect {
|
||||
elevation: 1
|
||||
color: Kirigami.Theme.backgroundColor
|
||||
Kirigami.Separator {
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: Kirigami.Theme.focusColor
|
||||
visible: chatTextInput.activeFocus
|
||||
}
|
||||
anchors {
|
||||
left: parent.left
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -59,18 +65,13 @@ Control {
|
||||
|
||||
padding: 4
|
||||
|
||||
background: Rectangle {
|
||||
radius: height / 2
|
||||
color: replyUser ? Qt.darker(replyUser.color, 1.1) : MPalette.accent
|
||||
}
|
||||
|
||||
contentItem: RowLayout {
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: 24
|
||||
Layout.preferredHeight: 24
|
||||
|
||||
source: replyUser ? replyUser.avatarMediaId : ""
|
||||
hint: replyUser ? replyUser.displayName : "No name"
|
||||
source: replyUser ? "image://mxc/" + replyUser.avatarMediaId: ""
|
||||
name: replyUser ? replyUser.displayName : "No name"
|
||||
}
|
||||
|
||||
Label {
|
||||
@@ -87,7 +88,6 @@ Control {
|
||||
TextEdit {
|
||||
Layout.fillWidth: true
|
||||
|
||||
color: MPalette.foreground
|
||||
text: "<style>a{color: " + color + ";} .user-pill{}</style>" + replyContent
|
||||
|
||||
font.family: window.font.family
|
||||
@@ -96,7 +96,6 @@ Control {
|
||||
readOnly: true
|
||||
wrapMode: Label.Wrap
|
||||
selectedTextColor: "white"
|
||||
selectionColor: MPalette.accent
|
||||
textFormat: Text.RichText
|
||||
}
|
||||
}
|
||||
@@ -159,21 +158,19 @@ Control {
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
}
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: 24
|
||||
Layout.preferredHeight: 24
|
||||
|
||||
visible: !isEmoji
|
||||
source: modelData.avatarMediaId ?? null
|
||||
color: modelData.color ? Qt.darker(modelData.color, 1.1) : MPalette.accent
|
||||
source: modelData.avatarMediaId ? "image://mxc/" + modelData.avatarMediaId : ""
|
||||
color: modelData.color ? Qt.darker(modelData.color, 1.1) : null
|
||||
}
|
||||
|
||||
Label {
|
||||
Layout.fillHeight: true
|
||||
|
||||
visible: !isEmoji
|
||||
text: autoCompleteText
|
||||
color: highlighted ? "white" : MPalette.foreground
|
||||
color: highlighted ? Kirigami.Theme.highlightTextColor : Kirigami.Theme.textColor
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
rightPadding: 8
|
||||
}
|
||||
@@ -196,8 +193,6 @@ Control {
|
||||
Layout.rightMargin: 12
|
||||
|
||||
visible: emojiPicker.visible || replyItem.visible || autoCompleteListView.visible
|
||||
|
||||
color: MSettings.darkTheme ? "#424242" : "#e7ebeb"
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
@@ -213,9 +208,7 @@ Control {
|
||||
id: uploadButton
|
||||
visible: !isReply && !hasAttachment
|
||||
|
||||
contentItem: MaterialIcon {
|
||||
icon: "\ue226"
|
||||
}
|
||||
icon.name: "mail-attachment"
|
||||
|
||||
onClicked: {
|
||||
if (imageClipboard.hasImage) {
|
||||
@@ -264,13 +257,7 @@ Control {
|
||||
visible: hasAttachment
|
||||
|
||||
rightPadding: 8
|
||||
|
||||
background: Rectangle {
|
||||
color: MPalette.accent
|
||||
radius: height / 2
|
||||
antialiasing: true
|
||||
}
|
||||
|
||||
|
||||
contentItem: RowLayout {
|
||||
spacing: 0
|
||||
|
||||
@@ -280,15 +267,11 @@ Control {
|
||||
|
||||
id: cancelAttachmentButton
|
||||
|
||||
contentItem: MaterialIcon {
|
||||
icon: "\ue5cd"
|
||||
color: "white"
|
||||
font.pixelSize: 18
|
||||
}
|
||||
icon.name: "mail-attachement"
|
||||
|
||||
onClicked: {
|
||||
hasAttachment = false
|
||||
attachmentPath = ""
|
||||
hasAttachment = false;
|
||||
attachmentPath = "";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -448,19 +431,13 @@ Control {
|
||||
}
|
||||
}
|
||||
|
||||
MaterialIcon {
|
||||
ToolButton {
|
||||
flat: true
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
|
||||
icon: "\ue165"
|
||||
icon.name: "format-text-code"
|
||||
font.pixelSize: 16
|
||||
color: MPalette.foreground
|
||||
opacity: MSettings.markdownFormatting ? 1 : 0.3
|
||||
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
|
||||
onClicked: MSettings.markdownFormatting = !MSettings.markdownFormatting
|
||||
}
|
||||
onClicked: MSettings.markdownFormatting = !MSettings.markdownFormatting
|
||||
}
|
||||
|
||||
ToolButton {
|
||||
@@ -469,10 +446,7 @@ Control {
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
|
||||
id: emojiButton
|
||||
|
||||
contentItem: MaterialIcon {
|
||||
icon: "\ue24e"
|
||||
}
|
||||
icon.name: "document-send"
|
||||
|
||||
onClicked: emojiPicker.visible = !emojiPicker.visible
|
||||
}
|
||||
|
||||
20
imports/Spectral/Panel/SpectralSidebar.qml
Normal file
20
imports/Spectral/Panel/SpectralSidebar.qml
Normal file
@@ -0,0 +1,20 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12 as Controls
|
||||
import QtQuick.Layouts 1.12
|
||||
import Qt.labs.qmlmodels 1.0
|
||||
|
||||
import org.kde.kirigami 2.12 as Kirigami
|
||||
|
||||
import SortFilterProxyModel 0.2
|
||||
|
||||
import Spectral.Component 2.0
|
||||
import Spectral.Component.Timeline 2.0
|
||||
import Spectral 0.1
|
||||
|
||||
Kirigami.GlobalDrawer {
|
||||
id: root
|
||||
|
||||
modal: true
|
||||
collapsible: true
|
||||
collapsed: Kirigami.Settings.isMobile
|
||||
}
|
||||
@@ -2,3 +2,4 @@ module Spectral.Panel
|
||||
RoomPanel 2.0 RoomPanel.qml
|
||||
RoomListPanel 2.0 RoomListPanel.qml
|
||||
RoomDrawer 2.0 RoomDrawer.qml
|
||||
SpectralSidebar 2.0 SpectralSidebar.qml
|
||||
|
||||
Reference in New Issue
Block a user