如何在QML中创建动态委托？

Pau 发表于 Dev

包

我想使用创建视图ListView，其中每行将具有Rectangle由模型定义的元素。模型中的每个元素都代表一行，但是这些元素可能Rectangle要绘制多个元素，它们是通过名为blocs的数组定义的。

我不知道如何定义委托Rectangles以为模型的每一行创建模型中定义的数量ListView。我希望每个集团都独立于其他集团，因此将来我可以使其可拖动和调整大小。

这是我的BlocModel.qml：

import QtQuick 2.0

ListModel {

    ListElement{
        blocs: [
            ListElement{
                OriginX: 100
                length: 100
                color: "blue"
            },
            ListElement{
                OriginX: 300
                length: 75
                color: "green"
            }
        ]
    }
    ListElement{
        blocs: [
            ListElement{
                OriginX: 0
                length: 50
                color: "red"
            },
            ListElement{
                OriginX: 100
                length: 75
                color: "yellow"
            }
            ,
            ListElement{
                OriginX: 300
                length: 100
                color: "blue"
            }
        ]
    }

}

这是main.qml：

import QtQuick 2.11
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.4
import QtQuick.Layouts 1.11
import QtQuick.Window 2.11

ApplicationWindow {
    id: window
    width: 400
    height: 500
    visible: true

    ListView {
        id: blocsListView
        anchors.fill: parent
        model: BlocModel {}
        delegate: BlocDelegate {}
    }
}

这是BlocDelegate.qml：

import QtQuick 2.12
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.4
import QtQuick.Layouts 1.11
import QtQuick.Window 2.11

ItemDelegate{
    id: root
    width: parent.width
    height: 50

    //each row
    Rectangle{
        width: parent.width
        height: parent.height
        color: "gray"

        //What should I add here to make the following element repeat according to the number of elements in the array "blocs"? 
        //each bloc should have the following delegate
       /* Rectangle {
            id: bloc
            x: OriginX
            width: length
            height: parent.height
            color: model.color
        }*/
    }
}

如何使我的代表动态化？我可以以某种方式使用Javascriptfor循环，还是应该使用C ++模型并从那里添加块？

谢谢！

拉姆库玛河

如果所有委托项都是相同的类型（在这种情况下仅是矩形），则可能适合您的要求的简单解决方案。如果您拥有不同类型的委托项目（矩形，项目，按钮，单选按钮），则必须将具有匹配类型的预定义项目加载到加载程序中。

=========BlocDelegate.qml=======
import QtQuick 2.9
import QtQuick.Controls 2.2

Column {
    width: parent.width

    Repeater {
        model: blocs
        delegate: Rectangle {
            height: 40
            width: parent.width
            color: rectcolor
        }
    }
}


========BlocModel.qml========
import QtQuick 2.0

ListModel {
    ListElement {
        blocs: [
            ListElement {
                rectcolor: "lightgreen"
            },
            ListElement {
                rectcolor: "skyblue"
            },
            ListElement {
                rectcolor: "orange"
            }

        ]
    }
    ListElement {
        blocs: [
            ListElement {
                rectcolor: "yellow"
            },
            ListElement {
                rectcolor: "steelblue"
            }
        ]
    }
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。