Qt 之C++与QML交互

概述

QML 是对 JavaScript 的一种扩展，是一种说明性语言，用来描述基于 Qt 对象系统的用户界面。 QML 提供了高可读性的、声明式的、类 Json 的语法，支持结合了动态属性绑定的 JavaScript 表达式。
现在的状态是QML来构建用户UI，C++提供底层逻辑, 比如访问数据库、网络通信、多线程多进程、文件读写、图像处理、音频视频处理等.
所以实际项目中，C++与QML的交互贯穿了项目的始终。本文简单做个总结。

第一种 在 QML 中使用 C++ 类和对象

Qt 提供了两种在 QML 环境中使用 C++ 对象的方式,下面已MyClass来做说明

class MyClass : public QObject
{
    Q_OBJECT
    Q_ENUMS(MyEnum)
    Q_PROPERTY(QColor color READ color WRITE setColor NOTIFY colorChanged)
public:
    MyClass (QObject *parent = 0);
    ~MyClass ();
 
    enum MyEnum{
        RGB,
        YUV,
        NV12
    };
    QColor color() const;
    void setColor(const QColor & color);
    Q_INVOKABLE MyEnum colorType() const;
    Q_INVOKABLE void setColorType(MyEnum );
signals:
    void colorChanged(const QColor & color);
public slots:
    QColor generColor();
private:
    MyEnum m_colortype;
    QColor m_currentColor;
};

1 将C++类注册到 QML 环境中， QML 环境中使用该类型创建对象

qmlRegisterType<ClassName>("zyb.qt.MyClass", 1, 0, "QmlClass");

上面的代码将 ClassName类注册为 QML 类 QmlClass，主版本为 1 ，次版本为 0 ，包名是 zyb.qt.MyClass。注册动作一定要放在 QML 上下文创建之前。
在 QML 中导入 C++ 注册的类型,使用 import 语句

import zyb.qt.MyClass

在 QML 中创建 C++ 导入类型的实例

Rectangle {
    width: 480;
    height: 360;
    QmlClass{
        id: yourid;
        color:"gray"
    }

2 构造一个C++类对象，将这个对象设置为 QML 的上下文属性

viewer.rootContext()->setContextProperty(“myClass”, new QmlClass);
从堆上分配了一个 QmlClass对象，然后注册为 QML 上下文的属性，起了个名字就叫 QmlClass。
viewer.rootContext() 返回的是 QQmlContext 对象。 QQmlContext 类代表一个 QML 上下文，它的 setContextProperty() 方法可以为该上下文设置一个全局可见的属性。要注意的是，你 new 出来的对象， QQmlContext 只是使用，不会帮你删除，你需要自己找一个合适的时机来删除它。
下面例子直接使用了myClass的 槽函数 myClass.generColor()，来产生一个QColor并赋值给了colorRect,将C++对象设置未QML上下文属性后，不需要在import,即可当作全局对象来使用。

Rectangle {
        id: colorRect;
        text: "test";
        width:480
        height:360
		
       MouseArea {
          anchors.fill: parent
          onClicked: { 
          var color =  myClass.generColor();
          colorRect.color = color 
          }
      }
    }

什么样的类才能被QML调用

实现可以导出的 C++ 类

前提条件要想将一个类或对象导出到 QML 中，下列前提条件必须满足：
1 从 QObject 或 QObject 的派生类继承
2 使用 Q_OBJECT 宏
这两个条件即拥有 Qt 的元对象系统（meta-object system）中

QML可以访问c++中的什么类型接口呢？
1. 信号，槽
只要是信号或者槽，都可以在 QML 中访问，你可以把 C++ 对象的信号连接到 QML 中定义的方法上，也可以把 QML 对象的信号连接到 C++ 对象的槽上，还可以直接调用 C++ 对象的槽或信号**

  signals:
    void colorChanged(const QColor & color);
public slots:
    QColor generColor();

2. Q_INVOKABLE 宏
   类的成员函数时使用 Q_INVOKABLE 宏来修饰；比如MyClass的

Q_INVOKABLE MyEnum colorType() const;
Q_INVOKABLE void setColorType(MyEnum );

3. Q_ENUMS
   通过Q_ENUMS宏注册的枚举类型： Q_ENUMS(MyEnum)
4. Q_PROPERTY**
   Q_PROPERTY 宏用来定义可通过元对象系统访问的属性，通过它定义的属性，可以在 QML 中访问、修改，也可以在属性变化时发射特定的信号。要想使用 Q_PROPERTY 宏，你的类必须是 QObject 的后裔，必须在类首使用 Q_OBJECT 宏。
   下面是 Q_PROPERTY 宏的原型：

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

比如MyClass中的

Q_PROPERTY(QColor color READ color WRITE setColor NOTIFY colorChanged)

第二种 ，在 QML 中使用 C++ 类和对象

Qt 最核心的一个基础特性，就是元对象系统，通过元对象系统，你可以查询 QObject 的某个派生类的类名、有哪些信号、槽、属性、可调用方法等等信息，然后也可以使用 QMetaObject::invokeMethod() 调用 QObject 的某个注册到元对象系统中的方法。而对于使用 Q_PROPERTY 定义的属性，可以使用 QObject 的 property() 方法访问属性，如果该属性定义了 WRITE 方法，还可以使用 setProperty() 修改属性。所以只要我们找到 QML 环境中的某个对象，就可以通过元对象系统来访问它的属性、信号、槽等

查找一个对象的孩子

QObject 类的构造函数有一个 parent 参数，可以指定一个对象的父亲， QML 中的对象其实借助这个组成了以根 item 为父的一棵对象树。
而 QObject 定义了一个属性 objectName ，这个对象名字属性，就可以用于查找对象。现在该说到查找对象的方法了： findChild() 和 findChildren() 。它们的函数原型如下

T QObject::findChild(const QString & name = QString(),\
    Qt::FindChildOptions options = \
    Qt::FindChildrenRecursively) const;
QList<T> QObject::findChildren(const QString & name = \
    QString(), Qt::FindChildOptions options = \
Qt::FindChildrenRecursively) const;
QList<T> QObject::findChildren(const QRegExp & regExp, \
    Qt::FindChildOptions options = \
    Qt::FindChildrenRecursively) const;
QList<T> QObject::findChildren(const QRegularExpression & re,\
     Qt::FindChildOptions options = \
     Qt::FindChildrenRecursively) const;

都是模板方法，一个返回单个对象，一个返回对象列表。我们先以 Qt Widgets 为例来说明。
示例 1 ：

QPushButton *button = parentWidget->findChild<QPushButton *>("button1");

查找 parentWidget 的名为 “button1” 的类型为 QPushButton 的孩子。
示例 2 ：

QList<QWidget *> widgets = parentWidget.findChildren<QWidget *>("widgetname");

返回 parentWidget 所有名为 “widgetname” 的 QWidget 类型的孩子列表。

使用元对象调用一个对象的方法
QMetaObject 的 invokeMethod() 方法用来调用一个对象的信号、槽、可调用方法。它是个静态方法，其函数原型如下：

bool QMetaObject::invokeMethod(QObject * obj, const char * member, Qt::ConnectionType type, QGenericReturnArgument ret, QGenericArgument val0 = QGenericArgument( 0 ), QGenericArgument val1 = QGenericArgument(), QGenericArgument val2 = QGenericArgument(), QGenericArgument val3 = QGenericArgument(), QGenericArgument val4 = QGenericArgument(), QGenericArgument val5 = QGenericArgument(), QGenericArgument val6 = QGenericArgument(), QGenericArgument val7 = QGenericArgument(), QGenericArgument val8 = QGenericArgument(), QGenericArgument val9 = QGenericArgument()) [static]

其实 QMetaObject 还有三个 invokeMethod() 的重载函数
返回 true 说明调用成功。返回 false ，要么是因为没有你说的那个方法，要么是参数类型不匹配。
第一个参数是被调用对象的指针。
第二个参数是方法名字。
第三个参数是连接类型，看到这里你就知道， invokeMethod 为信号与槽而生，你可以指定连接类型，如果你要调用的对象和发起调用的线程是同一个线程，那么可以使用 Qt::DirectConnection 或 Qt::AutoConnection 或 Qt::QueuedConnection ，如果被调用对象在另一个线程，那么建议你使用 Qt::QueuedConnection 。
第四个参数用来接收返回指。
然后就是多达 10 个可以传递给被调用方法的参数。嗯，看来信号与槽的参数个数是有限制的，不能超过 10 个。
对于要传递给被调用方法的参数，使用 QGenericArgument 来表示，你可以使用 Q_ARG 宏来构造一个参数，它的定义是：
QGenericArgument Q_ARG( Type, const Type & value)

返回类型是类似的，使用 QGenericReturnArgument 表示，你可以使用 Q_RETURN_ARG 宏来构造一个接收返回指的参数，它的定义是：
QGenericReturnArgument Q_RETURN_ARG( Type, Type & value)
用法如下，假设一个对象有这么一个槽 compute(QString, int, double) ，返回一个 QString 对象，那么你可以这么调用（同步方式）：

QString retVal;
QMetaObject::invokeMethod(obj, "compute", Qt::DirectConnection,
                          Q_RETURN_ARG(QString, retVal),
                          Q_ARG(QString, "sqrt"),
                          Q_ARG(int, 42),
                          Q_ARG(double, 9.7));

如果你要让一个线程对象退出，可以这么调用（队列连接方式）：

QMetaObject::invokeMethod(thread, "quit"， Qt::QueuedConnection);

示例
现在让我们创建一个新的项目，名字是 callQML ，添加 changeColor.h 、 changeColor.cpp 两个文件。 main.qml 内容如下：

import QtQuick 2.0
import QtQuick.Controls 1.1
 
Rectangle {
    objectName: "rootRect";
    width: 360;
    height: 360;
    Text {
        objectName: "textLabel";
        text: "Hello World";
        anchors.centerIn: parent;
        font.pixelSize: 26;
    }
 
    Button {
        anchors.right: parent.right;
        anchors.rightMargin: 4;
        anchors.bottom: parent.bottom;
        anchors.bottomMargin: 4;
        text: "quit";
        objectName: "quitButton";
    }
}

我们给根元素起了个名字 “rootRect” ，给退出按钮起了个名字 “quitButton” ，给文本起了名字 “textLabel” ，我们会在 C++ 代码中通过这些个名字来查找对应的对象并改变它们。
main.cpp ：

#include 
#include "qtquick2applicationviewer.h"
#include 
#include "changeColor.h"
#include 
#include 
#include 
#include 
 
int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);
 
    QtQuick2ApplicationViewer viewer;
    viewer.setMainQmlFile(QStringLiteral("qml/callQml/main.qml"));
    viewer.showExpanded();
 
    QQuickItem * rootItem = viewer.rootObject();
    new ChangeQmlColor(rootItem);
    QObject * quitButton = rootItem->findChild<QObject*>("quitButton");
    if(quitButton)
    {
        QObject::connect(quitButton, SIGNAL(clicked()), &app, SLOT(quit()));
    }
 
    QObject *textLabel = rootItem->findChild<QObject*>("textLabel");
    if(textLabel)
    {
        //1. failed call
        bool bRet = QMetaObject::invokeMethod(textLabel, "setText", Q_ARG(QString, "world hello"));
        qDebug() << "call setText return - " << bRet;
        textLabel->setProperty("color", QColor::fromRgb(255,0,0));
        bRet = QMetaObject::invokeMethod(textLabel, "doLayout");
        qDebug() << "call doLayout return - " << bRet;
    }
 
    return app.exec();
}