Setting object type property in QML from C++

Question

(Editted to add more context)

I've started using QML and I'd like to set some sort of reference property on a QML type, linking two QML objects (ideally, without a parent/child relationship as I'd like to connect multiple QML objects).

For example, I have the following files.

qmldir:

A 1.0 A.qml

A.qml

import QtQuick 2.2

Rectangle {
    width: 100
    height: 100
    color: 'red'
    // Other stuff later
}

main.qml:

import QtQuick 2.2
import QtQuick.Window 2.1
import "qrc:/"

Rectangle {
    objectName: "Main window"
    visible: true
    width: 360
    height: 360

    MouseArea {
        anchors.fill: parent
        onClicked: {
            Qt.quit();
        }
    }

    Text {
        text: qsTr("Hello World")
        anchors.centerIn: parent
    }

    property A referencedObject;

    Rectangle {
        id: subView
        objectName: "subView"
    }
}

What I'd like to do with this is set the value of 'referencedObject' to an object created by C++ at runtime. However, the function for setting properties doesn't allow for QObject pointers or QQuickItem pointers, as QVariant objects can't be constructed that way.

Something like:

QQmlComponent aTemplate(&engine, QString("qrc:/A.qml"), &parentObject);
QQuickItem* aInstance = aTemplate.create();

aInstance->setParent(&parentObject);
mainView.setProperty("referencedObject",aInstance); // Won't work.

I'd like to keep the 'A' type object in QML because a) less boilerplate than C++ for this, and b) its meant to be a separate graphical object with life of its own, and QML works better for that use-case.

Thanks for any help posted.

Programmer Programmer · Accepted Answer · 2014-09-01T16:19:30

The following example shows how to set properties of objects of your custom type defined in QML from C++.

A.qml

import QtQuick 2.2
Rectangle {
    width: 0
    height: 0
    color:"red"
}

main.qml

import QtQuick 2.2  
Rectangle {
    visible: true
    width: 640
    height: 480

    property alias referencedObject:aProperty;

    A
    {
        id:aProperty
        objectName: "aPropertyObject"//Needed to access it from C++
    }
}

Now we have defined a qml type A. main.qml has a property of this Custom type. We need to change properties of this object from C++. Lets change the width,height and color.

main.cpp

#include <QApplication>
#include <QQmlApplicationEngine>
#include <QQuickView>
#include <QQuickItem>
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);

    QQmlApplicationEngine engine;
    QQmlComponent aTemplate(&engine, QUrl(("qrc:///A.qml")));
    QQuickItem* aInstance =qobject_cast<QQuickItem*>(aTemplate.create());
    aInstance->setWidth(100);
    aInstance->setHeight(100);
    aInstance->setProperty("color",QColor("green"));
    if(aInstance)
    {
        QQuickView *mainView = new QQuickView;
        mainView->setSource(QUrl(QStringLiteral("qrc:///main.qml")));
        mainView->show();
        QQuickItem * aPropertyObject = mainView->rootObject()->findChild<QQuickItem*>("aPropertyObject");
        if(aPropertyObject)
        {
           //Now you have pointers to both source and destination.
           //You can write a helper function which assigns the values
           //of source to the destination.
           //For the sake of demonstration, I am just setting some properties.       
           aPropertyObject->setWidth(aInstance->width());
           aPropertyObject->setHeight(aInstance->height());
           aPropertyObject->setProperty("color",aInstance->property("color"));
        }
    }
    return app.exec();
}

Setting object type property in QML from C++

1 Answers