From 6f3ed5b2823b7d8f5c522448300ba09db56c1512 Mon Sep 17 00:00:00 2001
From: Malte E <malte.e@mailbox.org>
Date: Mon, 14 Feb 2022 21:07:03 +0100
Subject: [PATCH] space-saving metadata placement
---
resources/qml/TimelineRow.qml | 6 +++---
resources/qml/delegates/FileMessage.qml | 9 ++++++---
resources/qml/delegates/ImageMessage.qml | 5 ++++-
resources/qml/delegates/MessageDelegate.qml | 10 +++++++++-
resources/qml/delegates/PlayableMediaMessage.qml | 5 ++++-
resources/qml/delegates/Redacted.qml | 4 +++-
resources/qml/delegates/TextMessage.qml | 2 ++
7 files changed, 31 insertions(+), 10 deletions(-)
diff --git a/resources/qml/TimelineRow.qml b/resources/qml/TimelineRow.qml
index b74fb5c1a..24aa39e75 100644
--- a/resources/qml/TimelineRow.qml
+++ b/resources/qml/TimelineRow.qml
@@ -80,7 +80,7 @@ Item {
anchors.left: bubbleOnRight? undefined : parent.left
anchors.right: bubbleOnRight? parent.right : undefined
property int maxWidth: parent.width-anchors.leftMargin-anchors.rightMargin
- width: Settings.bubbles? Math.min(maxWidth,implicitWidth+4) : maxWidth
+ width: Settings.bubbles? Math.min(maxWidth,implicitWidth+metadata.width+12) : maxWidth
leftPadding: 4
rightPadding: (Settings.bubbles && !isStateEvent)? 4: 2
topPadding: (Settings.bubbles && !isStateEvent)? 4: 2
@@ -107,7 +107,6 @@ Item {
Layout.fillWidth: true
Layout.bottomMargin: visible? 2 : 0
Layout.preferredHeight: height
- Layout.maximumWidth: implicitWidth
id: reply
function fromModel(role) {
@@ -144,7 +143,6 @@ Item {
Layout.column: 0
Layout.fillWidth: true
Layout.preferredHeight: height
- Layout.maximumWidth: implicitWidth
id: contentItem
blurhash: r.blurhash
@@ -169,6 +167,7 @@ Item {
encryptionError: r.encryptionError
relatedEventCacheBuster: r.relatedEventCacheBuster
isReply: false
+ metadataWidth: metadata.width
}
RowLayout {
@@ -177,6 +176,7 @@ Item {
Layout.row: Settings.bubbles? 2 : 0
Layout.rowSpan: Settings.bubbles? 1 : 2
Layout.bottomMargin: -2
+ Layout.topMargin: contentItem.fitsMetadata? -height-Layout.bottomMargin : 0
Layout.alignment: Qt.AlignTop | Qt.AlignRight
Layout.preferredWidth: implicitWidth
visible: !isStateEvent
diff --git a/resources/qml/delegates/FileMessage.qml b/resources/qml/delegates/FileMessage.qml
index fd81b176e..daae8635d 100644
--- a/resources/qml/delegates/FileMessage.qml
+++ b/resources/qml/delegates/FileMessage.qml
@@ -12,15 +12,17 @@ Item {
required property string filename
required property string filesize
- height: row.height + 24
+ height: row.height + (Settings.bubbles? 16: 24)
width: parent.width
- implicitWidth: row.implicitWidth
+ implicitWidth: row.implicitWidth+metadataWidth
+ property int metadataWidth
+ property bool fitsMetadata: true
RowLayout {
id: row
anchors.centerIn: parent
- width: parent.width - 24
+ width: parent.width - (Settings.bubbles? 16 : 24)
spacing: 15
Rectangle {
@@ -88,6 +90,7 @@ Item {
z: -1
radius: 10
anchors.fill: parent
+ visible: !Settings.bubbles // the bubble in a bubble looks odd
}
}
diff --git a/resources/qml/delegates/ImageMessage.qml b/resources/qml/delegates/ImageMessage.qml
index a13bb4f65..fea3eaefc 100644
--- a/resources/qml/delegates/ImageMessage.qml
+++ b/resources/qml/delegates/ImageMessage.qml
@@ -20,9 +20,12 @@ Item {
property double divisor: isReply ? 5 : 3
implicitWidth: Math.round(originalWidth*Math.min((timelineView.height/divisor)/(originalWidth*proportionalHeight), 1))
- width: parent.width
+ width: Math.min(parent.width,implicitWidth)
height: width*proportionalHeight
+ property int metadataWidth
+ property bool fitsMetadata: (parent.width - width) > metadataWidth+4
+
Image {
id: blurhash_
diff --git a/resources/qml/delegates/MessageDelegate.qml b/resources/qml/delegates/MessageDelegate.qml
index 3210128a0..f8234b39a 100644
--- a/resources/qml/delegates/MessageDelegate.qml
+++ b/resources/qml/delegates/MessageDelegate.qml
@@ -35,6 +35,8 @@ Item {
required property string callType
required property int encryptionError
required property int relatedEventCacheBuster
+ property bool fitsMetadata: (chooser.child && chooser.child.fitsMetadata) ? chooser.child.fitsMetadata : false
+ property int metadataWidth
height: chooser.child ? chooser.child.height : Nheko.paddingLarge
@@ -65,6 +67,7 @@ Item {
body: d.body
isOnlyEmoji: d.isOnlyEmoji
isReply: d.isReply
+ metadataWidth: d.metadataWidth
}
}
@@ -109,6 +112,7 @@ Item {
filename: d.filename
isReply: d.isReply
eventId: d.eventId
+ metadataWidth: d.metadataWidth
}
}
@@ -126,6 +130,7 @@ Item {
filename: d.filename
isReply: d.isReply
eventId: d.eventId
+ metadataWidth: d.metadataWidth
}
}
@@ -137,6 +142,7 @@ Item {
eventId: d.eventId
filename: d.filename
filesize: d.filesize
+ metadataWidth: d.metadataWidth
}
}
@@ -153,6 +159,7 @@ Item {
url: d.url
body: d.body
filesize: d.filesize
+ metadataWidth: d.metadataWidth
}
}
@@ -169,6 +176,7 @@ Item {
url: d.url
body: d.body
filesize: d.filesize
+ metadataWidth: d.metadataWidth
}
}
@@ -177,7 +185,7 @@ Item {
roleValue: MtxEvent.Redacted
Redacted {
- //delegateWidth: d.width
+ metadataWidth: d.metadataWidth
}
}
diff --git a/resources/qml/delegates/PlayableMediaMessage.qml b/resources/qml/delegates/PlayableMediaMessage.qml
index 54813d23c..5188b80e0 100644
--- a/resources/qml/delegates/PlayableMediaMessage.qml
+++ b/resources/qml/delegates/PlayableMediaMessage.qml
@@ -25,10 +25,13 @@ Item {
property double divisor: isReply ? 4 : 2
property int tempWidth: originalWidth < 1? 400: originalWidth
implicitWidth: type == MtxEvent.VideoMessage ? Math.round(tempWidth*Math.min((timelineView.height/divisor)/(tempWidth*proportionalHeight), 1)) : 500
- width: parent.width
+ width: Math.min(parent.width, implicitWidth)
height: (type == MtxEvent.VideoMessage ? width*proportionalHeight : 80) + fileInfoLabel.height
implicitHeight: height
+ property int metadataWidth
+ property bool fitsMetadata: (parent.width - fileInfoLabel.width) > metadataWidth+4
+
MxcMedia {
id: mxcmedia
diff --git a/resources/qml/delegates/Redacted.qml b/resources/qml/delegates/Redacted.qml
index 8097fbf88..dcdb72480 100644
--- a/resources/qml/delegates/Redacted.qml
+++ b/resources/qml/delegates/Redacted.qml
@@ -12,9 +12,11 @@ Rectangle{
height: redactedLayout.implicitHeight + Nheko.paddingSmall
implicitWidth: redactedLayout.implicitWidth + 2 * Nheko.paddingMedium
- width: parent.width
+ width: Math.min(parent.width,implicitWidth+1)
radius: fontMetrics.lineSpacing / 2 + 2 * Nheko.paddingSmall
color: Nheko.colors.alternateBase
+ property int metadataWidth
+ property bool fitsMetadata: parent.width - redactedLayout.width > metadataWidth + 4
RowLayout {
id: redactedLayout
diff --git a/resources/qml/delegates/TextMessage.qml b/resources/qml/delegates/TextMessage.qml
index 741d8aa85..73411ab60 100644
--- a/resources/qml/delegates/TextMessage.qml
+++ b/resources/qml/delegates/TextMessage.qml
@@ -13,6 +13,8 @@ MatrixText {
required property bool isReply
required property string formatted
property string copyText: selectedText ? getText(selectionStart, selectionEnd) : body
+ property int metadataWidth
+ property bool fitsMetadata: positionAt(width,height-4) == positionAt(width-metadataWidth-10, height-4)
// table border-collapse doesn't seem to work
text: "
--
GitLab