C++與QML交互的項(xiàng)目實(shí)踐
更新時(shí)間：2023年09月06日 10:00:10 作者：hsy12342611
本文主要介紹了C++與QML交互的項(xiàng)目實(shí)踐,將詳細(xì)介紹C++與QML的交互方式,包括在QML中調(diào)用C++函數(shù)和在C++中訪(fǎng)問(wèn)QML元素,具有一定的參考價(jià)值,感興趣的可以了解一下
一直對(duì)于QT的理解和使用都停留在主窗口程序和控制臺(tái)程序，雖然QT的新東西QML聽(tīng)過(guò)也接觸過(guò)，但是基本上沒(méi)梳理過(guò)調(diào)用流程。趁著舊項(xiàng)目要使用QML技術(shù)，現(xiàn)在就將C++和QML交互進(jìn)行總結(jié)。
在C++和QML中均可以定義信號(hào)和槽，并且均可以完成信號(hào)和槽的綁定
一. QML中使用C++業(yè)務(wù)類(lèi)
基本流程如下：
1.將C++注冊(cè)進(jìn)入QML引擎，C++類(lèi)型在qml中當(dāng)成一個(gè)子組件使用
2.在qml中完成信號(hào)與槽的綁定
測(cè)試代碼：
1.QML定義
main.qml
import QtQuick 2.7
import QtQuick.Window 2.2
import WorkClass 1.0
Window {
id: root
visible: true
width: 640
height: 480
title: qsTr("Hello World")
signal qmlSignal1
signal qmlSignal2(string strValue, int iValue)
MainForm {
anchors.fill: parent
mouseArea.onClicked: {
Qt.quit();
}
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.LeftButton | Qt.RightButton
onClicked: {
if(mouse.button === Qt.LeftButton){
console.log(' Qt.LeftButton')
bussiness.strValue = "HelloCpp"
bussiness.intValue = 2022
bussiness.sendSignal()
}else{
console.log(' Qt.RightButton')
root.qmlSignal1()
root.qmlSignal2('hesy', 2000)
}
}
}
//加載子頁(yè)面qrcode.qml
//Loader {
// id:accountQRCode
// source:"qrcode.qml"
// x:(root.width - root.height / 3) / 2
// y:root.height / 3
// visible: true
//}
CBusiness{
id: bussiness
property int addpro: 0
onIntValueChanged: {
console.log('qml onIntValueChanged', "begin change addpro ", addpro)
addpro++
console.log('qml onIntValueChanged', addpro)
}
onAddproChanged: {
console.log('qml onAddFun', addpro)
}
}
Component.onCompleted: {
bussiness.onSignal1.connect(function(){console.log('no name qml function')})
bussiness.onSignal2.connect(qmlProcess1)
root.qmlSignal1.connect(bussiness.slot1)
root.qmlSignal2.connect(bussiness.slot2)
console.log('Component.onCompleted')
}
function qmlProcess1(str, value){
console.log('qmlProcess1', str, value)
}
}備注：
另外在qml中也可以使用Connections綁定C++業(yè)務(wù)類(lèi)函數(shù)和qml中的方法，例如 qrcode.qml，其中target:bussiness代表上面的id: bussiness，這樣main.qml中包含qrcode.qml，實(shí)現(xiàn)了qml之間的調(diào)用，以及多個(gè)qml和C++之間的調(diào)用。
import QtQuick 2.0
Item {
Image {
id: qrcode
sourceSize.width: parent.width
sourceSize.height: parent.height
source: ""
}
Text {
id: tips
x: parent.x
y: parent.y
text: qsTr("請(qǐng)掃碼")
font.pixelSize: 24
visible: false
}
Connections {
target:bussiness
onAccountQRCodeGenerated: {
console.log("onAccountQRCodeGenerated invoke !");
qrcode.source = "image://qrcode/account"
}
onAccountScannedSuccess: {
console.log("onAccountScannedSuccess invoke!");
qrcode.visible = false
tips.visible = true
}
onAccountLoginSuccess: {
console.log("onAccountLoginSuccess invoke !");
tips.text = qsTr("登錄成功, 歡迎!")
}
}
}C++中通過(guò)發(fā)射信號(hào)調(diào)用qml中方法，對(duì)應(yīng)方法名為on+大寫(xiě)字母開(kāi)頭函數(shù)
emit accountQRCodeGenerated(); emit accountScannedSuccess(); emit accountLoginSuccess();
2.C++業(yè)務(wù)類(lèi)定義和實(shí)現(xiàn)
cbusiness.h
#ifndef CBUSINESS_H
#define CBUSINESS_H
#include <QObject>
class CBusiness : public QObject
{
Q_OBJECT
Q_PROPERTY(QString strValue READ getStrValue WRITE setStrValue NOTIFY strValueChanged)
Q_PROPERTY(int intValue READ getIntValue WRITE setIntValue NOTIFY intValueChanged)
public:
explicit CBusiness(QObject *parent = 0);
Q_INVOKABLE void sendSignal();
void setStrValue(QString strValue);
QString getStrValue() const;
void setIntValue(int intValue);
int getIntValue() const;
signals:
void signal1();
void signal2(QString strValue, int intValue);
void strValueChanged(QString strValue);
void intValueChanged(int intValue);
public slots:
void slot1();
void slot2(QString strValue, int intValue);
private:
//類(lèi)的屬性
QString m_strValue;
int m_intValue;
};
#endif // CBUSINESS_Hcbusiness.cpp
#include "cbusiness.h"
#include <QDebug>
CBusiness::CBusiness(QObject *parent) : QObject(parent), m_strValue(""), m_intValue(0)
{
}
void CBusiness::sendSignal()
{
qDebug() << "CBusiness::" << __FUNCTION__;
emit signal1();
emit signal2(m_strValue, m_intValue);
}
void CBusiness::setStrValue(QString strValue)
{
qDebug() << "CBusiness::" << __FUNCTION__ << strValue;
m_strValue = strValue;
emit strValueChanged(strValue);
qDebug()<< "CBusiness::" << "emit strValueChanged" << endl;
}
QString CBusiness::getStrValue() const
{
qDebug() << "CBusiness::" << __FUNCTION__;
return m_strValue;
}
void CBusiness::setIntValue(int intValue)
{
qDebug() << "CBusiness::" << __FUNCTION__;
m_intValue = intValue;
emit intValueChanged(intValue);
qDebug()<< "CBusiness::" << "emit intValueChanged";
}
int CBusiness::getIntValue() const
{
qDebug() << "CBusiness::" << __FUNCTION__;
return m_intValue;
}
void CBusiness::slot1()
{
qDebug() << "CBusiness::" << __FUNCTION__;
}
void CBusiness::slot2(QString strValue, int intValue)
{
qDebug() << "CBusiness::" << __FUNCTION__;
qDebug() << "CBusiness:: " << strValue << " " << intValue;
}3.主調(diào)函數(shù)
main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include "cbusiness.h"
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
//qmlRegisterType注冊(cè)C++類(lèi)型至QML
//arg1:import時(shí)模塊名
//arg2:主版本號(hào)
//arg3:次版本號(hào)
//arg4:QML類(lèi)型名
qmlRegisterType<CBusiness>("WorkClass", 1, 0, "CBusiness");
QQmlApplicationEngine engine;
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
if (engine.rootObjects().isEmpty())
return -1;
return app.exec();
}4.測(cè)試結(jié)果
鼠標(biāo)左鍵點(diǎn)擊：
說(shuō)明：
信號(hào)和槽的綁定在qml中完成，鼠標(biāo)左鍵按下，首先打?。簈ml: Qt.LeftButton
bussiness.strValue = "HelloCpp" 觸發(fā) CBusiness::setStrValue（
因?yàn)槿缦拢?/p>
Q_PROPERTY(QString strValue READ getStrValue WRITE setStrValue NOTIFY strValueChanged)
此處= "HelloCpp" 其實(shí)是調(diào)用的setStrValue
）調(diào)用
bussiness.intValue = 2022觸發(fā)CBusiness::setIntValue（
因?yàn)槿缦拢?/p>
Q_PROPERTY(int intValue READ getIntValue WRITE setIntValue NOTIFY intValueChanged)
此處= 2022其實(shí)是調(diào)用的setIntValue
）調(diào)用， 然后調(diào)用emit strValueChanged(strValue);，觸發(fā)qml中 onIntValueChanged調(diào)用，接著addpro++觸發(fā)onAddproChanged調(diào)用
最后調(diào)用CBusiness::sendSignal()，觸發(fā)emit signal1(); emit signal2(m_strValue, m_intValue);信號(hào)，調(diào)用qml的槽
function(){console.log('no name qml function')和
function qmlProcess1(str, value)
鼠標(biāo)右鍵點(diǎn)擊：
說(shuō)明：
鼠標(biāo)右鍵，通過(guò)qml信號(hào)調(diào)用到c++的槽函數(shù)，并且還傳遞參數(shù)給c++
二.C++使用QML
基本流程如下：
1.在C++中獲得qml對(duì)象指針
2.在C++中完成信號(hào)和槽的綁定
測(cè)試代碼：
1.QML定義
main.qml
import QtQuick 2.7
import QtQuick.Window 2.2
Item {
id: root
visible: true
width: 640
height: 480
//title: qsTr("Hello World")
property string msg: "I am QML Item"
signal callCpp(string arg1, string arg2)
MainForm {
anchors.fill: parent
mouseArea.onClicked: {
Qt.quit();
}
}
Rectangle {
anchors.fill: parent
color: "blue"
objectName: "rect"
}
MouseArea {
anchors.fill: parent
onClicked: {
console.log("onClicked, callCpp")
root.callCpp(root.msg, "notify cpp")
}
}
onHeightChanged: {
console.log("onHeightChanged execute")
}
onWidthChanged: {
console.log("onWidthChanged execute")
}
//QML中的方法可以被cpp調(diào)用，也可以作為槽函數(shù)
function qmlFun(val_arg) {
console.log("qmlFun execute", val_arg, "return qmlFun_return_result")
return "qmlFun_return_result"
}
//注意槽函數(shù)參數(shù)為var類(lèi)型
function invokeFromCpp(arg1, arg2) {
console.log("invokeFromCpp execute ", arg1, arg2)
}
}2.C++業(yè)務(wù)類(lèi)定義和實(shí)現(xiàn)
cbusiness.h
#ifndef CBUSINESS_H
#define CBUSINESS_H
#include <QObject>
class CBusiness : public QObject
{
Q_OBJECT
public:
explicit CBusiness(QObject *parent = 0);
signals:
void callQml(const QVariant &arg1,const QVariant &arg2);
public slots:
void invokeFromQml(const QString &arg1,const QString &arg2);
};
#endif // CBUSINESS_Hcbusiness.cpp
#include "cbusiness.h"
#include <QDebug>
CBusiness::CBusiness(QObject *parent) : QObject(parent)
{
}
void CBusiness::invokeFromQml(const QString &arg1,const QString &arg2)
{
qDebug() << "CBusiness::" << __FUNCTION__ << arg1 << arg2;
qDebug() << "CBusiness::" << __FUNCTION__ << " emit callQml";
emit callQml("I am cpp", "notify qml");
}3.主調(diào)函數(shù)
main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlProperty>
#include <QQuickView>
#include <QQuickItem>
#include <QMetaObject>
#include <QDebug>
#include "cbusiness.h"
int main(int argc, char *argv[])
{
QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
QGuiApplication app(argc, argv);
/*
可以用QQmlComponent\QQuickView\QQuickWidget的C++代碼加載QML文檔
當(dāng)使用QQuickView時(shí)，qml的根不能是Window
*/
QQuickView view(QUrl("qrc:/main.qml"));
view.show();
// 獲取到qml根對(duì)象的指針
QObject *qmlObj = view.rootObject();
/*
修改qml屬性值的方法
QObject::setProperty() QQmlProperty QMetaProperty::write()
*/
// 通過(guò)QObject設(shè)置屬性值
qDebug() << "cpp: " << "set qml property height";
QQmlProperty(qmlObj, "height").write(500); //qmlObj->setProperty("height",500);
// 通過(guò)QObject獲取屬性值
qDebug() << "cpp: " << "get qml property height" << qmlObj->property("height").toDouble();
// C++訪(fǎng)問(wèn)qml的其它屬性
qDebug() << "cpp: " << "get qml property msg" << qmlObj->property("msg").toString();
// 獲取QQuickItem
QQuickItem *item = qobject_cast<QQuickItem*>(qmlObj);
// 通過(guò)QQuickItem設(shè)置屬性值
qDebug() << "cpp: " << "set qml property width";
item->setWidth(300);
// 通過(guò)QQuickItem獲取屬性值
qDebug() << "cpp: " << "get qml property width" << item->width();
// 通過(guò)object name訪(fǎng)問(wèn)加載的QML對(duì)象
// QObject::findChildren()可用于查找具有匹配object name屬性的子項(xiàng)
QObject *qmlRect = qmlObj->findChild<QObject*>("rect");
if(qmlRect)
{
qDebug() << "cpp: " << "get rect color" << qmlRect->property("color");
}
// C++調(diào)用QML方法
QVariant valReturn;
QVariant valArg = "I am cpp";
//Q_RETURN_ARG()和Q_Arg()參數(shù)必須制定為QVariant類(lèi)型
QMetaObject::invokeMethod(qmlObj, "qmlFun",
Q_RETURN_ARG(QVariant,valReturn),
Q_ARG(QVariant,valArg));
qDebug() << "cpp: " << "QMetaObject::invokeMethod result" << valReturn.toString(); //qml函數(shù)中返回“ok”
CBusiness cppObj;
// cpp和qml信號(hào)與槽關(guān)聯(lián)
// qml信號(hào)綁訂cpp的槽，用QString類(lèi)型
QObject::connect(qmlObj, SIGNAL(callCpp(QString, QString)), &cppObj, SLOT(invokeFromQml(QString, QString)));
//關(guān)聯(lián)cpp信號(hào)與qml槽
// cpp的信號(hào)綁定qml槽，用QVariant類(lèi)型
QObject::connect(&cppObj, SIGNAL(callQml(QVariant, QVariant)), qmlObj, SLOT(invokeFromCpp(QVariant, QVariant)));
return app.exec();
}4.測(cè)試結(jié)果
信號(hào)和槽的綁定在c++代碼中完成，在c++中可以修改qml的屬性，獲取qml的屬性，調(diào)用qml的方法，傳遞和獲取參數(shù)均可以
鼠標(biāo)點(diǎn)擊
鼠標(biāo)點(diǎn)擊后，通過(guò)qml的信號(hào)callCpp調(diào)用c++的槽函數(shù)invokeFromQml，然后再通過(guò)c++的信號(hào)函數(shù)callQml調(diào)用qml的槽函數(shù)invokeFromCpp
三.QVariant中方法canConvert和convert使用總結(jié)
1.canConvert只是報(bào)告QVariant進(jìn)行兩個(gè)類(lèi)型之間轉(zhuǎn)換的能力，例如QString和Int類(lèi)型之間的轉(zhuǎn)換，關(guān)注類(lèi)型
2.convert判斷的是QVariant進(jìn)行兩個(gè)類(lèi)型的數(shù)據(jù)之間轉(zhuǎn)換的能力，例如“123”和123之間的轉(zhuǎn)換，關(guān)注數(shù)據(jù)
舉例：
QString str1 = "Qt5.7.0"; QVariant var1 = str1; qDebug() << var1.canConvert(QVariant::Int); // true qDebug() << var1.convert(QVariant::Int); // false qDebug() << var1.toString(); // "0" var1 = str1; qDebug() << var1.convert(QVariant::String); // true qDebug() << var1.toString(); // "Qt5.7.0" QString str2 = "789"; QVariant var2 = str2; qDebug() << var2.canConvert(QVariant::Int); // true qDebug() << var2.convert(QVariant::Int); // true qDebug() << var2.toString(); // "789"
到此這篇關(guān)于C++與QML交互的項(xiàng)目實(shí)踐的文章就介紹到這了,更多相關(guān)C++ QML交互內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了VSCode C++多文件編譯的簡(jiǎn)單使用方法,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-03-03
這篇文章主要介紹了C++Fstream文件流與freopen重定向教程，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-02-02
在現(xiàn)實(shí)中，我們做數(shù)學(xué)題總會(huì)遇到階乘問(wèn)題，這在計(jì)算機(jī)中也不例外。 那我們應(yīng)該怎么實(shí)現(xiàn)呢？下面小編就為大家講解一下C語(yǔ)言中階乘的實(shí)現(xiàn)2022-07-07
這篇文章主要介紹了C++對(duì)數(shù)組的引用實(shí)例分析,需要的朋友可以參考下2014-08-08
C語(yǔ)言實(shí)現(xiàn)電子英漢詞典系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了C語(yǔ)言實(shí)現(xiàn)電子英漢詞典系統(tǒng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-06-06
這篇文章主要介紹了C語(yǔ)言程序的編譯與預(yù)處理,包括介紹了C和C++混合編程的情況,需要的朋友可以參考下，希望能夠給你帶來(lái)幫助2021-10-10
resharper安裝教程是關(guān)于vs2012一個(gè)非常好用的插件的安裝教程,建議大家嘗試安裝，今天通過(guò)本教程幫助大家學(xué)習(xí)ReSharper 的安裝使用詳細(xì)教程，感興趣的朋友一起看看吧2021-06-06
本文詳細(xì)講解了Socket通信原理和實(shí)踐，文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-01-01
C語(yǔ)言實(shí)現(xiàn)紙牌計(jì)算24點(diǎn)小游戲
這篇文章主要為大家詳細(xì)介紹了C語(yǔ)言實(shí)現(xiàn)紙牌計(jì)算24點(diǎn)小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-10-10
C/C++ Qt QThread線(xiàn)程組件的具體使用
QThread庫(kù)是QT中提供的跨平臺(tái)多線(xiàn)程實(shí)現(xiàn)方案，本文詳細(xì)的介紹了Qt QThread線(xiàn)程組件的具體使用，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-11-11