QML与C++集成

QML与C++集成

Qt，QML，Qt QuickQML与C++集成

QML应用经常要处理一些更高级和性能敏感的以C++ 中处理的任务。处理这个场景最常用和最快的方法是将继承自QObject的，且带有实现的 C++ 类暴露给QML运行时。假定你装了Qt 5.7 或更高版本，以下一步一步的操作将教给你在QML中使用BackEnd这一C++ 类的过程。
1、在Qt Creator中使用"Qt Quick Application" 模板来创建一个新的工程

2、为工程添加名为BackEnd的新的C++ 类，并替换头文件内容：

#ifndef BACKEND_H
#define BACKEND_H

#include <QObject>
#include <QString>
#include <qqml.h>

class BackEnd : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QString userName READ userName WRITE setUserName NOTIFY userNameChanged)
    QML_ELEMENT

public:
    explicit BackEnd(QObject *parent = nullptr);

    QString userName();
    void setUserName(const QString &userName);

signals:
    void userNameChanged();

private:
    QString m_userName;
};

#endif // BACKEND_H

Q_PROPERTY宏声明了一个可以从QML访问的属性。宏QML_ELEMENT使得类BackEnd 可以在QML中访问。

3、在工程文件中添加以下几行：

CONFIG += qmltypes
QML_IMPORT_NAME = io.qt.examples.backend
QML_IMPORT_MAJOR_VERSION = 1

BackEnd将自动注册为可在QML中访问类型，但需要导入URL："io.qt.examples.backend 1.0"。

4、替换backend.cpp内容：

#include "backend.h"

BackEnd::BackEnd(QObject *parent) :
    QObject(parent)
{
}

QString BackEnd::userName()
{
    return m_userName;
}

void BackEnd::setUserName(const QString &userName)
{
    if (userName == m_userName)
        return;

    m_userName = userName;
    emit userNameChanged();
}

每当m_userName的值改变时，setUserName函数发出userNameChanged信号。这个信号可以被在QML中的onUserNameChanged函数来处理。

5、用以下内容替换main.qml中的代码 ：

import QtQuick 2.6
import QtQuick.Controls 2.0
import io.qt.examples.backend 1.0

ApplicationWindow {
    id: root
    width: 300
    height: 480
    visible: true

    BackEnd {
        id: backend
    }

    TextField {
        text: backend.userName
        placeholderText: qsTr("User name")
        anchors.centerIn: parent

        onEditingFinished: backend.userName = text
    }
}

当TextField的文本改变时，BackEnd实例允许访问userName属性，以改变其值。
现在程序可以运行了.

Qt 提供几种方法来集成C++ 和QML，本文中所讨论的只是其中一种。更多方法，可以参考QML与C++ 集成概览