QML手势及多点触摸之PinchArea

PinchArea

可以参看PinchArea文档。下面是SDK自带的demo。通过此demo可以了解PinchArea的使用。
PinchArea实现了“挤压”操作。
要点：在onPinchStarted、onPinchUpdated、onPinchFinished三个槽函数中，均可以使用一个内置的pinch参数。这个参数是一个PinchEvent实例(instance)。

import QtQuick 1.1

Rectangle {
width: 640
height: 360
color: "gray"

Flickable {
    id: flick
    anchors.fill: parent
    contentWidth: 500
    contentHeight: 500

    PinchArea {
        width: Math.max(flick.contentWidth, flick.width)
        height: Math.max(flick.contentHeight, flick.height)

        property real initialWidth
        property real initialHeight
        onPinchStarted: {
            initialWidth = flick.contentWidth
            initialHeight = flick.contentHeight
        }

        onPinchUpdated: {
            // adjust content pos due to drag
            flick.contentX += pinch.previousCenter.x - pinch.center.x
            flick.contentY += pinch.previousCenter.y - pinch.center.y

            // resize content
            flick.resizeContent(initialWidth * pinch.scale, initialHeight * pinch.scale, pinch.center)
        }

        onPinchFinished: {
            // Move its content within bounds.
            flick.returnToBounds()
        }

        Rectangle {
            width: flick.contentWidth
            height: flick.contentHeight
            color: "white"
            Image {
                anchors.fill: parent
                source: "qt-logo.jpg"
                MouseArea {
                    anchors.fill: parent
                    onDoubleClicked: {
                        flick.contentWidth = 500
                        flick.contentHeight = 500
                    }
                }
            }
        }
    }
}
}

其他不再赘述。很简单。

QML手势及多点触摸之PinchArea