PinchArea and Zoom in QMl

beemaneni

Hi friends,

I need some guidance on the pinchArea and zoom.i loaded an image on the window and a small circle on it at the center..using pinchArea i need to pinch and zoom that circle so that the image gets zoomed in..i am struggling to complete this task..please help me with some code...here my code is as follows:

@ property url sepImage: "qrc:/Images/CircuitBoard.png"
Flickable {
id: flick
anchors.fill: parent

    Image {
        anchors.fill: parent
        source: sepImage
        fillMode: Image.PreserveAspectCrop
    }

    Rectangle {
        id: pinchrect
        width: 100
        height: 100
        radius: 50
        color :"transparent"
        border.color: "blue"
        border.width: 2

        MouseArea {
            id: mousearea
            anchors.fill: parent
            drag.target: pinchrect
            drag.axis:  Drag.XAndYAxis
            drag.minimumX: 0
            drag.minimumY: 0
            drag.maximumX: flick.width - pinchrect.width
            drag.maximumY: flick.height - pinchrect.height
        }
    }
     PinchArea {
        id: pinchArea
        pinch.target: mousearea
        onPinchStarted: {
                     // i need to do something here to complete task..
        }
        onPinchFinished: {               
                     // i need to do something here to complete task..bq. 
        }@

p3c0

Hi,

Have a look at "this":http://qt-project.org/doc/qt-5/qtquick-demos-photosurface-example.html#handling-pinch-gestures example.

beemaneni

hi
Thank u so much..that was very much helpful..But in that example insite the rectangle an image is put and used pinch and drag...That was working for me...But my reuirement is on the image i need to draw one circle and up on the drag and pinch of that circle only an image has to be zoomed..

Thanks for ur help :-)

p3c0

So how about setting pinch.target to that circle.

beemaneni

if i do that only that circle gets enlarged..i could not zoom image

p3c0

Well then i guess using onPinchStarted or onPinchUpdated you get pinch.scale and set it to the Image's scale property.

beemaneni

Well i will try that and meantime can we set pinch.target for 2 objects

p3c0

No i guess, last one will override.