Adding to a custom component

[GrahamLa]

Hi
I have a custom component defined as

Item {
    GroupBox {
        id: groupBox
        x: 93
        y: 132
        width: 200
        height: 200
        title: qsTr("Group Box")

        RoundButton {
            id: roundButton
            x: 15
            y: 49
            width: 119
            height: 40
            text: "FFFF"
          }

        RoundButton {
            id: roundButton1
            x: 37
            y: 104
            width: 109
            height: 40
            text: "+"
        }

    }
}

I can use it like this

MyComponent {
        id: myComponent
        x: -45
        y: 123
    }
}

Now what I want to do is to add more elements to the used component (not to the base) -

```

MyComponent {
id: myComponent
x: -45
y: 123

   Button {
        text: "new Text"
    }
}

this places the new button outside of the component.
Is this possible?

[ODБOï]

hi @GrahamLa
Try to delete your Componets top level item Item

//Item {
GroupBox {
...
//}

[ODБOï]

You also can define MyComponent like this :

import QtQuick 2.0
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3

Item {
    default property alias contentData : content.data
    GroupBox {
        title: qsTr("Group Box")
        anchors.fill: parent
        RowLayout{
            id: content
            anchors.fill: parent

            Button{
                text: "def btn 1"
            }
            Button{
                text: "def btn 2"
            }
        }
    }
}

and use it :

    MyComponent {
        anchors.centerIn: parent
        height: 100
        width: contentItem.width
        Button{
            text: "btn 3"
        }

    }

[GrahamLa]

Thanks all