QtQuick 系列教程之 QML 与 C++ 交互

时间:2022-06-05
本文章向大家介绍QtQuick 系列教程之 QML 与 C++ 交互,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

QML 作为一种灵活高效的界面开发语言已经越来越得到业界的认可。QML 负责界面,C++ 负责逻辑,这也是 Qt 官方推荐的开发方式。那么 QML 与 C++ 的交互必然是需要我们掌握并且精通的。

本文将详细介绍 QML 与 C++ 的几种交互方式,以及在项目中的实际应用方法。通过实际的例子来实现,体验并且应用这几种交互方式,为我们后续的产品开发提供便利。

将分 4 大部分讲解:

  1. C++ 对象注册到 QML,QML 访问 C++ 对象;
  2. QML 暴露对象给 C++ 进行交互;
  3. C++ 创建 QML 对象并进行交互;
  4. C++ 对象与 QML 通过信号槽交互。

通过本 Chat 的阅读和交流,您将了解熟悉 QML 与 C++ 的交互方式,并且从中获得改造提升自身项目代码结构或者获得交互上的解惑顺利完成项目。

目录:

方式1:C++ 对象注册到元对象系统

QQmlApplicationEngine::rootContext()->setContextProperty()

方式2:C++ 对象注册到Qml系统

qmlRegisterType()
qmlRegisterSingletonType()

方式3:C++ 创建/获取Qml对象

QQmlComponent::create()QQmlApplicationEngine::rootObjects()[0]->findChild<QObject*>()

本博文技术等级: ★★☆☆☆☆☆☆☆☆Qml 与 C++ 间的数据类型((http://gitbook.cn/books/5acf2d97573c31562789c16a/index.html#title12)

系列文章总目录传送(https://blog.csdn.net/zhengtianzuo06/article/details/79796798)

方式1 :C++ 对象注册到元对象系统

首先我们新建一个工程。

刚创建好就是这样的,不会创建的读者可以翻看我前几篇教程。

然后我们新建一个 C++ 的类,然后就可以通过 C++ 的类和 main.qml 这界面进行交互了。

首先,右键工程,选择添加新文件...

选择 C++ Class

类名我们就随便写一个,QmlCpp。下面 Base class 基类我们选择 QObject,Include QObject 会被自动勾上。然后填写头文件名,源文件名。

这样就成功的添加了一个 C++ 的类进来。

下面重点来了, 我们对当前的 C++ 类进行改造,增加两个函数, 一个函数用来保存整型,一个函数用来读取整型。

细心的读者应该发现了函数定义的前面多了一个 Q_INVOKABLE。

我们来看看官网是怎么描述的: Q_INVOKABLE(http://doc.qt.io/qt-5/qobject.html#Q_INVOKABLE)

从第一句可以看出来,这个宏是将函数申明为元对象系统可调用的函数。QtQuick 也在元对象系统内,所以也就可以访问这个函数了。

接下来我们继续实现:

这里有偷懒的办法,头文件里写好函数后,直接调用重构的功能,自动生成函数的实现结构。

是不是很方便,然后在头文件里添加一个整型成员变量。

然后我们直接在函数中添加我们的实现代码:

C++ 类的代码就写的差不多了,接下来我们需要将这个 C++ 类注册到 Qml 中。

打开 main.cpp:

在 Qml 引擎实例的下面,添加代码:

这时候我们会发现 Qml 引擎的上下文没法显示出方法,原来是没有 include,我们添加一下:

接着我们继续注册:

可以看出来, 这里需要填写注册的名称和对象指针。

我们将 QmlCpp 的头文件引用进来,然后定义一个 QmlCpp 类的实例,调用设置整型的函数,并将这个 C++ 实例注册到 Qml 引擎上下文中标示为 “QmlCpp” 的名字, 这样 Qml 中就可以通过 QmlCpp 来访问这个 C++ 实例。

下面我们来改造 Qml 代码

Qml 中添加一个 button,按下事件添加代码 QmlCpp.getValue(); 通过这个代码来获取 C++ 实例中那个被保存的整型数据。