创建后如何将项目添加到 QML 网格？

Question

我进行了一些搜索，但未能找到一个答案，这个答案必须非常简单，到目前为止还没有必要提出问题。无论如何，我是 QML 的新手，并且正在努力寻找一种动态地将项目添加到网格的方法 post-creation.

基本上我有一个 Flickable，里面有一个 Grid（默认情况下）包含四个自定义 class 名为 ImageTile 的实例，当 MouseArea 检测到有点击时，它想添加 2 个 ImageTile 实例那个网格。

这是代码片段：

Flickable {
    anchors.fill: parent
    contentWidth: 400
    contentHeight: 800
    clip: true

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onclicked: { /* ADD TWO ImageTile TO imageGrid */ }
    }

    Grid {
        id: imageGrid
        columns: 2
        spacing: 2

        Repeater {
            model: 4
            ImageTile { }
        }
    }
}

如您所见，我想知道我应该在 onClicked 事件中放入什么来实现将 ImageTile 的两个新实例添加到 imageGrid。

在此先感谢您的帮助！

Answer 1

感谢 MrEricSir 的正确指导，我已经解决了这个问题。

首先，我必须为 Repeater 指定一个合适的数据模型，然后分配一个委托函数将数据模型中的信息转换为实际的 QML 元素。附加到数据模型会自动触发 Repeater 执行委托函数。

Flickable {
    anchors.fill: parent
    contentWidth: 400
    contentHeight: 800
    clip: true

    ListModel {
        id: imageModel

        ListElement { _id: "tile0" }
        ListElement { _id: "tile1" }
        ListElement { _id: "tile2" }
        ListElement { _id: "tile3" }
    }

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        onclicked: {
            imageModel.append({ _id: "tile" + imageModel.count })
        }
    }

    Grid {
        id: imageGrid
        columns: 2
        spacing: 2

        Repeater {
            model: imageModel
            delegate: ImageTile { id: _id }
        }
    }
}

创建后如何将项目添加到 QML 网格？

How to add items to a QML Grid after creation?

javascript

qt

qml