集成QML和C++

Integrating QML and C++

集成QML和C++

QML applications often need to handle more advanced and performance-intensive tasks in C++. The most common and quickest way to do this is to expose the C++ class to the QML runtime, provided the C++ implementation is derived from QObject. Assuming that you have Qt 5.7 or later installed, the following step-by-step instructions guide you through the process of using the C++ class, BackEnd, in a QML application:

​QML应用程序通常需要在C++中处理更高级和性能密集型的任务。最常见和最快速的方法是将C++类公开给QML运行时，前提是C++实现派生自QObject。假设已安装Qt 5.7或更高版本，以下分步说明将指导您完成在QML应用程序中使用C++类BackEnd的过程：

1.Create a new project using the "Qt Quick Application" template in Qt Creator

1.使用Qt Creator中的“Qt Quick Application”模板创建新项目

Note: Uncheck the With ui.qml file option in the Define Project Details section of New Project Wizard.

注意：新建项目向导的“定义项目详细信息”部分中，取消选中带ui.qml文件选项。

2.Add a new C++ class called BackEnd to the project and replace its header file contents with:

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

The Q_PROPERTY macro declares a property that could be accessed from QML. The QML_ELEMENT macro makes the BackEnd class available in QML.

Q_PROPERTY宏声明可以从QML访问的属性。QML_ELEMENT宏使后端类在QML中可用。

3.Add the following lines to your project file:

3.在项目文件中添加以下行：

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

The BackEnd class is automatically registered as a type, which is accessible from QML by importing the URL, "io.qt.examples.backend 1.0".

BackEnd类自动注册为类型，可以通过导入URL“io.qt.examples.BackEnd 1.0”从QML访问该类型。

4.Replace the contents of backend.cpp with:

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

The setUserName function emits the userNameChanged signal every time m_userName value changes. The signal can be handled from QML using the onUserNameChanged handler.

每次m_userName值更改时，setUserName函数都会发出userNameChanged信号。可以使用onUserNameChanged处理器从QML处理信号。

5.Replace the contents of main.qml with the following code:

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
    }
}

The BackEnd instance lets you access the userName property, which is updated when the TextField's text property changes.

​后端实例允许您访问userName属性，该属性在TextField的text属性更改时更新。

Now the application can be run.

现在可以运行应用程序了。

Application running on Ubuntu

在Ubuntu上运行的应用程序

Qt offers several methods to integrate C++ with QML, and the method discussed in this tutorial is just one of them. For more details about these methods, refer to Overview - QML and C++ Integration.

​Qt提供了几种将C++与QML集成的方法，本教程中讨论的方法只是其中之一。有关这些方法的更多详细信息，请参阅概述-QML和C++集成。

© 2022 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.