From ce03d5bff5ca0c06ac884628c8ef65b902de669f Mon Sep 17 00:00:00 2001 From: Nikita Kostovsky Date: Sat, 9 Nov 2024 17:28:58 +0100 Subject: Initial commit --- ImageViewer.qml | 121 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 121 insertions(+) create mode 100644 ImageViewer.qml (limited to 'ImageViewer.qml') diff --git a/ImageViewer.qml b/ImageViewer.qml new file mode 100644 index 0000000..30a28e2 --- /dev/null +++ b/ImageViewer.qml @@ -0,0 +1,121 @@ +import QtQuick +import QtQuick.Controls + +Page { + id: root + + implicitWidth: 550 + implicitHeight: 300 + + contentItem: Control { + id: container + + property real iscale: 1 + property size fitSize: { + const ss = image.sourceSize; + const ratio = ss.width / ss.height; + return ratio < width/height ? Qt.size(height * ratio, height) : Qt.size(width, width / ratio); + } + + contentItem: Flickable { + id: flickable + + clip: true + + leftMargin: Math.max(0, width - contentWidth) / 2 // Centering the content + topMargin: Math.max(0, height - contentHeight) / 2 + + contentWidth: container.fitSize.width + contentHeight: container.fitSize.height + + rebound: Transition {} + boundsBehavior: Flickable.StopAtBounds + ScrollBar.vertical: ScrollBar {} + ScrollBar.horizontal: ScrollBar {} + + + Image { + id: image + + cache: false + smooth: false + asynchronous: true + retainWhileLoading: true + + source: apiRoot + "/sensor/image" + + width: flickable.contentWidth + height: flickable.contentHeight + + function updateImage() { + if (image.source == apiRoot + "/sensor/image") + image.source = apiRoot + "/sensor/image2" + else + image.source = apiRoot + "/sensor/image" + + // console.log("\nflickImg.width: ", flickImg.width, + // "\nflickImg.height: ", flickImg.height, + // "\nimg.width: ", img.width, + // "\nimg.width: ", img.height, + // "\nimg.width: ", img.scale, + // "\nimg.imgRatio: ", img.imgRatio, + // "\n----------------------------------------" + // ); + } + + Shortcut { + sequence: "ctrl+m" + onActivated: smooth = !smooth + } + + onStatusChanged: { + // console.log(image.source) + if (status == Image.Ready) { + updateImage(); + + ++imageFpsTimer.fpsCounter; + } + } + + MouseArea { + hoverEnabled: true + anchors.fill: parent + onWheel: function(e) { + const { width, height } = container.fitSize; + const mousePos = Qt.point(mouseX, mouseY); + + // container.iscale += e.angleDelta.y / 120; + + if (e.angleDelta.y < 0) { + container.iscale /= 1.2 + } else { + container.iscale *= 1.2 + } + + flickable.resizeContent(width * container.iscale, height * container.iscale, mousePos); + flickable.returnToBounds(); + } + } + + Timer { + id: imageFpsTimer + + interval: 1000 + repeat: true + running: true + + property int fpsCounter: 0 + + onTriggered: { + fpsLabel.text = qsTr("Fps") + ": " + fpsCounter + fpsCounter = 0 + + image.updateImage() + } + } + } + } + + background: Rectangle { color: "#121314" } + } +} -- cgit v1.2.3-70-g09d2