Add section back.
Enable pixelAligned for flickable. Tweak timeline delegate.
This commit is contained in:
parent
627647207b
commit
49545df607
|
@ -1,6 +1,8 @@
|
|||
import QtQuick 2.12
|
||||
|
||||
ListView {
|
||||
pixelAligned: true
|
||||
|
||||
ScrollHelper {
|
||||
anchors.fill: parent
|
||||
|
||||
|
|
|
@ -18,7 +18,6 @@ Item {
|
|||
sourceSize.width: width
|
||||
sourceSize.height: width
|
||||
fillMode: Image.PreserveAspectCrop
|
||||
mipmap: true
|
||||
layer.enabled: true
|
||||
layer.effect: OpacityMask {
|
||||
maskSource: Rectangle {
|
||||
|
|
|
@ -1,34 +1,49 @@
|
|||
/*
|
||||
* Copyright (C) 2016 Michael Bohlender, <michael.bohlender@kdemail.net>
|
||||
* Copyright (C) 2017 Christian Mollekopf, <mollekopf@kolabsystems.com>
|
||||
*
|
||||
* This program is free software; you can redistribute it and/or modify
|
||||
* it under the terms of the GNU General Public License as published by
|
||||
* the Free Software Foundation; either version 2 of the License, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU General Public License along
|
||||
* with this program; if not, write to the Free Software Foundation, Inc.,
|
||||
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||||
*/
|
||||
|
||||
import QtQuick 2.12
|
||||
import QtQuick.Controls 2.12
|
||||
|
||||
/*
|
||||
* The MouseArea + interactive: false + maximumFlickVelocity are required
|
||||
* to fix scrolling for desktop systems where we don't want flicking behaviour.
|
||||
*
|
||||
* See also:
|
||||
* ScrollView.qml in qtquickcontrols
|
||||
* qquickwheelarea.cpp in qtquickcontrols
|
||||
*/
|
||||
MouseArea {
|
||||
id: root
|
||||
propagateComposedEvents: true
|
||||
|
||||
property Flickable flickable
|
||||
property alias enabled: root.enabled
|
||||
|
||||
//Place the mouse area under the flickable
|
||||
z: -1
|
||||
onFlickableChanged: {
|
||||
flickable.interactive = false
|
||||
flickable.maximumFlickVelocity = 100000
|
||||
flickable.boundsBehavior = Flickable.StopAtBounds
|
||||
}
|
||||
|
||||
function scrollByPixelDelta(flickableItem, pixelDelta) {
|
||||
if (!pixelDelta) {
|
||||
return flickableItem.contentY;
|
||||
if (enabled) {
|
||||
flickable.interactive = false
|
||||
flickable.maximumFlickVelocity = 100000
|
||||
flickable.boundsBehavior = Flickable.StopAtBounds
|
||||
root.parent = flickable
|
||||
}
|
||||
|
||||
var minYExtent = flickableItem.originY + flickableItem.topMargin;
|
||||
var maxYExtent = (flickableItem.contentHeight + flickableItem.bottomMargin + flickableItem.originY) - flickableItem.height;
|
||||
|
||||
if (typeof(flickableItem.headerItem) !== "undefined" && flickableItem.headerItem) {
|
||||
minYExtent += flickableItem.headerItem.height
|
||||
}
|
||||
|
||||
//Avoid overscrolling
|
||||
return Math.max(minYExtent, Math.min(maxYExtent, flickableItem.contentY - pixelDelta));
|
||||
}
|
||||
|
||||
function calculateNewPosition(flickableItem, wheel) {
|
||||
|
@ -52,27 +67,30 @@ MouseArea {
|
|||
pixelDelta = wheel.pixelDelta.y
|
||||
}
|
||||
|
||||
return scrollByPixelDelta(flickableItem, pixelDelta);
|
||||
}
|
||||
if (!pixelDelta) {
|
||||
return flickableItem.contentY;
|
||||
}
|
||||
|
||||
function scrollDown() {
|
||||
flickable.flick(0, 0);
|
||||
flickable.contentY = scrollByPixelDelta(flickable, -60); //3 lines * 20 pixels
|
||||
}
|
||||
var minYExtent = flickableItem.originY + flickableItem.topMargin;
|
||||
var maxYExtent = (flickableItem.contentHeight + flickableItem.bottomMargin + flickableItem.originY) - flickableItem.height;
|
||||
|
||||
function scrollUp() {
|
||||
flickable.flick(0, 0);
|
||||
flickable.contentY = scrollByPixelDelta(flickable, 60); //3 lines * 20 pixels
|
||||
if (typeof(flickableItem.headerItem) !== "undefined" && flickableItem.headerItem) {
|
||||
minYExtent += flickableItem.headerItem.height
|
||||
}
|
||||
|
||||
//Avoid overscrolling
|
||||
return Math.max(minYExtent, Math.min(maxYExtent, flickableItem.contentY - pixelDelta));
|
||||
}
|
||||
|
||||
onWheel: {
|
||||
var newPos = calculateNewPosition(flickable, wheel);
|
||||
// console.warn("Delta: ", wheel.pixelDelta.y);
|
||||
// console.warn("Old position: ", flickable.contentY);
|
||||
// console.warn("New position: ", newPos);
|
||||
|
||||
// Show the scrollbars
|
||||
flickable.flick(0, 0);
|
||||
flickable.contentY = calculateNewPosition(flickable, wheel);
|
||||
flickable.contentY = newPos;
|
||||
cancelFlickStateTimer.start()
|
||||
}
|
||||
|
||||
|
|
|
@ -76,7 +76,7 @@ ColumnLayout {
|
|||
|
||||
visible: !(sentByMe || avatarVisible)
|
||||
|
||||
text: Qt.formatDateTime(time, "hh:mm")
|
||||
text: Qt.formatTime(time, "hh:mm AP")
|
||||
color: "#5B7480"
|
||||
|
||||
font.pixelSize: 10
|
||||
|
@ -119,6 +119,58 @@ ColumnLayout {
|
|||
color: MPalette.background
|
||||
radius: 18
|
||||
|
||||
Rectangle {
|
||||
anchors.top: parent.top
|
||||
anchors.left: parent.left
|
||||
|
||||
width: parent.width / 2
|
||||
height: parent.height / 2
|
||||
|
||||
visible: !sentByMe && (bubbleShape == 3 || bubbleShape == 2)
|
||||
|
||||
color: sentByMe ? MPalette.background : eventType === "notice" ? MPalette.primary : MPalette.accent
|
||||
radius: 2
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.top: parent.top
|
||||
anchors.right: parent.right
|
||||
|
||||
width: parent.width / 2
|
||||
height: parent.height / 2
|
||||
|
||||
visible: sentByMe && (bubbleShape == 3 || bubbleShape == 2)
|
||||
|
||||
color: sentByMe ? MPalette.background : eventType === "notice" ? MPalette.primary : MPalette.accent
|
||||
radius: 2
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.left: parent.left
|
||||
|
||||
width: parent.width / 2
|
||||
height: parent.height / 2
|
||||
|
||||
visible: !sentByMe && (bubbleShape == 1 || bubbleShape == 2)
|
||||
|
||||
color: sentByMe ? MPalette.background : eventType === "notice" ? MPalette.primary : MPalette.accent
|
||||
radius: 2
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.right: parent.right
|
||||
|
||||
width: parent.width / 2
|
||||
height: parent.height / 2
|
||||
|
||||
visible: sentByMe && (bubbleShape == 1 || bubbleShape == 2)
|
||||
|
||||
color: sentByMe ? MPalette.background : eventType === "notice" ? MPalette.primary : MPalette.accent
|
||||
radius: 2
|
||||
}
|
||||
|
||||
AutoMouseArea {
|
||||
anchors.fill: parent
|
||||
|
||||
|
|
|
@ -37,7 +37,7 @@ RowLayout {
|
|||
Avatar {
|
||||
Layout.preferredWidth: 32
|
||||
Layout.preferredHeight: 32
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
|
||||
visible: avatarVisible
|
||||
hint: author.displayName
|
||||
|
@ -61,16 +61,8 @@ RowLayout {
|
|||
Label {
|
||||
Layout.preferredWidth: 32
|
||||
Layout.preferredHeight: 32
|
||||
Layout.alignment: Qt.AlignTop
|
||||
|
||||
visible: !(sentByMe || avatarVisible)
|
||||
|
||||
text: Qt.formatDateTime(time, "hh:mm")
|
||||
color: "#5B7480"
|
||||
|
||||
font.pixelSize: 10
|
||||
horizontalAlignment: Label.AlignHCenter
|
||||
verticalAlignment: Label.AlignVCenter
|
||||
}
|
||||
|
||||
BusyIndicator {
|
||||
|
@ -114,7 +106,7 @@ RowLayout {
|
|||
|
||||
contentItem: RowLayout {
|
||||
Label {
|
||||
text: Qt.formatDateTime(time, "hh:mm")
|
||||
text: Qt.formatTime(time, "hh:mm AP")
|
||||
color: "white"
|
||||
font.pixelSize: 12
|
||||
}
|
||||
|
|
|
@ -27,6 +27,8 @@ ColumnLayout {
|
|||
spacing: 0
|
||||
|
||||
RowLayout {
|
||||
Layout.alignment: sentByMe ? Qt.AlignRight : Qt.AlignLeft
|
||||
|
||||
id: messageRow
|
||||
|
||||
spacing: 4
|
||||
|
@ -34,7 +36,7 @@ ColumnLayout {
|
|||
Avatar {
|
||||
Layout.preferredWidth: 32
|
||||
Layout.preferredHeight: 32
|
||||
Layout.alignment: Qt.AlignTop
|
||||
Layout.alignment: Qt.AlignBottom
|
||||
|
||||
visible: avatarVisible
|
||||
hint: author.displayName
|
||||
|
@ -189,6 +191,8 @@ ColumnLayout {
|
|||
Control {
|
||||
Layout.fillWidth: true
|
||||
|
||||
visible: replyVisible
|
||||
|
||||
padding: 0
|
||||
|
||||
background: RippleEffect {
|
||||
|
@ -196,9 +200,6 @@ ColumnLayout {
|
|||
}
|
||||
|
||||
contentItem: Label {
|
||||
Layout.fillWidth: true
|
||||
|
||||
visible: replyVisible
|
||||
color: darkBackground ? "white" : MPalette.lighter
|
||||
text: "<style>a{color: " + (darkBackground ? "white" : MPalette.foreground) + ";} .user-pill{}</style>" + (replyDisplay || "")
|
||||
|
||||
|
@ -264,16 +265,16 @@ ColumnLayout {
|
|||
|
||||
visible: showAuthor
|
||||
|
||||
Label {
|
||||
text: Qt.formatDateTime(time, "hh:mm")
|
||||
color: MPalette.lighter
|
||||
}
|
||||
|
||||
Label {
|
||||
visible: !sentByMe
|
||||
|
||||
text: author.displayName
|
||||
color: MPalette.lighter
|
||||
}
|
||||
|
||||
Label {
|
||||
text: Qt.formatTime(time, "hh:mm AP")
|
||||
color: MPalette.lighter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -3,10 +3,11 @@ import QtQuick.Controls 2.12
|
|||
import Spectral.Setting 0.1
|
||||
|
||||
Label {
|
||||
text: section + " • " + Qt.formatTime(time, "hh:mm")
|
||||
text: section + " • " + Qt.formatTime(time, "hh:mm AP")
|
||||
color: MPalette.foreground
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
font.capitalization: Font.AllUppercase
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
padding: 8
|
||||
}
|
||||
|
|
|
@ -3,26 +3,33 @@ import QtQuick.Controls 2.12
|
|||
import QtQuick.Layouts 1.12
|
||||
import QtQuick.Controls.Material 2.12
|
||||
|
||||
import Spectral.Component 2.0
|
||||
import Spectral.Setting 0.1
|
||||
|
||||
Label {
|
||||
text: "<b>" + author.displayName + "</b> " + display
|
||||
color: MPalette.foreground
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
Control {
|
||||
padding: 8
|
||||
|
||||
topPadding: 8
|
||||
bottomPadding: 8
|
||||
leftPadding: 24
|
||||
rightPadding: 24
|
||||
contentItem: RowLayout {
|
||||
Avatar {
|
||||
Layout.preferredWidth: 24
|
||||
Layout.preferredHeight: 24
|
||||
|
||||
wrapMode: Label.Wrap
|
||||
textFormat: MSettings.richText ? Text.RichText : Text.StyledText
|
||||
onLinkActivated: Qt.openUrlExternally(link)
|
||||
hint: author.displayName
|
||||
source: author.avatarMediaId
|
||||
}
|
||||
|
||||
background: Rectangle {
|
||||
color: MPalette.background
|
||||
radius: 4
|
||||
antialiasing: true
|
||||
Label {
|
||||
Layout.fillWidth: true
|
||||
Layout.maximumWidth: messageListView.width - 48
|
||||
|
||||
text: "<b>" + author.displayName + "</b> " + display + " • " + Qt.formatTime(time, "hh:mm AP")
|
||||
color: MPalette.foreground
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Medium
|
||||
textFormat: Label.StyledText
|
||||
|
||||
wrapMode: Label.Wrap
|
||||
onLinkActivated: Qt.openUrlExternally(link)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -201,6 +201,8 @@ Item {
|
|||
background: Rectangle {
|
||||
color: Material.background
|
||||
|
||||
opacity: listView.atYBeginning ? 0 : 1
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: ElevationEffect {
|
||||
elevation: 2
|
||||
|
|
|
@ -155,8 +155,6 @@ Item {
|
|||
roleValue: "state"
|
||||
delegate: StateDelegate {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -164,49 +162,78 @@ Item {
|
|||
roleValue: "emote"
|
||||
delegate: StateDelegate {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
|
||||
width: Math.min(implicitWidth, parent.width)
|
||||
}
|
||||
}
|
||||
|
||||
DelegateChoice {
|
||||
roleValue: "message"
|
||||
delegate: MessageDelegate {
|
||||
anchors.right: sentByMe ? parent.right : undefined
|
||||
delegate: ColumnLayout {
|
||||
width: messageListView.width
|
||||
|
||||
SectionDelegate {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.maximumWidth: parent.width
|
||||
|
||||
visible: showSection
|
||||
}
|
||||
|
||||
MessageDelegate {
|
||||
Layout.alignment: sentByMe ? Qt.AlignRight : Qt.AlignLeft
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DelegateChoice {
|
||||
roleValue: "notice"
|
||||
delegate: MessageDelegate {
|
||||
anchors.right: sentByMe ? parent.right : undefined
|
||||
delegate: ColumnLayout {
|
||||
width: messageListView.width
|
||||
|
||||
SectionDelegate {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.maximumWidth: parent.width
|
||||
|
||||
visible: showSection
|
||||
}
|
||||
|
||||
MessageDelegate {
|
||||
Layout.alignment: sentByMe ? Qt.AlignRight : Qt.AlignLeft
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DelegateChoice {
|
||||
roleValue: "image"
|
||||
delegate: ImageDelegate {
|
||||
anchors.right: sentByMe ? parent.right : undefined
|
||||
delegate: ColumnLayout {
|
||||
width: messageListView.width
|
||||
|
||||
Layout.maximumWidth: parent.width
|
||||
}
|
||||
}
|
||||
SectionDelegate {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.maximumWidth: parent.width
|
||||
|
||||
DelegateChoice {
|
||||
roleValue: "sticker"
|
||||
delegate: ImageDelegate {
|
||||
anchors.right: sentByMe ? parent.right : undefined
|
||||
visible: showSection
|
||||
}
|
||||
|
||||
Layout.maximumWidth: parent.width
|
||||
ImageDelegate {
|
||||
Layout.alignment: sentByMe ? Qt.AlignRight : Qt.AlignLeft
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
DelegateChoice {
|
||||
roleValue: "file"
|
||||
delegate: FileDelegate {
|
||||
anchors.right: sentByMe ? parent.right : undefined
|
||||
delegate: ColumnLayout {
|
||||
width: messageListView.width
|
||||
|
||||
Layout.maximumWidth: parent.width
|
||||
SectionDelegate {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.maximumWidth: parent.width
|
||||
|
||||
visible: showSection
|
||||
}
|
||||
|
||||
FileDelegate {
|
||||
Layout.alignment: sentByMe ? Qt.AlignRight : Qt.AlignLeft
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -35,6 +35,7 @@ QHash<int, QByteArray> MessageEventModel::roleNames() const {
|
|||
roles[ReplyDisplayRole] = "replyDisplay";
|
||||
roles[UserMarkerRole] = "userMarker";
|
||||
roles[ShowAuthorRole] = "showAuthor";
|
||||
roles[ShowSectionRole] = "showSection";
|
||||
roles[BubbleShapeRole] = "bubbleShape";
|
||||
return roles;
|
||||
}
|
||||
|
@ -289,7 +290,8 @@ QVariant MessageEventModel::data(const QModelIndex& idx, int role) const {
|
|||
case MessageEventType::Audio:
|
||||
return "audio";
|
||||
}
|
||||
if (e->hasFileContent()) return "file";
|
||||
if (e->hasFileContent())
|
||||
return "file";
|
||||
|
||||
return "message";
|
||||
}
|
||||
|
@ -429,6 +431,19 @@ QVariant MessageEventModel::data(const QModelIndex& idx, int role) const {
|
|||
return true;
|
||||
}
|
||||
|
||||
if (role == ShowSectionRole) {
|
||||
for (auto r = row + 1; r < rowCount(); ++r) {
|
||||
auto i = index(r);
|
||||
if (data(i, SpecialMarksRole) != EventStatus::Hidden) {
|
||||
return data(i, TimeRole)
|
||||
.toDateTime()
|
||||
.msecsTo(data(idx, TimeRole).toDateTime()) > 600000;
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
if (role == BubbleShapeRole) { // TODO: Convoluted logic.
|
||||
int aboveRow = -1; // Invalid
|
||||
|
||||
|
|
|
@ -32,6 +32,7 @@ class MessageEventModel : public QAbstractListModel {
|
|||
ReplyDisplayRole,
|
||||
|
||||
ShowAuthorRole,
|
||||
ShowSectionRole,
|
||||
BubbleShapeRole,
|
||||
// For debugging
|
||||
EventResolvedTypeRole,
|
||||
|
|
Loading…
Reference in New Issue