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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Material
Page {
id: root
implicitWidth: 550
implicitHeight: 300
Label {
id: fpsLabel
anchors {
top: parent.top
topMargin: 8 * 2
horizontalCenter: parent.horizontalCenter
}
color: Material.accent
}
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: newApiRoot + "/sensor/image"
width: flickable.contentWidth
height: flickable.contentHeight
function updateImage() {
// console.log("updateImage. visible: ", visible)
if (image.source == newApiRoot + "/sensor/image")
image.source = newApiRoot + "/sensor/image2"
else
image.source = newApiRoot + "/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: {
if (!visible)
return;
// 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: visible
property int fpsCounter: 0
onTriggered: {
fpsLabel.text = qsTr("Fps") + ": " + fpsCounter
fpsCounter = 0
image.updateImage()
}
}
}
}
background: Rectangle { color: "#121314" }
}
}
|
