Improve Kirigami
This commit is contained in:
@@ -1,56 +0,0 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12
|
||||
import QtGraphicalEffects 1.0
|
||||
|
||||
import Spectral.Setting 0.1
|
||||
|
||||
Item {
|
||||
property string hint: "H"
|
||||
property string source: ""
|
||||
property color color: MPalette.accent
|
||||
readonly property url realSource: source ? "image://mxc/" + source : ""
|
||||
|
||||
id: root
|
||||
|
||||
Image {
|
||||
anchors.fill: parent
|
||||
|
||||
id: image
|
||||
visible: realSource
|
||||
source: width < 1 ? "" : realSource
|
||||
sourceSize.width: width
|
||||
sourceSize.height: width
|
||||
fillMode: Image.PreserveAspectCrop
|
||||
mipmap: true
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
maskSource: Rectangle {
|
||||
width: image.width
|
||||
height: image.width
|
||||
|
||||
radius: width / 2
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
|
||||
visible: !realSource || image.status != Image.Ready
|
||||
|
||||
radius: height / 2
|
||||
color: root.color
|
||||
antialiasing: true
|
||||
|
||||
Label {
|
||||
anchors.centerIn: parent
|
||||
|
||||
color: "white"
|
||||
text: hint[0].toUpperCase()
|
||||
font.pixelSize: root.width / 2
|
||||
font.weight: Font.Medium
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -5,6 +5,7 @@ import QtQuick.Controls.Material 2.12
|
||||
import QtGraphicalEffects 1.0
|
||||
import Qt.labs.platform 1.0 as Platform
|
||||
import QtMultimedia 5.12
|
||||
import org.kde.kirigami 2.13 as Kirigami
|
||||
|
||||
import Spectral 0.1
|
||||
import Spectral.Setting 0.1
|
||||
@@ -25,14 +26,14 @@ RowLayout {
|
||||
|
||||
z: -5
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: 36
|
||||
Layout.preferredHeight: 36
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
|
||||
visible: avatarVisible
|
||||
hint: author.displayName
|
||||
source: author.avatarMediaId
|
||||
name: author.displayName
|
||||
source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
|
||||
color: author.color
|
||||
|
||||
Component {
|
||||
|
||||
@@ -4,6 +4,7 @@ import QtQuick.Layouts 1.12
|
||||
import QtQuick.Controls.Material 2.12
|
||||
import QtGraphicalEffects 1.0
|
||||
import Qt.labs.platform 1.0 as Platform
|
||||
import org.kde.kirigami 2.13 as Kirigami
|
||||
|
||||
import Spectral 0.1
|
||||
import Spectral.Setting 0.1
|
||||
@@ -29,14 +30,14 @@ RowLayout {
|
||||
|
||||
z: -5
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: 36
|
||||
Layout.preferredHeight: 36
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
|
||||
visible: avatarVisible
|
||||
hint: author.displayName
|
||||
source: author.avatarMediaId
|
||||
name: author.displayName
|
||||
source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
|
||||
color: author.color
|
||||
|
||||
Component {
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12 as Controls
|
||||
import QtQuick.Layouts 1.12
|
||||
import QtGraphicalEffects 1.12
|
||||
|
||||
import org.kde.kirigami 2.4 as Kirigami
|
||||
import org.kde.kirigami 2.13 as Kirigami
|
||||
|
||||
import Spectral 0.1
|
||||
import Spectral.Setting 0.1
|
||||
@@ -25,15 +26,15 @@ RowLayout {
|
||||
|
||||
spacing: Kirigami.Units.largeSpacing
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: Kirigami.Units.gridUnit * 1.5
|
||||
Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
|
||||
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
visible: showAuthor
|
||||
hint: author.displayName
|
||||
source: author.avatarMediaId
|
||||
name: author.displayName
|
||||
source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
|
||||
color: author.color
|
||||
}
|
||||
|
||||
@@ -43,71 +44,92 @@ RowLayout {
|
||||
|
||||
visible: !showAuthor
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.preferredWidth: column.width + 16
|
||||
Layout.preferredHeight: column.height + 16
|
||||
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
/*RectangularGlow {
|
||||
anchors.fill: messageBubble
|
||||
glowRadius: 0.8
|
||||
spread: 0.3
|
||||
cornerRadius: messageBubble.radius + glowRadius
|
||||
color: Qt.darker(messageBubble.color, 1.2)
|
||||
}*/
|
||||
|
||||
// inner area of the message bubble
|
||||
/*Rectangle {
|
||||
id: messageBubble
|
||||
anchors.fill: parent
|
||||
radius: 2
|
||||
color: authorColor
|
||||
}*/
|
||||
|
||||
id: column
|
||||
|
||||
spacing: Kirigami.Units.smallSpacing
|
||||
|
||||
Controls.Label {
|
||||
ColumnLayout {
|
||||
id: column
|
||||
Layout.fillWidth: true
|
||||
anchors.centerIn: parent
|
||||
spacing: Kirigami.Units.smallSpacing
|
||||
|
||||
visible: showAuthor
|
||||
|
||||
text: author.displayName
|
||||
font.bold: true
|
||||
color: Kirigami.Theme.activeTextColor
|
||||
wrapMode: Text.Wrap
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
|
||||
visible: replyVisible
|
||||
|
||||
Rectangle {
|
||||
Layout.preferredWidth: 4
|
||||
Layout.fillHeight: true
|
||||
|
||||
color: Kirigami.Theme.highlightColor
|
||||
}
|
||||
|
||||
Avatar {
|
||||
Layout.preferredWidth: Kirigami.Units.gridUnit * 1.5
|
||||
Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
source: replyVisible ? reply.author.avatarMediaId : ""
|
||||
hint: replyVisible ? reply.author.displayName : "H"
|
||||
color: replyVisible ? reply.author.color : MPalette.accent
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
Controls.Label {
|
||||
Layout.fillWidth: true
|
||||
|
||||
Controls.Label {
|
||||
Layout.fillWidth: true
|
||||
visible: showAuthor
|
||||
|
||||
text: replyVisible ? reply.author.displayName : ""
|
||||
color: Kirigami.Theme.activeTextColor
|
||||
wrapMode: Text.Wrap
|
||||
text: author.displayName
|
||||
font.bold: true
|
||||
color: Kirigami.Theme.activeTextColor
|
||||
wrapMode: Text.Wrap
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
|
||||
visible: replyVisible
|
||||
|
||||
Rectangle {
|
||||
Layout.preferredWidth: 4
|
||||
Layout.fillHeight: true
|
||||
|
||||
color: Kirigami.Theme.highlightColor
|
||||
}
|
||||
|
||||
Text {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: Kirigami.Units.gridUnit * 1.5
|
||||
Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
source: replyVisible && reply.author.avatarMediaId ? "image://mxc/" + reply.author.avatarMediaId : ""
|
||||
name: replyVisible ? reply.author.displayName : "H"
|
||||
color: replyVisible ? reply.author.color : MPalette.accent
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
|
||||
text: "<style>pre {white-space: pre-wrap} a{color: " + color + ";} .user-pill{}</style>" + (replyVisible ? reply.display : "")
|
||||
Controls.Label {
|
||||
Layout.fillWidth: true
|
||||
|
||||
color: Kirigami.Theme.textColor
|
||||
// selectionColor: Kirigami.Theme.highlightColor
|
||||
// selectedTextColor: Kirigami.Theme.highlightedTextColor
|
||||
text: replyVisible ? reply.author.displayName : ""
|
||||
color: Kirigami.Theme.activeTextColor
|
||||
wrapMode: Text.Wrap
|
||||
}
|
||||
|
||||
// selectByMouse: true
|
||||
// readOnly: true
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
textFormat: Text.RichText
|
||||
Text {
|
||||
Layout.fillWidth: true
|
||||
|
||||
text: replyVisible ? reply.display : ""
|
||||
|
||||
color: Kirigami.Theme.textColor
|
||||
// selectionColor: Kirigami.Theme.highlightColor
|
||||
// selectedTextColor: Kirigami.Theme.highlightedTextColor
|
||||
|
||||
// selectByMouse: true
|
||||
// readOnly: true
|
||||
wrapMode: Text.WrapAtWordBoundaryOrAnywhere
|
||||
textFormat: Text.RichText
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,6 +2,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.Dialog 2.0
|
||||
@@ -11,11 +12,11 @@ import Spectral.Setting 0.1
|
||||
RowLayout {
|
||||
id: row
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: 24
|
||||
Layout.preferredHeight: 24
|
||||
|
||||
hint: author.displayName
|
||||
name: author.displayName
|
||||
source: author.avatarMediaId
|
||||
color: author.color
|
||||
|
||||
|
||||
@@ -7,18 +7,12 @@ import org.kde.kirigami 2.4 as Kirigami
|
||||
Item {
|
||||
default property alias innerObject : column.children
|
||||
|
||||
readonly property int horizontalPadding: Kirigami.Units.largeSpacing
|
||||
readonly property int verticalPadding: Kirigami.Units.smallSpacing
|
||||
|
||||
height: column.implicitHeight + verticalPadding * 2
|
||||
height: column.implicitHeight
|
||||
|
||||
ColumnLayout {
|
||||
x: horizontalPadding
|
||||
y: verticalPadding
|
||||
|
||||
width: parent.width - horizontalPadding * 2
|
||||
|
||||
id: column
|
||||
x: horizontalPadding
|
||||
width: parent.width - Kirigami.Units.largeSpacing * 2
|
||||
|
||||
SectionDelegate {
|
||||
Layout.maximumWidth: parent.width
|
||||
@@ -27,10 +21,4 @@ Item {
|
||||
visible: showSection
|
||||
}
|
||||
}
|
||||
|
||||
Controls.ItemDelegate {
|
||||
anchors.fill: parent
|
||||
|
||||
z: -1
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@ import QtQuick.Controls.Material 2.12
|
||||
import QtGraphicalEffects 1.0
|
||||
import QtMultimedia 5.12
|
||||
import Qt.labs.platform 1.0 as Platform
|
||||
import org.kde.kirigami 2.13 as Kirigami
|
||||
|
||||
import Spectral 0.1
|
||||
import Spectral.Setting 0.1
|
||||
@@ -46,14 +47,14 @@ RowLayout {
|
||||
}
|
||||
}
|
||||
|
||||
Avatar {
|
||||
Kirigami.Avatar {
|
||||
Layout.preferredWidth: 36
|
||||
Layout.preferredHeight: 36
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
|
||||
visible: avatarVisible
|
||||
hint: author.displayName
|
||||
source: author.avatarMediaId
|
||||
name: author.displayName
|
||||
source: author.avatarMediaId ? "image://mxc/" + author.avatarMediaId : ""
|
||||
color: author.color
|
||||
|
||||
Component {
|
||||
|
||||
@@ -5,6 +5,5 @@ SideNavButton 2.0 SideNavButton.qml
|
||||
ScrollHelper 2.0 ScrollHelper.qml
|
||||
AutoListView 2.0 AutoListView.qml
|
||||
AutoTextField 2.0 AutoTextField.qml
|
||||
Avatar 2.0 Avatar.qml
|
||||
FullScreenImage 2.0 FullScreenImage.qml
|
||||
AutoRectangle 2.0 AutoRectangle.qml
|
||||
|
||||
Reference in New Issue
Block a user