Intégration d’objets C++ dans QML à l’aide de propriétés de contexte

Lors du chargement d’un objet QML dans une application C++, il peut s’avérer utile d’intégrer directement des données C++ exploitables depuis le code QML. Cela permet, par exemple, d’appeler une méthode C++ sur l’objet intégré ou d’utiliser une instance d’objet C++ comme modèle de données pour une vue QML.

La classe ` QQmlContext ` permet d’injecter des données C++ dans un objet QML. Cette classe expose les données au contexte d’un objet QML afin que celles-ci puissent être référencées directement depuis la portée du code QML.

Définition d’une propriété de contexte simple

Par exemple, voici un élément QML qui fait référence à une valeur ` currentDateTime ` n'existant pas dans la portée actuelle :

// MyItem.qml
import QtQuick

Text { text: currentDateTime }

Cette valeur ` currentDateTime ` peut être définie directement par l’application C++ qui charge le composant QML, à l’aide de la fonction ` QQmlContext::setContextProperty()` :

QQuickView view;
view.rootContext()->setContextProperty("currentDateTime", QDateTime::currentDateTime());
view.setSource(QUrl::fromLocalFile("MyItem.qml"));
view.show();

Définition d’un objet en tant que propriété de contexte

Les propriétés de contexte peuvent contenir soit des valeurs de type ` QVariant `, soit des valeurs de type ` QObject*`. Cela signifie que des objets C++ personnalisés peuvent également être injectés à l’aide de cette approche, et que ces objets peuvent être modifiés et lus directement en QML. Ici, nous modifions l’exemple ci-dessus pour intégrer une instance de ` QObject ` au lieu d’une valeur de type ` QDateTime `, et le code QML appelle une méthode sur l’instance de l’objet :

class ApplicationData : public QObject
{
    Q_OBJECT
public:
    Q_INVOKABLE QDateTime getCurrentDateTime() const {
        return QDateTime::currentDateTime();
    }
};

int main(int argc, char *argv[]) {
    QGuiApplication app(argc, argv);

    QQuickView view;

    ApplicationData data;
    view.rootContext()->setContextProperty("applicationData", &data);

    view.setSource(QUrl::fromLocalFile("MyItem.qml"));
    view.show();

    return app.exec();
}

// MyItem.qml
import QtQuick

Text { text: applicationData.getCurrentDateTime() }

(Notez que les valeurs de date/heure renvoyées du C++ vers le QML peuvent être formatées à l’aide de Qt.formatDateTime() et des fonctions associées.)

Si l’élément QML doit recevoir des signaux provenant de la propriété contextuelle, il peut s’y connecter à l’aide du type Connections. Par exemple, si ApplicationData dispose d’un signal nommé dataChanged(), ce signal peut être connecté à l’aide d’un gestionnaire onDataChanged au sein d’un objet Connections:

Text {
    text: applicationData.getCurrentDateTime()

    Connections {
        target: applicationData
        onDataChanged: console.log("The application data changed!")
    }
}

Consultez également la documentation « QQmlContext » pour plus d’informations.