qml: handle mouse event

The default Hello World code generated in Qt Creator Project Wizard handle mouse click on the whole window, to quit the program. In this example code, we will handle mouse event on the Image only. When mouse over the Image, the Image will be mirrored. Once mouse click on the Image, it quit the program by calling Qt.quit().

qml: handle mouse event

import QtQuick 2.0

Rectangle {
    width: 360
    height: 360
    Text {
        text: qsTr("Hello World: " + parent.width + " x " + parent.height)
        anchors.centerIn: parent
    }
    Image {
        id: myimage
        source: "http://goo.gl/J4xj0"
        mirror: mouseArea.containsMouse ? true : false
        MouseArea {
            id: mouseArea
            anchors.fill: parent
            hoverEnabled: true
            onClicked: Qt.quit()
        }
    }

}