d3v1l/matrixion
1
0
Fork 0
mirror of https://github.com/Nheko-Reborn/nheko.git synced 2024-11-23 11:28:49 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Moves the timestamp to the left

Browse source 
This should help a lot on mobile, makes the timeline a bit denser and
gives additional horizontal space. Not sure I like the smaller avatars
though.
This commit is contained in:
Nicolas Werner 2021-06-15 13:41:08 +02:00
parent 84434433f2
commit 74fb9385b0
No known key found for this signature in database
GPG key ID: C8D75E610773F2D9
3 changed files with 35 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
resources/qml/ChatPage.qml
View file

@ -71,7 +71,7 @@ Rectangle {
AdaptiveLayoutElement { AdaptiveLayoutElement {
id: timlineViewC id: timlineViewC
minimumWidth: fontMetrics.averageCharacterWidth * 40 + Nheko.avatarSize + 2* Nheko.paddingMedium minimumWidth: fontMetrics.averageCharacterWidth * 40 + Nheko.avatarSize + 2 * Nheko.paddingMedium
TimelineView { TimelineView {
id: timeline id: timeline

7
resources/qml/MessageView.qml
View file

@ -241,8 +241,11 @@ ScrollView {
Avatar { Avatar {
id: messageUserAvatar id: messageUserAvatar
width: Nheko.avatarSize property int avatarSize: Math.ceil(fontMetrics.lineSpacing * 1.5)
height: Nheko.avatarSize
width: avatarSize
height: avatarSize
y: -Math.ceil(fontMetrics.lineSpacing * 0.25)
url: modelData ? chat.model.avatarUrl(modelData.userId).replace("mxc://", "image://MxcImage/") : "" url: modelData ? chat.model.avatarUrl(modelData.userId).replace("mxc://", "image://MxcImage/") : ""
displayName: modelData ? modelData.userName : "" displayName: modelData ? modelData.userName : ""
userid: modelData ? modelData.userId : "" userid: modelData ? modelData.userId : ""

40
resources/qml/TimelineRow.qml
View file

@ -41,12 +41,16 @@ Item {
RowLayout { RowLayout {
id: row id: row
property int avatarSize: Math.ceil(fontMetrics.lineSpacing * 1.5)
anchors.rightMargin: 1 anchors.rightMargin: 1
anchors.leftMargin: Nheko.avatarSize + 16 anchors.leftMargin: avatarSize + Nheko.paddingMedium
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
Column { Column {
id: messageCol
Layout.fillWidth: true Layout.fillWidth: true
Layout.alignment: Qt.AlignTop Layout.alignment: Qt.AlignTop
spacing: 4 spacing: 4
@ -111,18 +115,32 @@ Item {
} }
Label { }
Layout.alignment: Qt.AlignRight | Qt.AlignTop
text: model.timestamp.toLocaleTimeString(Locale.ShortFormat)
width: Math.max(implicitWidth, text.length * fontMetrics.maximumCharacterWidth)
color: Nheko.inactiveColors.text
ToolTip.visible: ma.hovered
ToolTip.text: Qt.formatDateTime(model.timestamp, Qt.DefaultLocaleLongDate)
HoverHandler { Label {
id: ma id: ts
}
property int marginPadding: Math.floor((fontMetrics.font.pixelSize - smallFontMetrics.font.pixelSize) / 2)
anchors.left: parent.left
anchors.leftMargin: marginPadding
anchors.bottom: parent.bottom
anchors.bottomMargin: (reactionRow.height > 0 ? reactionRow.height + messageCol.spacing : 0) + marginPadding
text: model.timestamp.toLocaleTimeString(Locale.ShortFormat)
width: Math.max(implicitWidth, text.length * smallFontMetrics.maximumCharacterWidth)
font.pixelSize: smallFontMetrics.font.pixelSize
color: Nheko.inactiveColors.text
ToolTip.visible: ma.hovered
ToolTip.text: Qt.formatDateTime(model.timestamp, Qt.DefaultLocaleLongDate)
FontMetrics {
id: smallFontMetrics
font.pixelSize: Math.ceil(fontMetrics.font.pixelSize * 0.6)
}
HoverHandler {
id: ma
} }
} }