Creating C++ Plugins for QML | Qt QML 6.4.1

- Qt 6.4
- Qt QML
- Creating C++ Plugins for QML
- Qt 6.4.1 Reference Documentation

# Creating C++ Plugins for QML

## Creating a Plugin

The QML engine loads C++ plugins for QML. Such plugins are usually provided in a QML extension module, and can provide types for use by clients in QML documents that import the module. A module requires at least one registered type to be considered valid.

QQmlEngineExtensionPlugin is a plugin interface that lets you create QML extensions that can be loaded dynamically into QML applications. These extensions allow custom QML types to be made available to the QML engine.

To write a QML extension plugin:

1. Subclass QQmlEngineExtensionPlugin and use the Q_PLUGIN_METADATA() macro to register the plugin with the Qt meta object system.
2. Use the QML_ELEMENT and QML_NAMED_ELEMENT() macros to declare QML types.
3. Configure your build file.

   CMake:

        qt_add_qml_module(<target>
            URI <my.import.name>
            VERSION 1.0
            QML_FILES <app.qml>
            NO_RESOURCE_TARGET_PATH
        )

   qmake:

        CONFIG += qmltypes
        QML_IMPORT_NAME = <my.import.name>
        QML_IMPORT_MAJOR_VERSION = <version>

4. If you're using qmake, create a qmldir file to describe the plugin. Note that CMake will, by default, automatically generate the qmldir file.

QML extension plugins are for either application-specific or library-like plugins. Library plugins should limit themselves to registering types, as any manipulation of the engine's root context may cause conflicts or other issues in the library user's code.

Note: When using the CMake qt_add_qml_module API, a plugin will be generated automatically for you. It will take care of type registration. You only need to write a custom plugin if you have special requirements, such as registering custom image providers. In that case, pass NO_GENERATE_PLUGIN_SOURCE to the `qt_add_qml_module` call to disable the generation of the default plugin.

The linker might erroneously remove the generated type registration function as an optimization. You can prevent that by declaring a synthetic volatile pointer to the function somewhere in your code. If your module is called "my.module", you would add the forward declaration in global scope:

     void qml_register_types_my_module();

Then add the following snippet of code in the implementation of any function that's part of the same binary as the registration:

     volatile auto registration = &qml_register_types_my_module;
     Q_UNUSED(registration);

## TimeExample QML Extension Plugin

Suppose there is a new `TimeModel` C++ class that should be made available as a new QML type. It provides the current time through `hour` and `minute` properties. It declares a QML type called `Time` via QML_NAMED_ELEMENT().

     class TimeModel : public QObject
     {
         Q_OBJECT
         Q_PROPERTY(int hour READ hour NOTIFY timeChanged)
         Q_PROPERTY(int minute READ minute NOTIFY timeChanged)
         QML_NAMED_ELEMENT(Time)
         ...

To make this type available, create a plugin class named `QExampleQmlPlugin`, which is a subclass of QQmlEngineExtensionPlugin. It uses the Q_PLUGIN_METADATA() macro in the class definition to register the plugin with the Qt meta object system using a unique identifier for the plugin.

     class QExampleQmlPlugin : public QQmlEngineExtensionPlugin
     {
         Q_OBJECT
         Q_PLUGIN_METADATA(IID QQmlEngineExtensionInterface_iid)
     };

## Build Settings for the Plugin

The build file defines the project as a plugin library, specifies it should be built into the `imports/TimeExample` directory, and registers the plugin target name.

### Using CMake:

     set(qml_files
         imports/TimeExample/Clock.qml
     )

     set(images
         imports/TimeExample/center.png
         imports/TimeExample/clock.png
         imports/TimeExample/hour.png
         imports/TimeExample/minute.png
     )
     qt_add_qml_module(qmlqtimeexample
         OUTPUT_DIRECTORY imports/TimeExample
         VERSION 1.0
         URI "TimeExample"
         SOURCES timemodel.cpp timemodel.h
         QML_FILES ${qml_files}
         RESOURCES ${images}
     )

### Using qmake:

     TEMPLATE = lib
     CONFIG += qt plugin qmltypes
     QT += qml

     QML_IMPORT_NAME = TimeExample
     QML_IMPORT_MAJOR_VERSION = 1

     DESTDIR = imports/$$QML_IMPORT_NAME
     TARGET  = qmlqtimeexampleplugin

     SOURCES += qexampleqmlplugin.cpp

This registers the `TimeModel` class, with the import `TimeExample 1.0`, as a QML type called `Time`. The Defining QML Types from C++ article has more information about registering C++ types for usage in QML.

## Plugin Definition in the qmldir

Finally, a qmldir file is required in the `imports/TimeExample` directory to describe the plugin and the types that it exports. The plugin includes a `Clock.qml` file along with the `qmlqtimeexampleplugin` that is built by the project.

CMake will, by default, automatically generate this file. For more information, see Auto-generating qmldir and typeinfo files.

When using qmake, specify the following in the `qmldir` file:

     module TimeExample
     Clock 1.0 Clock.qml
     plugin qmlqtimeexampleplugin

To make things easier for this example, the TimeExample source directory is in `imports/TimeExample`, and we build in-source. However, the structure of the source directory is not important, as the `qmldir` file can specify paths to installed QML files.

What is important is the name of the directory that the qmldir is installed into. When the user imports our module, the QML engine uses the module identifier (`TimeExample`) to find the plugin, so the directory in which it is installed must match the module identifier.

Once the project is built and installed, the new `Time` component is accessible by any QML component that imports the `TimeExample` module.

     import TimeExample // import types from the plugin

     Clock { // this class is defined in QML (imports/TimeExample/Clock.qml)

         Time { // this class is defined in C++ (plugin.cpp)
             id: time
         }

         hours: time.hour
         minutes: time.minute

     }

The full source code is available in the plugins example.

## Reference

- Writing QML Extensions with C++ - contains a chapter on creating QML plugins.
- Defining QML Types from C++ - information about registering C++ types into the runtime.
- How to Create Qt Plugins - information about Qt plugins