我的第一个qml程序

根据<<Qt Cadaques>>第四页的例子，用qml实现一个纸风车放到绿地背景下。文中描述不甚详尽，这里给一个step-by-step的例子，从建立工程开始，尽量把细节交代清楚。

目录

建立工程

新建qml文件

添加qrc资源

qml嵌入MainWindow

其他

效果

---

 

建立工程

建立一个普通的c++工程即可，内含一个mainwindow.h/.cpp文件，可以不要ui文件

pro文件添加如下

QT       += core gui quick qml

新建qml文件

在“新建文件”对话框中选择"QML(Qt Quick 2)"

 

注意下面的代码

anchors.fill: parent

假如没有这句话，窗体缩放时，绿地和风车的图片不会随之变化大小。

import QtQuick 2.0

Image {
    source: "background.bmp"
    anchors.fill: parent
    Image {
        anchors.centerIn: parent
        source: "pinwheel.bmp"
    }
}

添加qrc资源

这里要注意，新建qrc文件时，prefix要设置为/，否则后面的程序可能找不到qml路径。将两幅图片和qml添加到资源中去。

qml嵌入MainWindow

#include "mainwindow.h"
#include <QtQuick/QQuickView>
#include <QDebug>


MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    QQuickView *view = new QQuickView();
    QWidget * pWgt = QWidget::createWindowContainer(view, nullptr);//不能用this.假如用了this,pWgt的大小不会随mainwindow缩放
    setCentralWidget(pWgt);//必须有这句，否则pWgt的大小不会随mainwindow缩放
    view->setSource(QUrl("qrc:/windmill.qml")); // Fetch this url by right clicking on your resource file.
}

MainWindow::~MainWindow()
{

}

关键步骤是QuickView::setSource()，这一步把qml载入了。但是QQuickView不是继承自QWidget，而是来自QWindow，所以它不能直接通过setCentralWidget嵌入QMainWindow,而要通过createWindowContainer先嵌入pWgt，再把pWgt放入主窗口。

其他

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QPainter>

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = 0);
    ~MainWindow();
};

#endif // MAINWINDOW_H

#include "mainwindow.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();

    return a.exec();
}

效果