Remove boundary handling in image overlay

They hurt more than they are helping
This commit is contained in:
Nicolas Werner 2022-04-10 04:10:32 +02:00
parent 557e60990d
commit 85f0ffb6bf
2 changed files with 28 additions and 35 deletions

View file

@ -288,7 +288,9 @@ Pane {
var dialog = imageOverlay.createObject(timelineRoot, { var dialog = imageOverlay.createObject(timelineRoot, {
"room": room, "room": room,
"eventId": eventId, "eventId": eventId,
"url": url "url": url,
"originalWidth": originalWidth ?? 0,
"proportionalHeight": proportionalHeight ?? 0
}); });
dialog.showFullScreen(); dialog.showFullScreen();
destroyOnClose(dialog); destroyOnClose(dialog);

View file

@ -4,7 +4,6 @@
import QtQuick 2.15 import QtQuick 2.15
import QtQuick.Window 2.15 import QtQuick.Window 2.15
import Qt.labs.animation 1.0
import ".." import ".."
@ -16,10 +15,12 @@ Window {
required property string url required property string url
required property string eventId required property string eventId
required property Room room required property Room room
required property int originalWidth
required property double proportionalHeight
flags: Qt.FramelessWindowHint flags: Qt.FramelessWindowHint
visibility: Window.FullScreen //visibility: Window.FullScreen
color: Qt.rgba(0.2,0.2,0.2,0.66) color: Qt.rgba(0.2,0.2,0.2,0.66)
Shortcut { Shortcut {
@ -28,11 +29,18 @@ Window {
} }
Item { Item {
height: Math.min(parent.height, img.implicitHeight) id: imgContainer
width: Math.min(parent.width, img.implicitWidth)
x: (parent.width - img.width)/2 property int imgSrcWidth: (originalWidth && originalWidth > 200) ? originalWidth : Screen.width
y: (parent.height - img.height)/2 property int imgSrcHeight: proportionalHeight ? imgSrcWidth * proportionalHeight : Screen.height
height: Math.min(parent.height, imgSrcHeight)
width: Math.min(parent.width, imgSrcWidth)
x: (parent.width - width)
y: (parent.height - height)
Image { Image {
id: img id: img
@ -57,46 +65,29 @@ Window {
eventId: imageOverlay.eventId eventId: imageOverlay.eventId
} }
BoundaryRule on scale { onScaleChanged: {
enabled: img.loaded || mxcimage.loaded if (scale > 10) scale = 10;
id: sbr if (scale < 0.1) scale = 0.1
minimum: 0.1 }
maximum: 10
minimumOvershoot: 0.02; maximumOvershoot: 10.02
} }
BoundaryRule on x { Item {
enabled: img.loaded || mxcimage.loaded anchors.fill: parent
id: xbr
minimum: -100
maximum: imageOverlay.width - img.width + 100
minimumOvershoot: 100; maximumOvershoot: 100
overshootFilter: BoundaryRule.Peak
}
BoundaryRule on y {
enabled: img.loaded || mxcimage.loaded
id: ybr
minimum: -100
maximum: imageOverlay.height - img.height + 100
minimumOvershoot: 100; maximumOvershoot: 100
overshootFilter: BoundaryRule.Peak
}
PinchHandler { PinchHandler {
onActiveChanged: if (!active) sbr.returnToBounds(); target: imgContainer
maximumScale: 10
minimumScale: 0.1
} }
WheelHandler { WheelHandler {
property: "scale" property: "scale"
onActiveChanged: if (!active) sbr.returnToBounds(); target: imgContainer
} }
DragHandler { DragHandler {
onActiveChanged: if (!active) { target: imgContainer
xbr.returnToBounds();
ybr.returnToBounds();
}
} }
HoverHandler { HoverHandler {