Qt Quick Subscription

Use Qt Quick Controls to create an application that can subscribe to MQTT topics.

Article lu fois.

L'auteur

The Qt Company Ltd.

L'article

Publié le 27 décembre 2024 - Mis à jour le 27 décembre 2024

Liens sociaux

Qt Quick Subscription▲

Qt Quick Subscription demonstrates how to register QMqttClient as a QML type and use it in a Qt Quick application.

https:// does not provide a QML API in its current version. However, you can make the C++ classes of the module available to QML.

Creating a Client▲

Connect to QMqttSubscription::messageReceived( ) to receive all messages sent to the broker:

Sélectionnez

QmlMqttSubscription::QmlMqttSubscription(QMqttSubscription *s, QmlMqttClient *c)
    : sub(s)
    , client(c)
{
    connect(sub, &amp;QMqttSubscription::messageReceived, this, &amp;QmlMqttSubscription::handleMessage);
    m_topic = sub-&gt;topic();
}

Create a QmlMqttClient class with the QMqttClient class as a base class:

Sélectionnez

QmlMqttClient::QmlMqttClient(QObject *parent)
    : QObject(parent)
{
    connect(&amp;m_client, &amp;QMqttClient::hostnameChanged, this, &amp;QmlMqttClient::hostnameChanged);
    connect(&amp;m_client, &amp;QMqttClient::portChanged, this, &amp;QmlMqttClient::portChanged);
    connect(&amp;m_client, &amp;QMqttClient::stateChanged, this, &amp;QmlMqttClient::stateChanged);
}

Use the subscribe() function to create a subscription object:

Sélectionnez

QmlMqttSubscription* QmlMqttClient::subscribe(const QString &amp;topic)
{
    auto sub = m_client.subscribe(topic, 0);
    auto result = new QmlMqttSubscription(sub, this);
    return result;
}

Use a QMqttMessage object to store the payload of a received message:

Sélectionnez

void QmlMqttSubscription::handleMessage(const QMqttMessage &amp;qmsg)
{
    emit messageReceived(qmsg.payload());
}

Registering Classes in QML▲

In the main.cpp file, load the QML type Main from the module subscription:

Sélectionnez

    QGuiApplication app(argc, argv);
    QQmlApplicationEngine engine;

    QObject::connect(
            &amp;engine, &amp;QQmlApplicationEngine::objectCreationFailed, &amp;app,
            []() { QCoreApplication::exit(EXIT_FAILURE); }, Qt::QueuedConnection);

    engine.loadFromModule(u"subscription"_s, u"Main"_s);

Now use the MqttClient type in the Main.qml file to create an MQTT client:

Sélectionnez

    MqttClient {
        id: client
        hostname: hostnameField.text
        port: portField.text
    }

List of Files▲

Files:

List of Files▲

quicksubscription/CMakeLists.txt
quicksubscription/Main.qml
quicksubscription/main.cpp
quicksubscription/qmldir
quicksubscription/qmlmqttclient.cpp
quicksubscription/qmlmqttclient.h
quicksubscription/quicksubscription.pro

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants :