目录
- 1 QML与C++交互基础
- 1.1 全局属性
- 1.2 属性私有化(提供接口访问)
- 2 QT与C++交互(C++创建自定义对象,qml文件直接访问)
- 3 QT与C++交互(qml直接访问C++中的函数)
- 4 QT与C++交互(qml端发送信号 C++端实现槽函数)
- 3.1 在qml端实现信号和槽的绑定(两种方式)
- 3.2 在cpp端实现信号和槽的绑定
- 5 QT与C++交互(cpp端发送信号 qml端实现槽函数)
- 1 qml端连接信号和槽函数
- 1 cpp端连接信号和槽函数
- 6 QT与C++交互(创建全局单例子对象)
- 7 C++端直接调用QML端函数
注意:QML使用C++创建自定义对象,均需要进行注册,QML才能进行访问
注册方式一:使用qmlRegisterType
模板实现,在main.cpp中加入如下代码(见章节2例程):
//mian.cpp
#include <QQmlEngine>
#include <QQmlContext>
#include <QQmlComponent>
//注册自定义对象qmlRegisterType<类名>("MyObj",1,0,"类名");
//
类名{id:
}
其次QML文件中需要导入包:
import MyObj 1.0
这种方式实现一定需要通过创建对象来自定义一个object 就是qml文件中需要下面这样创建一个对象
注册方式二:使用qmlRegisterSingletonInstance
创建单例子对象,qml可以直接通过类名访问类成员和方法,注册方式首先在main.cpp中加入如下代码(见章节4例程):
#include <QQmlEngine>
#include <QQmlContext>
qmlRegisterSingletonInstance("MyObj",1,0,"类名",类对象);
//其中类对象可以通过单例模式获取
1 QML与C++交互基础
1.1 全局属性
下面通过C++端设置全局属性可以被qml直接访问(相当于C++全局变量)
//main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include<QQmlContext>int main(int argc, char *argv[])
{
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endifQGuiApplication app(argc, argv);QQmlApplicationEngine engine;//全局对象 上下文对象QQmlContext* context = engine.rootContext();//设置全局属性(qml可以直接使用)context->setContextProperty("SCREEN_WISTH",200);//窗口宽度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);return app.exec();
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15Window {width: SCREEN_WISTH//全局属性height: 480visible: truetitle:qsTr("Hello World")
}
1.2 属性私有化(提供接口访问)
默认qml属性是公用化的,其他qml文件可以任意访问
//MyRectangle.qml
import QtQuick 2.15
import QtQuick.Controls 2.5
Rectangle {property int testValue:100width:200height:100color:"black"
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15Window {width: 480height: 480visible: truetitle:qsTr("Hello World")//可访问MyRectangle文件属性MyRectangle{Component.onCompleted: {console.log(testValue)}}
}
下面对属性进行私有化并且提供访问属性的接口,由于qml未直接提供私有化private
关键字,需要依赖QtObject
实现。
//MyRectangle.qml
import QtQuick 2.15
import QtQuick.Controls 2.5
Rectangle {width:200height:100color:"black"property alias attr:attributes//别名(暴露接口)QtObject{id:attributesproperty int testValue:100//私有化,外部无法直接访问}
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15Window {width: 480//全局属性height: 480visible: truetitle:qsTr("Hello World")//通过MyRectangle.qml暴露的接口访问属性MyRectangle{Component.onCompleted: {console.log(attr.testValue)//通过别名访问}}
}
2 QT与C++交互(C++创建自定义对象,qml文件直接访问)
创建一个类(注意:必须继承QObject类)
sString() setSString() iValueChanged()等函数鼠标定位到属性,按下ctrl+Enter自动生成
//myobject.h
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);int iValue() const;void setIValue(int newIValue);QString sString() const;void setSString(const QString &newSString);signals:void iValueChanged();//m_iValue属性改变时触发信号void sStringChanged();private://下面两个属性提供给qml端访问 int m_iValue=20;QString m_sString="zhangsan";//此宏实现属性的读取 写入 通知改变等功能Q_PROPERTY(int iValue READ iValue WRITE setIValue NOTIFY iValueChanged FINAL)Q_PROPERTY(QString sString READ sString WRITE setSString NOTIFY sStringChanged FINAL)
};#endif // MYOBJECT_H//myobject.cpp
#include "myobject.h"MyObject::MyObject(QObject *parent): QObject{parent}
{}int MyObject::iValue() const
{return m_iValue;
}void MyObject::setIValue(int newIValue)
{if (m_iValue == newIValue)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();
}
使用qmlRegisterType
注册自定义对象(通常在main.cpp
注册)
//main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include<QQmlContext>
#include "myobject.h" //引入自定义对象头文件int main(int argc, char *argv[])
{
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endifQGuiApplication app(argc, argv);QQmlApplicationEngine engine;//注册自定义对象qmlRegisterType<MyObject>("MyObj",1,0,"MyObject");//MyObject是我们自定义的对象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);return app.exec();
}
使用自定义对象
iValue和sString是对象提供的接口,省略括号
main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {width: 480//全局属性height: 480visible: truetitle:qsTr("Hello World")MyObject{//自定义对象MyObjectComponent.onCompleted: {console.log("iValue:"+iValue)//访问自定义对象属性console.log("sString:"+sString)}}
}
3 QT与C++交互(qml直接访问C++中的函数)
自定义类型中需要直接被qml端访问的函数加入Q_INVOKABLE
关键字修饰即可(注意:需要注册对象 注册方法见章节 2)
//myobject.h
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);//声明函数 加入Q_INVOKABLE关键字,支持被qml直接访问Q_INVOKABLE void fun();
};#endif // MYOBJECT_H//myobject.cpp
#include "myobject.h"
#include <QDebug>
MyObject::MyObject(QObject *parent): QObject{parent}
{}
//定义函数
void MyObject::fun()
{qDebug()<<__FUNCTION__;
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {width: 480//全局属性height: 480visible: truetitle:qsTr("Hello World")//创建对象myobjMyObject{id:myobj}//调用myobj对象的函数Button{onClicked:{myobj.fun();}}
}
4 QT与C++交互(qml端发送信号 C++端实现槽函数)
3.1 在qml端实现信号和槽的绑定(两种方式)
//myobject.h 写槽函数
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);public slots://声明槽函数void cppSlot(QString name,int age);
};#endif // MYOBJECT_H//mybject.cpp
#include "myobject.h"
#include <QDebug>
MyObject::MyObject(QObject *parent): QObject{parent}
{}//定义槽函数
void MyObject::cppSlot(QString name, int age)
{qDebug()<<__FUNCTION__<<name<<":"<<age;
}
//main.qml 发送信号
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {id:windowwidth: 480//全局属性height: 480visible: truetitle:qsTr("Hello World")//定义信号signal qmlSig(string name,int age)//创建对象myobjMyObject{id:myobj}//点击按钮发送信号Button{onClicked:{qmlSig("zhangsan",13)}}//下面两种方式任意选择一种绑定信号的槽函数//连接信号和槽函数方式1// Connections{// target:window// function onQmlSig(name,age){// myobj.cppSlot(name,age)//C++端槽函数// }// }//连接信号的槽函数方式2// Component.onCompleted:{// qmlSig.connect(myobj.cppSlot)// }
3.2 在cpp端实现信号和槽的绑定
//myobject.h
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);//单例模式static MyObject* getInstance(){static MyObject obj;return &obj;}public slots://声明槽函数void cppSlot(QString name,int age);
};#endif // MYOBJECT_H
//myobject.cpp
#include "myobject.h"
#include <QDebug>
MyObject::MyObject(QObject *parent): QObject{parent}
{}//定义槽函数
void MyObject::cppSlot(QString name, int age)
{qDebug()<<__FUNCTION__<<name<<":"<<age;
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {id:windowwidth: 480height: 480visible: trueobjectName:"window"title:qsTr("Hello World")//定义信号signal qmlSig(string name,int age)//创建对象myobjMyObject{id:myobj}//点击按钮发送信号Button{objectName:"mybutton"onClicked:{qmlSig("zhangsan",13)}}
}
需要在main.cpp文件中绑定信号和槽函数(注意必须在load完成之后)
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include<QQmlContext>
#include<QObject>
#include "myobject.h" //引入自定义对象头文件int main(int argc, char *argv[])
{
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endifQGuiApplication app(argc, argv);QQmlApplicationEngine engine;//注册自定义对象qmlRegisterType<MyObject>("MyObj",1,0,"MyObject");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);/**************************************************///必须在load以后进行绑定槽函数auto list = engine.rootObjects();//获取main.qml的所有组件auto window = list.first();//拿到第一个组件(也就是window)//连接信号和槽函数QObject::connect(window,SIGNAL(qmlSig(QString,int)),MyObject::getInstance(),SLOT(cppSlot(QString,int)));/**************************************************/return app.exec();
}
5 QT与C++交互(cpp端发送信号 qml端实现槽函数)
1 qml端连接信号和槽函数
//myobject.h
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);Q_INVOKABLE void func();
signals://信号void cppSig(QString name,int age);
};#endif // MYOBJECT_H//myobject.cpp
#include "myobject.h"
#include <QDebug>
MyObject::MyObject(QObject *parent): QObject{parent}
{}//触发信号
void MyObject::func()
{emit cppSig("zhangsan",20);qDebug()<<__FUNCTION__<<"函数发送cppSig信号";
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {id:windowwidth: 480height: 480visible: trueobjectName:"window"title:qsTr("Hello World")//定义槽函数function qmlSlot(name,age){console.log("qml",name,age)}//创建对象myobjMyObject{id:myobj}//点击按钮调用cpp端函数发送信号Button{objectName:"mybutton"onClicked:{myobj.func()//cpp端函数 会发送信号}}//绑定信号和槽函数Connections{target: myobjfunction onCppSig(name,age){//cpp端的信号qmlSlot(name,age)//qml端的槽函数}}
}
1 cpp端连接信号和槽函数
注意:qml函数参数类型统一为都是QVariant
//myobject.h
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>
#include <QVariant>
class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);//单例模式static MyObject* getInstance(){static MyObject instance;return &instance;}Q_INVOKABLE void func();
signals://信号void cppSig(QVariant name,QVariant age);
};#endif // MYOBJECT_H//myobject.h
#include "myobject.h"
#include <QDebug>
MyObject::MyObject(QObject *parent): QObject{parent}
{}//触发信号
void MyObject::func()
{emit cppSig("zhangsan",20);//发送信号
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {id:windowwidth: 480height: 480visible: trueobjectName:"window"title:qsTr("Hello World")//创建对象myobjMyObject{id:myobj}//定义槽函数function qmlSlot(name,age){//参数类型 对应CPP端 都是QVariantconsole.log("qml",name,age)}//点击按钮调用cpp端函数发送信号Button{objectName:"mybutton"onClicked:{myobj.func()//cpp端函数 会发送信号}}
}
6 QT与C++交互(创建全局单例子对象)
自定义对象使用qmlRegisterType
模板方式注册,每次需要在qml创建对象太繁琐,QT提供了qmlRegisterSingletonInstance
方式创建全局单例子对象,可以在qml文件中直接使用类名而不需要创建对象
//myobject.h
#ifndef MYOBJECT_H
#define MYOBJECT_H#include <QObject>
#include<QVariant>
class MyObject : public QObject
{Q_OBJECT
public:explicit MyObject(QObject *parent = nullptr);//单例模式static MyObject* getInstance(){static MyObject instance;return &instance;}//函数Q_INVOKABLE void func();
};#endif // MYOBJECT_H//myobject.cpp
#include "myobject.h"
#include <QDebug>
MyObject::MyObject(QObject *parent): QObject{parent}
{}//触发信号
void MyObject::func()
{qDebug()<<__FUNCTION__;
}
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5
import MyObj 1.0Window {id:windowwidth: 480height: 480visible: trueobjectName:"window"title:qsTr("Hello World")//点击按钮调用cpp端函数发送信号Button{objectName:"mybutton"onClicked:{MyObject.func()//直接通过类名调用函数,无需创建对象}}
}
//main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include<QQmlContext>
#include<QObject>
#include "myobject.h" //引入自定义对象头文件int main(int argc, char *argv[])
{
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endifQGuiApplication app(argc, argv);QQmlApplicationEngine engine;/***********************创建全局单例子对象********************************/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);return app.exec();
}
7 C++端直接调用QML端函数
//main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.5Window {id:windowwidth: 480height: 480visible: trueobjectName:"window"title:qsTr("Hello World")//待cpp端调用函数function qmlFunc(i,v){return "success"}
}
//main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include<QQmlContext>
#include<QObject>
#include<QDebug>
#include "myobject.h" //引入自定义对象头文件int main(int argc, char *argv[])
{
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endifQGuiApplication app(argc, argv);QQmlApplicationEngine engine;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);/*******************C++端直接调用QML端函数************///拿到qml的window对象auto list = engine.rootObjects();//获取main.qml的所有组件auto window = list.first();//拿到第一个组件(也就是window)//调用函数QVariant res;//用来保存函数的返回值QVariant arg_1=123;//入参1QVariant arg_2="zhangsan";//入参2QMetaObject::invokeMethod(window,"qmlFunc",//qml函数名Q_RETURN_ARG(QVariant,res),//返回值保存Q_ARG(QVariant,arg_1),//函数参数1Q_ARG(QVariant,arg_2));//函数参数2qDebug()<<"res="<<res;//打印返回值/*********************************************/return app.exec();
}