Qt 如何将元素直接添加到qml中自定义模块的子级？

如何将元素直接添加到qml中自定义模块的子级？ 下面有三个矩形（rect1/rect2/rect3）作为ScrollView的内容

import QtQuick 2.12
import QtQuick.Controls 2.12

ScrollView {
    property var content

    clip: true
    ScrollBar.vertical.policy: ScrollBar.AlwaysOn
    Rectangle {
        width:  parent.width
        height: c.height
        implicitHeight: c.height

        Column {
            id: c
            spacing: 20
            anchors.horizontalCenter: parent.horizontalCenter

            // Contents

            Rectangle{
                id: rect1
                width: 100
                height: 200
                color: "#ffff00"
                anchors.horizontalCenter: parent.horizontalCenter
            }

            Rectangle{
                id: rect2
                width: 100
                height: 200
                color: "#000000"
                anchors.horizontalCenter: parent.horizontalCenter
            }


            Rectangle{
                id: rect3
                width: 100
                height: 200
                color: "#00ffff"
                anchors.horizontalCenter: parent.horizontalCenter
            }
        }
    }

}

但每次写上述内容都更复杂 我想将上述代码封装到MyScrollView.qml模块中

我想这样使用它

MyScrollView {
    Rectangle {
        id: rect1
        width: 100
        height: 200
        color: "#ffff00"
        anchors.horizontalCenter: parent.horizontalCenter
    }

    Rectangle {
        id: rect2
        width: 100
        height: 200
        color: "#000000"
        anchors.horizontalCenter: parent.horizontalCenter
    }

    Rectangle {
        id: rect3
        width: 100
        height: 200
        color: "#00ffff"
        anchors.horizontalCenter: parent.horizontalCenter
   }
}

---

qml可以这样做吗？如果没有，如何编写最优雅的文档？

您可以使用不同的方法来实现这一点，例如动态对象的动态创建

或者，您可以指定以引用某些内部中心对象来指定项目

也可以使用来加载组件

我将在主题：）中展示基于您愿望的示例

创建MyScrollView.qml

import QtQuick 2.12
import QtQuick.Controls 2.12

ScrollView {
    property list<Item> content_list

    clip: true
    ScrollBar.vertical.policy: ScrollBar.AlwaysOn

    Component.onCompleted:
    {
        for(var i = 0; i < content_list.length; i++)
        {
            content_list[i].parent = c;
        }
    }

    Rectangle
    {
        width:  parent.width
        height: c.height
        implicitHeight: c.height

        Column
        {
            id: c
            spacing: 20
            anchors.horizontalCenter: parent.horizontalCenter
        }
    }
}

---

你能详细解释一下你说的“直接给孩子添加元素”是什么意思吗？你到底想做什么？一些代码示例？

MyScrollView{content_list: [
                Rectangle {
                        id: rect1
                        width: 100
                        height: 200
                        color: "#ffff00"
                        anchors.horizontalCenter: parent.horizontalCenter
                    },

                    Rectangle {
                        id: rect2
                        width: 100
                        height: 200
                        color: "#000000"
                        anchors.horizontalCenter: parent.horizontalCenter
                    },

                    Rectangle {
                        id: rect3
                        width: 100
                        height: 200
                        color: "#00ffff"
                        anchors.horizontalCenter: parent.horizontalCenter
                   }
            ]}