柚子快報邀請碼778899分享：QML 與C++交互詳解

http://yzkb.51969.com/

1.思維導圖

2.調(diào)用全局變量

在C++中直接定義全局變量，QML中能夠直接訪問。

使用engine.rootContext()->setContextProperty("WIDTH",300)，設置了一個全局變量WIDTH。

int main(int argc, char *argv[])

{

QGuiApplication app(argc, argv);

QQmlApplicationEngine engine;

engine.rootContext()->setContextProperty("WIDTH",300);

engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

if (engine.rootObjects().isEmpty())

return -1;

return app.exec();

}

QML中直接訪問WIDTH。?

Window {

id: window

visible: true

width: WIDTH

height: 500

title: qsTr("Hello World")

Component.onCompleted: {

console.log(window.width)

}

Button{

width: 100

height: 100

background: {

color:"black"

}

}

}

3.QML中調(diào)用C++類型

自定義一個C++類 MyObject?對象，有兩個成員變量m_value和m_str，分別對應一個set和一個get方法，還有一個信號，

#ifndef MYOBJECT_H

#define MYOBJECT_H

#include

#include

class MyObject : public QObject

{

Q_OBJECT

Q_PROPERTY(int value READ getValue WRITE setValue NOTIFY valueChanged)

Q_PROPERTY(QString str READ getStr WRITE setStr NOTIFY strChanged)

public:

explicit MyObject(QObject *parent = nullptr);

public:

void setValue(int newValue);

int getValue();

void setStr(QString newStr);

QString getStr();

signals:

void valueChanged();

void strChanged();

private:

int m_value;

QString m_str;

};

#endif // MYOBJECT_H

#include "MyObject.h"

MyObject::MyObject(QObject *parent) : QObject(parent)

{

}

void MyObject::setValue(int newValue)

{

if(newValue == m_value)

return;

m_value = newValue;

emit valueChanged();

}

int MyObject::getValue()

{

return m_value;

}

void MyObject::setStr(QString newStr)

{

if(newStr == m_str)

return;

m_str = newStr;

emit strChanged();

}

QString MyObject::getStr()

{

return m_str;

}

然后在main.cpp中注冊一下自定義的類，使用qmlRegisterType方法。

int main(int argc, char *argv[])

{

QGuiApplication app(argc, argv);

QQmlApplicationEngine engine;

qmlRegisterType("MyObject", 1, 0, "MyObject");

engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

if (engine.rootObjects().isEmpty())

return -1;

return app.exec();

}

下面是在QML中調(diào)用的相關代碼。

import MyObject 1.0

Window {

id: window

visible: true

width: 400

height: 500

title: qsTr("Hello World")

MyObject{

value: 10

str: "zhangsan"

onValueChanged: {

}

onStrChanged: {

}

Component.onCompleted: {

console.log(value,str)

}

}

}

下面是 Qt中屬性的參考文檔。

Qt 元對象和屬性系統(tǒng)_qt元對象_Mr.codeee的博客-CSDN博客1.Qt 的元對象系統(tǒng)Qt 的元對象系統(tǒng)（Meta-Object System）提供了對象之間通信的信號與槽機制、運行時類型信息和動態(tài)屬性系統(tǒng)。元對象系統(tǒng)由以下三個基礎組成：QObject 類是所有使用元對象系統(tǒng)的類的基類。在一個類的 private 部分聲明 Q_OBJECT宏，使得類可以使用元對象的特性，如動態(tài)屬性、信號與槽。MOC（元對象編譯器）為每個 QObject 的子類提供必要的代碼來實現(xiàn)元對象系統(tǒng)的特性。構建項目時，MOC 工具讀取 C++ 源文件，當它發(fā)現(xiàn)類的定義里有 Qhttps://blog.csdn.net/wzz953200463/article/details/115497012

4.QML調(diào)用C++中的方法

使用2.QML中調(diào)用C++類型中的類，增加printMsg成員方法，在前面添加Q_INVOKABLE宏，QML中就能夠訪問。

public:

Q_INVOKABLE void printMsg();

以下是在QML中訪問。

Window {

id: window

visible: true

width: 400

height: 500

title: qsTr("Hello World")

MyObject{

id: obj

value: 10

str: "zhangsan"

}

Button{

width: 50

height: 50

background: Rectangle{

color:"red"

}

onClicked: {

obj.printMsg()

}

}

}

5.QML端發(fā)送信號，連接C++端槽函數(shù)

還是使用上面的類，首先在C++中增加一個槽函數(shù)，打印一些信息。

public slots:

void slotMsg(int value,QString name);

//實現(xiàn)

void MyObject::slotMsg(int value,QString name)

{

qDebug()<<__FUNCTION__<<" value = "<

signal sendMsg(int value,string name) //增加信號

MyObject{

id: obj

value: 10

str: "zhangsan"

}

Button{

width: 50

height: 50

background: Rectangle{

color:"red"

}

onClicked: {

sendMsg(2,"zhangsan")

}

}

// Connections{ //信號-槽連接方式一

// target: window

// function onSendMsg(i,s){

// obj.slotMsg(i,s)

// }

// }

Component.onCompleted: { //信號-槽連接方式二

sendMsg.connect(obj.slotMsg)

}

}

我們也可以在C++中連接信號槽，代碼如下。

首先明白一點，engine.rootObjects().first()就是QML中Window對象。

Window {

id: window

objectName: "window"

visible: true

width: 400

height: 500

title: qsTr("Hello World")

}

QQmlApplicationEngine engine;

qmlRegisterType("MyObject", 1, 0, "MyObject");

engine.load(QUrl(QStringLiteral("qrc:/main.qml")));

if (engine.rootObjects().isEmpty())

return -1;

auto objs = engine.rootObjects();

qDebug()<objectName();

打印輸出：

C++中連接信號-槽。

MyObject *myobj = new MyObject();

auto objs = engine.rootObjects();

auto window = objs.first();

qDebug()<objectName();

QObject::connect(window,SIGNAL(sendMsg(int,QString)),

myobj,SLOT(slotMsg(int,QString)));

6.C++端發(fā)送信號，連接QML端

還是使用上面的類，首先在C++中增加一個信號。

signals:

void sigMsg(int value,QString name);

在QML中使用，增加槽函數(shù)slotMsg()，在QML中綁定信號-槽，在QML中觸發(fā)信號。

Window {

id: window

objectName: "window"

visible: true

width: 400

height: 500

title: qsTr("Hello World")

function slotMsg(value,name){ //增加槽函數(shù)

console.log(value,name)

}

MyObject{

id: obj

value: 10

str: "zhangsan"

}

Button{

width: 50

height: 50

background: Rectangle{

color:"red"

}

onClicked: {

obj.sigMsg(2,"zhangsan") //QML中發(fā)送信號

}

}

Connections{ //信號-槽連接方式一

target: obj

function onSigMsg(i,s){

window.slotMsg(i,s)

}

}

}

在C++中綁定信號-槽，在C++中觸發(fā)信號。

MyObject obj;

QObject::connect(window,SIGNAL(sendMsg(int,QString)),

&obj,SLOT(slotMsg(int,QString)));

obj.func(); //C++端觸發(fā)信號

QML中的代碼

Window {

id: window

objectName: "window"

visible: true

width: 400

height: 500

title: qsTr("Hello World")

signal sendMsg(int value,string name) //增加信號

function showMsg(value,name){ //增加槽函數(shù)

console.log("value ",value,name)

}

Button{

width: 50

height: 50

background: Rectangle{

color:"red"

}

onClicked: {

//sendMsg(2,"zhangsan")

}

}

}

7.C++端調(diào)用QML端函數(shù)

在QML端聲明一個函數(shù)

function test(value,name){ //供C++端調(diào)用的函數(shù)

console.log("test ",value,name)

}

C++端直接調(diào)用

QVariant ret;

QVariant arg1 = 123;

QVariant arg2 = "zhangsan";

QMetaObject::invokeMethod(window,"test",Q_RETURN_ARG(QVariant,ret)

,Q_ARG(QVariant,arg1)

,Q_ARG(QVariant,arg2));

8.源碼

相關源碼

柚子快報邀請碼778899分享：QML 與C++交互詳解

http://yzkb.51969.com/

參考鏈接