QML学习十三：QML与C++交互之C++端发送信号绑定QML端

若该文为原创文章，转载请注明原文出处

本篇记录下C++端发送的信号是如何绑定QML端的，通过学习，对QML端发送信号绑定C++端有所了解，绑定的方式有三个，项目实际使用的是connect,这个也是我在项目中最常用到的。

那C++端发送的一个信号，在QML如何绑定并接收处理呢？

注：此工程延续文章使用的工程QML学习十二：QML与C++交互之QML端发送信号绑定C++端_殷忆枫的博客-CSDN博客。

C++端发送信号绑定QML端方法一

一、创建函数

在qml端创建一个函数以便访问,功能很简单，打印信号传递过来的参数。

 二、创建信号

在C++端创建一个cppSig信号，当QML调用这个信号时，就可以连接函数。

 三、信号连接

1、QML发送信号

 通过Connections来连接，编译运行，会打印日记，表明，发送信号有过在C++返回。

通过QML发送给C++触发信号，那边信号如何在C++端触发呢？

2、C++端发送信号

1）、修改myobject.cpp，里面有个自定义的func() 函数，在函数里增加发送信号

 2）、调用访问，修改main.qml,直接调用函数func()来发送C++端的信号

四、完整代码 

1、myobject.h

#ifndef MYOBJECT_H
#define MYOBJECT_H
 
#include <QObject>
#include <QtQml>
 
 
class MyObject : public QObject
{
    Q_OBJECT
 
//    QML_ELEMENT
 
    Q_PROPERTY(int iValue READ iValue WRITE setIValue NOTIFY iValueChanged)
    Q_PROPERTY(QString sString READ sString WRITE setSString NOTIFY sStringChanged)
 
public:
    explicit MyObject(QObject *parent = nullptr);
 
    static MyObject *getInstance();
 
    Q_INVOKABLE void func();
 
    int iValue() const;
    void setIValue( int newIValue);
 
    QString sString() const;
    void setSString(const QString &newSString);
 
public slots:
    void cppSlot(int i, QString s);
 
private:
    int m_iValue;
    QString m_sString;
 
signals:
    void iValueChanged();
    void sStringChanged();

    void cppSig(QVariant i, QVariant s);
 
 
};
 
#endif // MYOBJECT_H

2、myobject.cpp

#include "myobject.h"
 
MyObject::MyObject(QObject *parent) : QObject(parent)
{
}
 
MyObject *MyObject::getInstance()
{
    static MyObject *obj = new MyObject();
 
    return obj;
}
 
int MyObject::iValue() const
{
    return m_iValue;
}
 
void MyObject::setIValue(int newIValue)
{
    if(newIValue == m_iValue)
        return ;
    m_iValue = newIValue;
    emit iValueChanged();
}
 
QString MyObject::sString() const
{
    return m_sString;
}
 
void MyObject::setSString(const QString &newSString)
{
    if(m_sString == newSString)
        return ;
    m_sString = newSString;
    emit sStringChanged();
}
 
void MyObject::cppSlot(int i, QString s)
{
    qDebug() << __FUNCTION__ << "  " << i << "  " << s;
}
 
void MyObject::func()
{
    emit cppSlot(103, "xiaoli");
    qDebug() << __FUNCTION__;
}

3、main.qml

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
 
import MyObj 1.0
 
 
Window {
    id: window
    visible: true
    width: SCREEN_WIDTH
    height: 480
    objectName: window
    title: qsTr("Hello World")
 
    signal qmlSig(int i, string s)

    function qmlSlot(i, s) {
        console.log("qml", i, s")
    }
 
    Button {
        onClicked: {
            //myobj.cppSig(99, "lisi")
            myobj.func();
        }
    }
 
    MyObject {
        id: myobj
    }
 
    Connections {
        target: myboj
        function onCppSig(i, s) {
            qmlSlot(i, s)
        }
    }
 
}
 

编译，运行后，结果都是相同的，不在展示。

直接访问C++端的函数，不通过创建myobj对像

在上面的的例子里，访问函数通过在qml端创建了一个名为myobj的对象，如果去掉，要如何访问函数？

注册qmlRegisterType<MyObject>("MyObj", 1, 0, "MyObject");使用qmlRegisterType就一定要通过创建对象来定义一个自定义的object。在项目如何每个都单独注册，那会造成程序臃肿等，QT提供了另一种方式来调用，即qmlRegisterSignletonInstance支持创建一个全局的单例模式。

比如：

通过上面的注册，就可以直接通过MyObject来访问。

一、完整代码

1、main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>
#include "myobject.h"
 
int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
 
    QGuiApplication app(argc, argv);
 
    app.setOrganizationName("myApp");
 
    QQmlApplicationEngine engine;
    QQmlContext *context = engine.rootContext();
    context->setContextProperty("SCREEN_WIDTH", 800);
 
//    MyObject obj;
//    context->setContextProperty("MyObject", &obj);
 
//    context->setContextProperty("MyObject", MyObject::getInstance());
 
    qmlRegisterType<MyObject>("MyObj", 1, 0, "MyObject");

    qmlRegisterSingletonInstance("MyObj", 1, 0, "MyObject", MyObject::getInstance());
    
    const QUrl url(QStringLiteral("qrc:/main.qml"));
 
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);
    engine.load(url);
 
    // engine 加载完成后 load以后
    auto list = engine.rootObjects();
    auto window = list.first();
    QObject::connect(window, SIGNAL(qmlSig(int, QString)),
                     MyObject::getInstance(), SLOT(cppSlot(int, QString)));
 
    return app.exec();
}

2、main.qml

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
 
import MyObj 1.0
 
Window {
    id: window
    visible: true
    width: SCREEN_WIDTH
    height: 480
    objectName: window
    title: qsTr("Hello World")
 
    signal qmlSig(int i, string s)

    function qmlSlot(i, s) {
        console.log("qml", i, s")
    }
 
    Button {
        onClicked: {
            //myobj.cppSig(99, "lisi")
            MyObject.func();
        }
    }

    Connections {
        target: MyObject
        function onCppSig(i, s) {
            qmlSlot(i, s)
        }
    }
}
 

编译运行，结果相同，在实际项目，正常是使用单例模式来注册。

C++端发送信号绑定QML端方法二

在上面的代码中，使用的是Connections来连接，当然我们也可以使用connect来连接

如何连接，其他相当的简单：

一、完整代码

1、main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>
#include "myobject.h"
 
int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
 
    QGuiApplication app(argc, argv);
 
    app.setOrganizationName("myApp");
 
    QQmlApplicationEngine engine;
    QQmlContext *context = engine.rootContext();
    context->setContextProperty("SCREEN_WIDTH", 800);
 
//    MyObject obj;
//    context->setContextProperty("MyObject", &obj);
 
//    context->setContextProperty("MyObject", MyObject::getInstance());
 
    qmlRegisterType<MyObject>("MyObj", 1, 0, "MyObject");

    qmlRegisterSingletonInstance("MyObj", 1, 0, "MyObject", MyObject::getInstance());
    
    const QUrl url(QStringLiteral("qrc:/main.qml"));
 
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);
    engine.load(url);
 
    // engine 加载完成后 load以后
    auto list = engine.rootObjects();
    auto window = list.first();
    QObject::connect(window, SIGNAL(qmlSig(int, QString)),
                     MyObject::getInstance(), SLOT(cppSlot(int, QString)));

    QObject::connect(MyObject::getInstance(), SIGNAL(cppSig(int, QString)),
                     window, SLOT(qmlSlot(int, QString)));
 
    return app.exec();
}

2、main.qml

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12
 
import MyObj 1.0
 
Window {
    id: window
    visible: true
    width: SCREEN_WIDTH
    height: 480
    objectName: window
    title: qsTr("Hello World")
 
    signal qmlSig(int i, string s)

    function qmlSlot(i, s) {
        console.log("qml", i, s")
    }
 
    Button {
        onClicked: {
            //myobj.cppSig(99, "lisi")
            MyObject.func();
        }
    }

//    Connections {
//        target: MyObject
//        function onCppSig(i, s) {
//            qmlSlot(i, s)
//        }
//    }
 
}

编译测试，结果依旧相同，打印信息。

总结

1、QML调用C++端，对应的参数类型，都是QVariant.

2、项目中，使用的是单例模式。

如有侵权，请及时联系博主删除，VX：18750903063文章来源地址https://www.toymoban.com/news/detail-401429.html

到了这里，关于QML学习十三：QML与C++交互之C++端发送信号绑定QML端的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！