Unable to make a custom QML control appear in the Library in Qt Quick designer

giacomos

Hello everyone.
I've just written a simple module that uses a CircularGauge from QtQuick.Extras 1.4 which value changes according to the value calculated by a C++ backend named QmlReaderBackend

class QmlReaderBackend : public QObject
{
Q_OBJECT
Q_PROPERTY(QVariant value READ value NOTIFY valueChanged)
Q_PROPERTY(QVariant min READ min NOTIFY minChanged)
Q_PROPERTY(QVariant max READ max NOTIFY maxChanged)

...

Once the backend had been written, it was easy to write a test QML application, and it worked:

import QtQuick 2.9
import QtQuick.Window 2.2
import QtQuick.Extras 1.4
import QtQuick.Controls.Styles 1.0
import CumbiaQmlControls 1.0

Item {

CircularGauge {

    QmlReaderBackend {
        id: cgbackend2
        source: "$1/long_scalar"
        Component.onCompleted: {
            init(cumbia_poof)
        }
    }

    id: circularGauge
    x: 395
    y: 37
    property QmlReaderBackend backend: cgbackend2;
    maximumValue: backend.max
    minimumValue: backend.min
    style: CircularGaugeStyle {

        function get_color(backend, val) {
            var color = "#000000"
            if(backend.max_alarm !== backend.min_alarm && (
                        val >= backend.max_alarm || val <= backend.min_alarm))
                color = "red"
            else if(backend.max_warning !== backend.min_warning &&
                    (val >= backend.max_warning || val <= backend.min_warning) )
                color = "orange"

            console.debug("color: ", color)
            return color
        }

        tickmarkStepSize: (circularGauge.maximumValue - circularGauge.minimumValue) / 10;

        tickmarkLabel:  Text {
            font.pixelSize: Math.max(6, outerRadius * 0.1)
            text: styleData.value
            color: get_color(circularGauge.backend, styleData.value)
            antialiasing: true
        }
    }
    value: cgbackend2.value
}

}

With the appropriate QML_IMPORT_PATH in the .pro file, QtCreator recognizes and highlights QmlReaderBackend correctly.

My goal is to use some QtQuick controls, (Gauge, labels, sliders, buttons), customise their style and then connect them to the QmlReaderBackend to perform readings and update the items accordingly.

I would like those controls to be available through the designer within the Qt creator.

Which is the simplest way to go?

Being able to drag and drop the CircularGauge above defined would be already enough.
Somewhere I've read that it is not necessary to write a plugin just to make qml templates available to the QtCreator Library.
As far as I've understood, once the designer finds the module (i.e. the one providing QmlReaderBackend in my case), it should be enough to make it find the custom qml files.

I've placed a qmldir file in the directory QML_IMPORT_PATH like this:

module CumbiaQmlControls
classname CumbiaQmlControlsPlugin
plugin cumbia-qtcontrols-qml-qt5

and there I placed the .qml file above described.

Nothing is displayed by QtCreator designer

Thanks for any hint.