QML：如何动态添加行

Question

我有一个简单的qml文件，可创建我的qml组件，如下所示。 我需要在control_section中加载不同的控件组件。

这是我需要支持的不同控制情况

• 一个按钮
• 水平排列的两个按钮（行）
• 两个文本框和一个垂直布局的按钮（行）

第一种情况只有一个按钮。 但是，在第二种情况下，仅显示最后一个按钮。 如何使行中的两个按钮都显示？

注意 ：问题似乎在于按钮彼此重叠

框架

Item {
    id: frame
    width: 400
    height: 500
    property alias components: control_section.sourceComponent
    Loader  {...}
    Image {...}
    Text {...}
    Loader{
        id: control_section
        ...
    }
}

OtherButton.qml

Item { ..; Button {...};}

main.qml

Frame {
    components: Row {
        OtherButton {}
        OtherButton {}
    }
}

Answer 1

我通过使用ListView解决了此问题。 这样可以正确显示按钮。

ListModel {
    id: listModel
    ListElement {text: "A"; next: "first.qml"}
    ListElement {text: "B"; next: "second.qml"}
}

Component {
    id: listDelegate
    Item {
       OtherButton  {}
    }
}

ListView {
    model : listModel
    delegate: listDelegate
}