Better touch scrolling (#1012)

This commit is contained in:
Malte E 2022-03-24 01:35:42 +01:00 committed by GitHub
parent 41c6b75efc
commit 13baf77435
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 91 additions and 110 deletions

View File

@ -362,7 +362,7 @@ Item {
}
delegate: ItemDelegate {
delegate: Item {
id: wrapper
required property double proportionalHeight
@ -407,55 +407,6 @@ Item {
width: chat.delegateMaxWidth
height: section.active ? section.height + timelinerow.height : timelinerow.height
hoverEnabled: true
background: Rectangle {
id: scrollHighlight
opacity: 0
visible: true
z: 1
enabled: false
color: Nheko.colors.highlight
states: State {
name: "revealed"
when: wrapper.scrolledToThis
}
transitions: Transition {
from: ""
to: "revealed"
SequentialAnimation {
PropertyAnimation {
target: scrollHighlight
properties: "opacity"
easing.type: Easing.InOutQuad
from: 0
to: 1
duration: 500
}
PropertyAnimation {
target: scrollHighlight
properties: "opacity"
easing.type: Easing.InOutQuad
from: 1
to: 0
duration: 500
}
ScriptAction {
script: chat.model.eventShown()
}
}
}
}
Loader {
id: section
@ -480,8 +431,6 @@ Item {
TimelineRow {
id: timelinerow
hovered: messageActions.hovered ? (messageActions.model != undefined && messageActions.model == timelinerow) : wrapper.hovered
proportionalHeight: wrapper.proportionalHeight
type: chat.model, wrapper.type
typeString: wrapper.typeString
@ -523,7 +472,52 @@ Item {
}
}
}
background: Rectangle {
id: scrollHighlight
opacity: 0
visible: true
z: 1
enabled: false
color: Nheko.colors.highlight
states: State {
name: "revealed"
when: wrapper.scrolledToThis
}
transitions: Transition {
from: ""
to: "revealed"
SequentialAnimation {
PropertyAnimation {
target: scrollHighlight
properties: "opacity"
easing.type: Easing.InOutQuad
from: 0
to: 1
duration: 500
}
PropertyAnimation {
target: scrollHighlight
properties: "opacity"
easing.type: Easing.InOutQuad
from: 1
to: 0
duration: 500
}
ScriptAction {
script: chat.model.eventShown()
}
}
}
}
}
Connections {
@ -729,10 +723,12 @@ Item {
property string text
property string link
property string eventId
function show(text_, link_) {
function show(text_, link_, eventId_) {
text = text_;
link = link_;
eventId = eventId_;
open();
}
@ -754,7 +750,7 @@ Item {
visible: true
enabled: visible
text: qsTr("&Go to quoted message")
onTriggered: chat.model.showEvent(eventId)
onTriggered: chat.model.showEvent(replyContextMenu.eventId)
}
}

View File

@ -11,7 +11,7 @@ import QtQuick.Layouts 1.2
import QtQuick.Window 2.13
import im.nheko 1.0
Item {
AbstractButton {
id: r
required property double proportionalHeight
@ -46,7 +46,7 @@ Item {
required property int status
required property int relatedEventCacheBuster
property bool hovered: false
hoverEnabled: true
width: parent.width
height: row.height+(reactionRow.height > 0 ? reactionRow.height-2 : 0 )
@ -55,21 +55,18 @@ Item {
color: (Settings.messageHoverHighlight && hovered) ? Nheko.colors.alternateBase : "transparent"
anchors.fill: parent
// this looks better without margins
TapHandler {
acceptedButtons: Qt.RightButton
onSingleTapped: messageContextMenu.show(eventId, type, isSender, isEncrypted, isEditable, contentItem.child.hoveredLink, contentItem.child.copyText)
gesturePolicy: TapHandler.ReleaseWithinBounds
}
}
TapHandler {
acceptedButtons: Qt.RightButton
onSingleTapped: messageContextMenu.show(eventId, type, isSender, isEncrypted, isEditable, contentItem.child.hoveredLink, contentItem.child.copyText)
gesturePolicy: TapHandler.ReleaseWithinBounds
}
TapHandler {
onLongPressed: messageContextMenu.show(eventId, type, isSender, isEncrypted, isEditable, contentItem.child.hoveredLink, contentItem.child.copyText)
onDoubleTapped: chat.model.reply = eventId
gesturePolicy: TapHandler.ReleaseWithinBounds
}
onPressAndHold: messageContextMenu.show(eventId, type, isSender, isEncrypted, isEditable, contentItem.child.hoveredLink, contentItem.child.copyText)
onDoubleClicked: chat.model.reply = eventId
Control {
Rectangle {
id: row
property bool bubbleOnRight : isSender && Settings.bubbles
anchors.leftMargin: isStateEvent || Settings.smallAvatars? 0 : Nheko.avatarSize+8 // align bubble with section header
@ -78,20 +75,21 @@ Item {
anchors.horizontalCenter: isStateEvent? parent.horizontalCenter : undefined
property int maxWidth: (parent.width-(Settings.smallAvatars || isStateEvent? 0 : Nheko.avatarSize+8))*(Settings.bubbles && !isStateEvent? 0.9 : 1)
width: Settings.bubbles? Math.min(maxWidth,Math.max(reply.implicitWidth+8,contentItem.implicitWidth+metadata.width+20)) : maxWidth
height: msg.height+msg.anchors.margins*2
leftPadding: 4
rightPadding: (Settings.bubbles && !isStateEvent)? 4: 2
topPadding: rightPadding
bottomPadding: topPadding
background: Rectangle {
property color userColor: TimelineManager.userColor(userId, Nheko.colors.base)
property color bgColor: Nheko.colors.base
color: Qt.tint(bgColor, Qt.hsla(userColor.hslHue, 0.5, userColor.hslLightness, 0.2))
radius: 4
visible: Settings.bubbles && !isStateEvent
}
property color userColor: TimelineManager.userColor(userId, Nheko.colors.base)
property color bgColor: Nheko.colors.base
color: (Settings.bubbles && !isStateEvent) ? Qt.tint(bgColor, Qt.hsla(userColor.hslHue, 0.5, userColor.hslLightness, 0.2)) : "#00000000"
radius: 4
contentItem: GridLayout {
GridLayout {
anchors {
left: parent.left
top: parent.top
right: parent.right
margins: (Settings.bubbles && ! isStateEvent)? 4 : 2
leftMargin: 4
}
id: msg
rowSpacing: 0
columnSpacing: 2

View File

@ -5,9 +5,10 @@
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.3
import im.nheko 1.0
Item {
AbstractButton {
required property int type
required property int originalWidth
required property double proportionalHeight
@ -24,6 +25,7 @@ Item {
implicitWidth: Math.round(tempWidth*Math.min((timelineView.height/divisor)/(tempWidth*proportionalHeight), 1))
width: Math.min(parent.width,implicitWidth)
height: width*proportionalHeight
hoverEnabled: true
property int metadataWidth
property bool fitsMetadata: (parent.width - width) > metadataWidth+4
@ -61,28 +63,17 @@ Item {
visible: loaded
anchors.fill: parent
roomm: room
play: !Settings.animateImagesOnHover || mouseArea.hovered
play: !Settings.animateImagesOnHover || parent.hovered
eventId: parent.eventId
}
TapHandler {
//enabled: type == MtxEvent.ImageMessage && (img.status == Image.Ready || mxcimage.loaded)
onSingleTapped: {
Settings.openImageExternal ? room.openMedia(eventId) : TimelineManager.openImageOverlay(room, url, eventId);
eventPoint.accepted = true;
}
gesturePolicy: TapHandler.ReleaseWithinBounds
}
HoverHandler {
id: mouseArea
}
onClicked :Settings.openImageExternal ? room.openMedia(eventId) : TimelineManager.openImageOverlay(room, url, eventId);
Item {
id: overlay
anchors.fill: parent
visible: mouseArea.hovered
visible: parent.hovered
Rectangle {
id: container

View File

@ -11,7 +11,7 @@ import QtQuick.Window 2.13
import im.nheko 1.0
import "../"
Item {
AbstractButton {
id: r
property color userColor: "red"
@ -57,6 +57,16 @@ Item {
color: TimelineManager.userColor(userId, Nheko.colors.base)
}
onClicked: {
let link = reply.child.linkAt != undefined && reply.child.linkAt(pressX-colorLine.width, pressY - userName_.implicitHeight);
if (link) {
Nheko.openLink(link)
} else {
room.showEvent(r.eventId)
}
}
onPressAndHold: replyContextMenu.show(reply.child.copyText, reply.child.linkAt(pressX-colorLine.width, pressY - userName_.implicitHeight), r.eventId)
ColumnLayout {
id: replyContainer
@ -64,23 +74,9 @@ Item {
width: parent.width - 4
spacing: 0
TapHandler {
acceptedButtons: Qt.LeftButton
onSingleTapped: {
let link = reply.child.linkAt != undefined && reply.child.linkAt(eventPoint.position.x, eventPoint.position.y - userName_.implicitHeight);
if (link) {
Nheko.openLink(link)
} else {
room.showEvent(r.eventId)
}
}
gesturePolicy: TapHandler.ReleaseWithinBounds
}
TapHandler {
acceptedButtons: Qt.RightButton
onLongPressed: replyContextMenu.show(reply.child.copyText, reply.child.linkAt(eventPoint.position.x, eventPoint.position.y - userName_.implicitHeight))
onSingleTapped: replyContextMenu.show(reply.child.copyText, reply.child.linkAt(eventPoint.position.x, eventPoint.position.y - userName_.implicitHeight))
onSingleTapped: replyContextMenu.show(reply.child.copyText, reply.child.linkAt(eventPoint.position.x, eventPoint.position.y - userName_.implicitHeight), r.eventId)
gesturePolicy: TapHandler.ReleaseWithinBounds
}