Dear all,
I’ve also posted this question on Stack Overflow: http://stackoverflow.com/questions/24478653/how-to-use-qml-scale-element-for-incremental-scaling-with-different-origin — if you prefer that you can always respond there.
In any case, I’m trying to use a QML Scale Element to perform view scaling around a point clicked by the user. The user can change the zoom point by clicking elsewhere. I’m using a QML Scale Element and setting its origin based on the user’s click position.
In the following minimal example, this works when you click your first point (try the center of the blue rectangle at top left). However, when you click on another point (try the center of the red rectangle) the zoom causes a translation jump. If you now click again on that second point (at its new position), zooming works as expected, until you want to zoom around a new point again. What am I doing wrong?
import QtQuick 2.2
import QtQuick.Controls 1.1
ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
Rectangle {
x: 100
y: 100
width: 300
height: 300
transform: Scale {
id: tform
}
MouseArea {
anchors.fill: parent
onClicked: {
console.log(mouse.x + " " + mouse.y)
tform.xScale += 0.5
tform.yScale += 0.5
tform.origin.x = mouse.x
tform.origin.y = mouse.y
}
}
Rectangle {
x: 50
y: 50
width: 50
height: 50
color: "blue"
}
Rectangle {
x: 100
y: 100
width: 50
height: 50
color: "red"
}
}
}
↧