1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
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" }
}
}
|
