qt4 qml MouseArea

三十三、体验QML演示程序

三十四、Qt Quick Designer介绍

三十五、QML组件

 添加的按钮的qml组件

import QtQuick 1.0

Rectangle {
    width: 100
    height: 62
    id:myButton
    radius: 10;
    color: "blue"
    signal clicked()
    MouseArea{
        id:myMouseArea;
        anchors.fill: parent
        onClicked:myButton.clicked()
     }
}

以上的表示MouseArea收到用户点击即onClicked时会执行myButton.clicked()函数

在mainwondow中添加

Rectangle {
    id:mainWindow
    width: 280
    height: 300
    ...
   
    Button {
        id: button1
        x: 180
        y: 147
        onClicked:mainWindow.state = "状态1"
    }




}

这里相当于重写myButton.clicked()函数，即进入状态1


MouseArea 的一些事件，
在   MouseArea 内部写信号函数 onClicked: {Qt.quit();}

    MouseArea {
        id: mousearea1
        x: 36
        y: 219
        width: 206
        height: 57
        anchors.rightMargin: 38
        anchors.bottomMargin: 24
        anchors.leftMargin: 36
        anchors.topMargin: 219
        anchors.fill: parent
        onClicked: {
            Qt.quit();
        }
    }

直接在State内部写when: myMouseArea.pressed

 State {
            name: "状态1"
            when: myMouseArea.pressed
            PropertyChanges {
                target: text1
                x: 124
                y: 201
                anchors.verticalCenterOffset: 34
                anchors.horizontalCenterOffset: 16
                rotation: 218
                scale: 0.9
                transformOrigin: "Center"
                font.pointSize: 19
            }
...
}