Important: Please read the Qt Code of Conduct -

Methode for incremental Scale (pincharea) of an Image in Qml?

  • Hi, I'm just looking for a method to 'incremental' Scale an Image in Qml. This means

    1. start pinch at Center.x/y and e.g. increase Scale -> Scale/Zoom into Image starting from point with Center.x/y
    2. stop pinch
    3. start next pinch at different Center.x/y and continue with Scale -> Image jumps to another point and continues with Scale.

    The reason for the jump is that Scale always starts with Scaling=1 at current Center.x/y. I need Scale because I use a big Frambufferobject and Flickable leads to new calculation and makes everthing very slow.

    import QtQuick 2.6
    Rectangle {
        id: iTImag
        state: "start"
        anchors.fill: parent
        color: "#343434"
        Image {
            id: iImage
            width: parent.width
            height: parent.height
            source: Imag.url
            sourceSize.width: width
            fillMode: Image.PreserveAspectFit
                Scale {
                	id: iScale
        PinchArea {
            id: iPinchArea
            anchors.fill: parent
            pinch.minimumScale: 1
            pinch.maximumScale: 8
            property real mScale: 1
            onPinchStarted: {
                iScale.xScale = mScale;
                iScale.yScale = mScale;
            onPinchUpdated: {
                iScale.origin.x =;
                iScale.origin.y =;
                mScale += pinch.scale - pinch.previousScale;
                iScale.xScale = mScale;
                iScale.yScale = mScale;

    Does maybe anyone has an idea?

Log in to reply