how to "place" dynamic objects?

mzimmers

Hi all -

I'm trying to dynamically create an object to be displayed within a drawer. Here's what I'm trying:

Window {
    id: window
    Drawer {
        id: drawer
        onOpened: {
            var component;
            component = Qt.createComponent("MyComponent.qml")
            component.createObject(window);
        }
    }
}

This places my dynamic component in the window, but not in the drawer. I tried substituting "drawer" for "window" in the createObject() call, but that gives me an error:

Created graphical object was not placed in the graphics scene.

Can someone comment on the preferred way to do this? Thanks...

EDIT: a Qt bug may be factoring in this example, but I'm going to leave this open for a bit, in case someone sees something I'm doing wrong.

lemons

Within your createObject() method, you have to pass the proper parent.
If you want to add something to drawer, you have to pass the drawer, not the window.

component.createObject(drawer); // not: window

Here a minimal example:
Note: The component will be added over and over again, once you open the drawer. So in the end you will have many of the same components in the drawer.

Window {
    height: 680
    width: 480
    visible: true

    Button {
        anchors.centerIn: parent
        text: "Open Drawer"
        onClicked: drawer.open()
    }

    Drawer {
        id: drawer
        width: 300
        height: parent.height
        edge: "LeftEdge"

        Column {
            id: drawerContent
            anchors.fill: parent
            anchors.margins: 5
            spacing: 20
        }

        onOpened: {
            let component = Qt.createComponent("MyComponent.qml")
            component.createObject(drawerContent)
        }
    }

// MyComponent.qml
Rectangle {
    width: parent.width
    height: 20
    color: "red"
}

johngod

As a workaround does it work, if you change the parent after the object creation ?

var myObject = component.createObject(window);
myObject.parent = drawer

mzimmers

@johngod interesting idea, but this gives a different error:

Error: Cannot assign QObject* to QQuickItem*

lemons

Within your createObject() method, you have to pass the proper parent.
If you want to add something to drawer, you have to pass the drawer, not the window.

component.createObject(drawer); // not: window

Here a minimal example:
Note: The component will be added over and over again, once you open the drawer. So in the end you will have many of the same components in the drawer.

Window {
    height: 680
    width: 480
    visible: true

    Button {
        anchors.centerIn: parent
        text: "Open Drawer"
        onClicked: drawer.open()
    }

    Drawer {
        id: drawer
        width: 300
        height: parent.height
        edge: "LeftEdge"

        Column {
            id: drawerContent
            anchors.fill: parent
            anchors.margins: 5
            spacing: 20
        }

        onOpened: {
            let component = Qt.createComponent("MyComponent.qml")
            component.createObject(drawerContent)
        }
    }

// MyComponent.qml
Rectangle {
    width: parent.width
    height: 20
    color: "red"
}

mzimmers

This post is deleted!

mzimmers

@lemons said in how to "place" dynamic objects?:

Note: The component will be added over and over again, once you open the drawer. So in the end you will have many of the same components in the drawer.

So, can something be done about this? There doesn't appear to be a delete analog to Qt.createComponent.

lemons

@mzimmers late answer, but simply don't hook it up to the onOpened() event, as this event gets triggered each time the drawer opens.

You could use the Component.onCompleted() event or any other logic, that only calls the function once (if this is what you want to achieve).
→ Totally depends on the actual use-case