QML 怎么调用 C++ 中的内容？

以下内容为本人的学习笔记，如需要转载，请声明原文链接 微信公众号「ENG八戒」https://mp.weixin.qq.com/s/z_JlmNe6cYldNf11Oad_JQ
先说明一下测试环境


编译器：vs2017x64

开发环境：Qt5.12

这里主要是总结一下，怎么在 QML 文件中引用 C ++ 文件里定义的内容？

很简单，我们可以在 C ++ 文件中通过 QML 引擎（QQmlEngine class）的上下文对象（QQmlContext）调用方法 setContextProperty 设置对应的引用即可。详情看看下面的方法声明：

1. void QQmlContext::setContextProperty(const QString &name, QObject *value);
2. void QQmlContext::setContextProperty(const QString &name, const QVariant &value);

复制代码

可以看到，既可以设置 QObject 类型的对象（指针），也可以设置 QVariant 兼容的类型数据（包括基本类型数据等）到 QML 引擎的上下文中。然后在 QML 中就可以通过引用名 name 直接调用即可。
1. 设置类型数据

1. // main.cpp
2. #include <QDateTime>
3. void main() {
4.     //...
5.     QQmlEngine engine;
6.     QDateTime dateTime = QDateTime::currentDateTime();
7.     engine.rootContext()->setContextProperty("dateTime", &dateTime);
8.     //...
9. }

复制代码

以上代码中直接将 QDateTime 类型的数据设置到引擎上下文中。

1. Rectangle {
2.     id: window
3.     //...
4.     Text {
5.       text: dateTime
6.     }
7. }

复制代码

通过引用名 dateTime 将 C ++ 文件中的数据绑定到组件 Text 的 text 属性上，进而显示出来。
2. 设置对象指针

上面是设置数据，这里设置的是 QObject 类型的指针，所以在 QML 里还可以调用 C ++ 文件中定义的对象，包括属性和方法等。
首先，定义一个 QObject 的派生类 ApplicationData，从 QObject 派生是必须的。

1. // applicationdata.h
2. #include <QObject>
3. #include <QDateTime>
4. #include <QTimer>
6. class ApplicationData : public QObject
7. {
8.     Q_OBJECT
10. public:
11.     ApplicationData(){
12.         QTimer *timer = new QTimer(this);
13.         connect(timer, &QTimer::timeout, this, &ApplicationData::slt_timeout);
14.         timer->start(1000);
15.     }
17.     Q_INVOKABLE QDateTime getCurrentDateTime() const {
18.         return m_currentDateTime;
19.     }
21. signals:
22.     void sig_dataTimeUpdated();
24. private slots:
25.     void slt_timeout() {
26.         m_currentDateTime = QDateTime::currentDateTime();
27.         emit sig_dataTimeUpdated();
28.     }
30. private:
31.     QDateTime m_currentDateTime;
32. };

复制代码

其中 Q_INVOKABLE 用于声明此方法可被元对象系统调用。这个类实现每 1000 ms 刷新内部日期时间属性，并且发射信号 sig_dataTimeUpdated，此属性值可以通过调用定义的公共方法 getCurrentDateTime() 得到。
下面再来定义程序入口文件：

1. // main.cpp
2. #include <QGuiApplication>
3. #include <QQmlApplicationEngine>
4. #include <QQmlContext>
5. #include "applicationdata.h"
7. int main(int argc, char *argv[])
8. {
9.     qputenv("QT_IM_MODULE", QByteArray("qtvirtualkeyboard"));
11.     QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
13.     QGuiApplication app(argc, argv);
15.     QQmlApplicationEngine engine;
16.     ApplicationData data;
17.     engine.rootContext()->setContextProperty("currentDateTime", &data);
18.     engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
19.     if (engine.rootObjects().isEmpty())
20.         return -1;
22.     return app.exec();
23. }

复制代码

在 QML 引擎装载 QML 文件前，先将类 ApplicationData 的对象指针设置到上下文中。
下面再看看怎么调用指针对应的类对象。

1. // main.qml
2. import QtQuick 2.12
3. import QtQuick.Window 2.12
4. import QtQuick.VirtualKeyboard 2.4
6. Window {
7.     id: window
8.     visible: true
9.     title: qsTr("Hello World")
11.     Text {
12.         id: name_id
13.         anchors.centerIn: parent
14.     }
16.     Connections {
17.         target: currentDateTime
18.         onSig_dataTimeUpdated: {
19.             name_id.text = currentDateTime.getCurrentDateTime();
20.         }
21.     }
22. }

复制代码

使用 Connections 连接数据对象 currentDateTime 的信号，当指针对象的信号 sig_dataTimeUpdated 发射出来时，调用方法 getCurrentDateTime() 并用结果设置组件 Text 的属性 text。
显示的效果是动态刷新时间日期数据的，这和在上下文中设置类型数据不同（不会刷新），如下图：

其实在我的另一篇博文《一文入门Qt Quick》中也有对这一块主题的说明，不妨去看看吧！

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！