如何在C++代码中连接QML代码中的信号

在QML应用设计中，C++在很多的时候作为一个语言来为应用做一些需要计算或拓展QML功能的选项．在今天的例程中，我们来介绍如何连接QML代码中的信号．具体更多的阅读，可以参阅文章＂Interacting with QML Objects from C++＂．

为了说明问题的方便，我们还是来贴上我们的代码：

myclass.h

#ifndef MYCLASS_H
#define MYCLASS_H

#include <QObject>
#include <QQuickItem>
#include <QDebug>

class MyClass : public QObject
{
    Q_OBJECT
public:
    MyClass(QObject *parent = 0);

public slots:
    // This is a slot for QString only
    void cppSlot(const QString &msg) {
        qDebug() << "Called the C++ slot with message:" << msg;
    }

    // This is the slot for a generic data type
    void cppSlotForGenericData(const QVariant &v) {
        qDebug() << "Called the C++ slot with value:" << v;

        QQuickItem *item = qobject_cast<QQuickItem*>(v.value<QObject*>());
        qDebug() << "Item dimensions:" << item->width() << item->height();
    }
};

#endif // MYCLASS_H

在这里，我们定义了两个slots．第一个slot是用来接受一个QString来作为参数的．第二个slot是用一个通用的QVariant来作为参数，也即它可以用任何一个类型的数据来传人，包括第一种情况．具体关于QML的基本数据类型，可以参阅文章＂ QML Basic Types＂．

main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQuickView>
#include <QQuickItem>

#include "myclass.h"

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

    QQuickView view;
    view.setSource(QUrl(QStringLiteral("qrc:///Main.qml")));
    view.setResizeMode(QQuickView::SizeRootObjectToView);

    QObject *item = view.rootObject();
    MyClass myClass;

    // Connect a QString data type slot
    QObject::connect(item, SIGNAL(qmlSignal(QString)),
                     &myClass, SLOT(cppSlot(QString)));

    // Connect a generic slot
    QObject::connect(item, SIGNAL(qmlSignalGeneric(QVariant)),
                         &myClass, SLOT(cppSlotForGenericData(QVariant)));

    view.show();
    return app.exec();
}

在上面的代码中，我们把view的rootObject，也即我们下面即将讲到的MainView，连到我们定义的两个signal:

    signal qmlSignal(string msg)
    signal qmlSignalGeneric(var anObject)

我们的Main.qml设计也非常简单：

Main.qml

import QtQuick 2.0
import Ubuntu.Components 1.1

/*!
    \brief MainView with a Label and Button elements.
*/

MainView {
    id: main

    // objectName for functional testing purposes (autopilot-qt5)
    objectName: "mainView"

    // Note! applicationName needs to match the "name" field of the click manifest
    applicationName: "connectiontoqmlsignal.liu-xiao-guo"

    /*
     This property enables the application to change orientation
     when the device is rotated. The default is false.
    */
    //automaticOrientation: true

    // Removes the old toolbar and enables new features of the new header.
    useDeprecatedToolbar: false

    signal qmlSignal(string msg)
    signal qmlSignalGeneric(var anObject)

    width: units.gu(60)
    height: units.gu(85)

    Page {
        id: page
        title: i18n.tr("connectiontoqmlsignal")

        Column {
            anchors.fill: parent
            spacing: units.gu(2)

            Button {
                width: parent.width
                text: i18n.tr("Send signal to C++!")

                onClicked: {
                    main.qmlSignal("Hello from QML!")
                }
            }

            Button {
                width: parent.width
                text: "Send a generic data to C++"

                onClicked: {
                    main.qmlSignalGeneric(main)
                }
            }
        }
    }
}

运行我们的应用：

应用的输出：

QML debugging is enabled. Only use this in a safe environment.
Loading module: 'libubuntu_application_api_touch_mirclient.so.3.0.0'
Called the C++ slot with message: "Hello from QML!"
Called the C++ slot with value: QVariant(QObject*, Main_QMLTYPE_46(0xdebec0, name = "mainView") )
Item dimensions: 540 919

整个项目的源码在： https://github.com/liu-xiao-guo/connectiontoqmlsignal