1、先看demo

QtCreator自动生成的工程是使用QQmlApplicationEngine来加载qml文件，下面的demo将使用QQuickView来加载qml文件

#include <QGuiApplication>
#include <QtQuick/QQuickView>

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);
    
    QQuickView view;
    view.setSource(QUrl(QLatin1String("qrc:/main.qml")));
    view.setTitle("Hello World");
    view.show();

    return app.exec();
}

setTitle()和show()这两个接口函数是不是很眼熟，没错QQuickView和QWindow的使用方法很相似，其实QQuickView继承自QQuickWindow，而QQuickWindow就是继承自QWindow

QQuickView加载qml文件使用接口函数：setSource()

2、Window元素在QQuickView中不显示

当修改完mian.cpp后，直接运行时有窗口，但是大小和标题不是qml文件中Windowu元素设置的。
原因是：Window元素在QQuickView中不显示。
需要修改qml文件，修改后的qml文件如下：

import QtQuick 2.15
Rectangle {
     id: rect
     width: 640;
     height: 480
     color: "red"
}

运行效果如下：
在这里插入图片描述

3、Window元素必须用在QQmlApplicationEngine中

QQuickView会自动创建根窗口，QQmlApplicationEngine不会自动创建根窗口，因此在使用QQmlApplicationEngine加载的根qml文件中需要使用Window对象为 Qt Quick 场景创建一个新的顶级窗口。此时，QML 拥有窗口的完整控制权，可以直接设置标题、窗口尺寸等属性。

4、 QQuickWidget和QQuickView的区别

QQuickWidget的继承自QWidget，可以直接添加到Qt布局中；
QQuickView继承自QQuickWindow（继承自QWindow），通过转换才能添加到Qt布局中：

QQuickView *view = new QQuickView();
QWidget *widget = QWidget::createWindowContainer(view, this);
view->setSource(QUrl("qrc:/main.qml"));

5、在QML中使用C++

5.1 定义C++类

要想在QML中调用C++类，C++类的定义有一定要求
1）声明：Q_OBJECT
QML使用的是Qt的元对象系统，因此需要在类开头声明：Q_OBJECT

2）修饰函数：Q_INVOKABLE
使用Q_INVOKABLE修饰的成员函数，才能被Qt元对象系统识别；
否则在调用成员函数时报错

TypeError: Property 'xxx' of object xxx is not a function

3）修改枚举：Q_ENUMS
使用Q_ENUMS修饰的枚举，才能被Qt元对象系统识别；

4）定义属性：Q_PROPERTY

Q_PROPERTY(type name
   READ getFunction
   [WRITE setFunction]
   [RESET resetFunction]
   [NOTIFY notifySignal]
   [DESIGNABLE bool]
   [SCRIPTABLE bool]
   [STORED bool]
   [USER bool]
   [CONSTANT]
   [FINAL])

例如：Q_PROPERTY(double testValue READ getTestValue WRITE setTestValue)

5）本例中只展示Q_INVOKABLE的用法

class Class2Qml : public QObject
{
    Q_OBJECT
public:
    explicit Class2Qml(QObject *parent = nullptr);
    Q_INVOKABLE void call(const QString &msg);
};

void Class2Qml::call(const QString &msg)
{
    qDebug() << "Class2Qml, msg = " << msg;
}

5.2 将C++类引入QML中

使用QQuickView::rootContext()->setContextProperty来引入C++类到QML中

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

    Class2Qml c2q;
    QQuickView view;
    view.setSource(QUrl(QLatin1String("qrc:/quickView.qml")));
    view.setTitle("Hello World");
    view.setResizeMode(QQuickView::SizeRootObjectToView);
    view.rootContext()->setContextProperty("c2q", &c2q);
    view.show();
    
    return app.exec();
}

5.3 在QML中使用C++类

在QML中可以通过使用==类名.成员函数名(参数)==的格式来调用即可，完整的QML代码如下

import QtQuick 2.15
import QtQuick.Controls 2.15

Rectangle {
     id: rect
     width: 640;
     height: 480
     color: "red"
     Button {
         id: btn1
         width: 50
         height: 50
         x:100
         y:100
         text:"msg"
         onClicked: {
             c2q.call("quickView Rectangle")
         }
     }
}