QML与C++交互

Qt 你好 | 专注于Qt的技术分享平台

QML写界面,业务逻辑使用C++,既能快速的开发界面也能利用C++的强大生态,这是目前比较被认可的方式,那就涉及到QML与C++对象的交互。

我们以登录例子来说明,页面点击登录,将信息传递到c++ http对象进行密码的验证,然后返回登录结果。

一,调用C++中的函数

1,普通C++类

复制代码
#ifndef HTTPHANDLER_H
#define HTTPHANDLER_H

#include <QObject>
class HTTPHandler:public QObject{
    Q_OBJECT
public:
    HTTPHandler(QObject* parent=0):QObject(parent){

    }
    //登录接口 验证用户名 和密码
    Q_INVOKABLE bool login(QString name,QString pwd){
        if(name=="admin"&&pwd=="123"){
            return true;
        }else{
            return false;
        }
    }
};
#endif // HTTPHANDLER_H

2,注册C++ 类

main.cpp注册此 C++ 类型,这样QML中就能使用了。

复制代码
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include "HTTPHandler.h"

int main(int argc, char *argv[])
{
#if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
#endif
    QGuiApplication app(argc, argv);

    //注册类型
    qmlRegisterType<HTTPHandler>("HTTPHandler", 1, 0, "HTTPHandler");


    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);

    return app.exec();
}

3,调用C++对象中的函数

只要是C++中 通过Q_INVOKABLE关键词声明的public函数,QML中都能访问。

复制代码
import QtQuick 2.15
import QtQuick.Controls 1.4
//导入C++ 对象
import HTTPHandler 1.0

Rectangle{
    width: 200
    height: 200

    //相当于 实列化一个C++对象
    HTTPHandler{
        id:httpHandler
    }

    signal loginOk()
    Row{
        anchors.centerIn: parent
        TextField{
            id:name
        }
        TextField{
            id:pwd
        }
    }
    Button{
        anchors.bottom: parent.bottom
        text: qsTr("登录")
        onClicked: {
            //调用C++对象中的函数
            if(httpHandler.login(name.text,pwd.text)){
                loginOk()
            }
        }
    }
}

二,响应C++中的信号

上述方式相当于同步的方式调用C++中的函数,还可以异步的响应C++中的信号,相当于QML中的槽与C++中的信号进行绑定。

1,C++类

复制代码
#ifndef HTTPHANDLER_H
#define HTTPHANDLER_H

#include <QObject>
class HTTPHandler:public QObject{
    Q_OBJECT
public:
    HTTPHandler(QObject* parent=0):QObject(parent){

    }

    Q_INVOKABLE void login(QString name,QString pwd){
        if(name=="admin"&&pwd=="123"){
            //验证成功后 激发信号
            emit loginSuccess();
        }
    }

signals:
    //登录成功信号
    void loginSuccess();
};
#endif // HTTPHANDLER_H

2,响应C++信号

复制代码
import QtQuick 2.15
import QtQuick.Controls 1.4
import HTTPHandler 1.0

Rectangle{
    width: 200
    height: 200

    //相当于 实列化一个C++对象
    HTTPHandler{
        id:httpHandler
        //绑定C++信号
        onLoginSuccess: {
            loginOk()
        }
    }

    signal loginOk()
    Row{
        anchors.centerIn: parent
        TextField{
            id:name
        }
        TextField{
            id:pwd
        }
    }
    Button{
        anchors.bottom: parent.bottom
        text: qsTr("登录")
        onClicked: {
            //调用C++对象中的函数
            httpHandler.login(name.text,pwd.text)

        }
    }
}

三,绑定C++中的属性

还可以直接在C++定义属性,然后QML绑定此属性,适合实时的传递一些状态数据。

1,C++类

复制代码
#ifndef HTTPHANDLER_H
#define HTTPHANDLER_H

#include <QObject>
class HTTPHandler:public QObject{
    Q_OBJECT
    //注册属性
    Q_PROPERTY(QString status READ getStatus WRITE setStatus NOTIFY statusChanged FINAL)

public:
    HTTPHandler(QObject* parent=0):QObject(parent){

    }

    Q_INVOKABLE bool login(QString name,QString pwd){
        if(name=="admin"&&pwd=="123"){
            return true;
        }else{
            //设置状态信息
            setStatus("pwd or name error");
        }
    }

    QString getStatus() const;
    void setStatus(const QString &newStatus);

signals:
    void statusChanged();

private:
    //状态信息
    QString status;
};

inline QString HTTPHandler::getStatus() const
{
    return status;
}

inline void HTTPHandler::setStatus(const QString &newStatus)
{
    if (status == newStatus)
        return;
    status = newStatus;
    emit statusChanged();
}


#endif // HTTPHANDLER_H

2,绑定属性

复制代码
import QtQuick 2.15
import QtQuick.Controls 1.4
import HTTPHandler 1.0

Rectangle{
    width: 200
    height: 200

    //相当于 实列化一个C++对象
    HTTPHandler{
        id:httpHandler
    }

    signal loginOk()
    Row{
        anchors.centerIn: parent
        TextField{
            id:name
        }
        TextField{
            id:pwd
        }
    }

    //定义一个文本框 直接绑定C++的属性
    Text {
        anchors.top: parent.top
        text: httpHandler.status
    }
    Button{
        anchors.bottom: parent.bottom
        text: qsTr("登录")
        onClicked: {
            //调用C++对象中的函数
            if(httpHandler.login(name.text,pwd.text)){
                loginOk()
            }
        }
    }
}

3,看下效果

点击登录 ,如果密码或用户名错误会将C++的状态信息,实时的显示到左上角的QML Text控件中。来这里看(QML与C++交互 | Qt 你好

相关推荐
艾莉丝努力练剑3 小时前
【LeetCode&数据结构】单链表的应用——反转链表问题、链表的中间节点问题详解
c语言·开发语言·数据结构·学习·算法·leetcode·链表
StarRocks_labs4 小时前
StarRocks Community Monthly Newsletter (Jun)
数据库·starrocks·数据湖·物化视图·存算分离
光电的一只菜鸡5 小时前
ubuntu之坑(十五)——设备树
linux·数据库·ubuntu
ob熔天使——武6 小时前
MySQL
数据库·mysql
小光学长6 小时前
基于vue框架的防疫物资仓库管理系统09y38(程序+源码+数据库+调试部署+开发环境)带论文文档1万字以上,文末可获取,系统界面在最后面。
数据库
倔强青铜37 小时前
苦练Python第18天:Python异常处理锦囊
开发语言·python
u_topian7 小时前
【个人笔记】Qt使用的一些易错问题
开发语言·笔记·qt
珊瑚里的鱼8 小时前
LeetCode 692题解 | 前K个高频单词
开发语言·c++·算法·leetcode·职场和发展·学习方法
AI+程序员在路上8 小时前
QTextCodec的功能及其在Qt5及Qt6中的演变
开发语言·c++·qt
xingshanchang8 小时前
Matlab的命令行窗口内容的记录-利用diary记录日志/保存命令窗口输出
开发语言·matlab