第一个QML小项目

第一个QML小项目

目的：实现鼠标点击风车，让风车转动90度

程序入口：main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

    return app.exec();
}

main.cpp使用QQmlApplicationEngine引擎加载qml文件

main.qml界面文件:

import QtQuick 2.6
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Image {
        id: root
        source: "images/background.PNG"

        Image {
            id: pole
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 50
            source: "images/pole.PNG"
        }

        Image {
            id: wheel
            anchors.horizontalCenter: parent.horizontalCenter
            source: "images/pinwheel.PNG"
            Behavior on rotation {
                NumberAnimation {
                    duration: 500
                }
            }
        }

        MouseArea {
            anchors.fill: pole
            onClicked: wheel.rotation += 180
        }
    }
}