通俗易懂玩QT：QQuickWidget学习

通俗易懂玩QT：QQuickWidget学习

因为项目需求，需要将 qml 实现的瓦片地图嵌入 mainwindow 中，以便于实现数据库存取数据，特意学习了一下，这里分享给大家。

一、使用 QQuickWidget 在 QMainWindow 中嵌入 QML

QQuickWidget 是 QT 中专门用于将 qml 实现的窗口界面嵌入 QWidget 或 QMainWindow 的控件，使用也比较方便，这里分享两种方法将 QML 窗口嵌入 QWidget 或 QMainWindow 中。

方法一：在 ui 文件中嵌入

1. 打开新建工程的 .ui 文件：

   

2. 在左边的列表框中找到 Display Widget 下的

   元素（最下面一个），将其拖入右边的窗体中：

   

3. 讲一个写好的 qml 文件包含至工程中：

   

4. 给 QQuickWidget 对象引入 qml 文件的地址：

   

5. 点击运行会报错，原因是缺少模块，打开 .pro 文件，引入 quickwidgets 模块：

//引入前
QT       += core gui
//引入后
QT       += core gui quickwidgets

6. 再次点击运行，效果图如下：

   

方法二：使用代码嵌入

1. 打开 .pro 文件，引入 quickwidgets 模块：

QT       += core gui quickwidgets

2. 在头文件中引入 QQuickWidget 控件：

#include <QtQuickWidgets>

3. 在 MainWindow 中新建并初始化一个 QQuickWidget 控件：

QQuickWidget* widget = new QQuickWidget(this);

4. 为 QQuickWidget 控件设置加载资源：

widget -> setSource(QUrl("qrc:BDYQml.qml"));

5. 点击运行，效果图如下：

   

二、使用 C++ 与嵌入窗口中的 QML 交互数据

使用 C++ 向嵌入窗口中的 QML 传递数据

//使用以下方式可向 qml 传递数据，在 qml 中直接使用 obj 即可
widget -> rootContext() -> setContextProperty(obj, value);

使用 C++ 获取嵌入窗口中的 QML 的对象

//使用以下方式可获取 qml 对象，并以 QQuickItem* 格式返回
QQuickItem* qmlItem = widget -> rootObject();

三、注意事项

1. 嵌入窗体的 qml 对象不能使用 QtQuick.Controls 中的 ApplicationWindow 对象，否则该 qml 无法嵌入；
2. 将要嵌入的 qml 文件放置 qrc 中，以便调用，否则大型项目有时引入使用的是绝对地址，具有比较差的移植功能；
3. 使用 QQuickWidget 控件需要在 pro 文件中引入 quickwidgets 模块；
4. 使用 C++ 向嵌入窗口中的 QML 传递数据时，需要在 setSource 之前，虽然不会影响正常运行，但是会报错。
5. 使用 C++ 获取嵌入窗口中的 QML 的对象时，需要在 setSource 之后，虽然不会影响正常运行，但是会报错（本条为推测，没有亲自测试过）。

学习分享，一起成长！接触QT的时间不长，有不足之处，欢迎大佬指出来，我会进行更正。有问题可以发送邮件至 ，不定时上线查收。