如何在QML GridLayout中重新排序项目？

如何对GridLayout（或其他QML项目容器）中的项目重新排序？我有一个有一定数量的行和列，并填充了子项。直到几分钟前，我还希望我可以简单地操作该项的

子项

列表成员以对其重新排序：我在UI中有一个

MouseArea

按钮，我希望可以从该按钮调用（从

单击：

）一个

布局项的方法（意图是布局中的最后一个项成为第一个），但触发时会生成错误消息：

TypeError: Property 'pop' of object [object Object] is not a function

在任何情况下，我注意到文档中说

儿童

是只读的

---

有没有一个简单的方法可以做到这一点？（关于动态对象管理的讨论实际上只涉及子对象的创建和销毁。）

您可以使用和附加的属性。

根据Mitch的回答，我得出了以下结论：

  function reorder() {
    for (var i=0;i<children.length;i++) {
      var index=columns*children[i].Layout.row + children[i].Layout.column;
      var newIndex=(index+1)%(rows*columns);
      children[i].Layout.row=Math.floor(newIndex/columns)%rows;
      children[i].Layout.column=newIndex%columns;
    }
  }

函数重新排序（）{
对于（var i=0；i您可以通过更改GridLayout中项的父项来执行最初描述的pop/push类操作。通过取消GridLayout中任何索引的子项，将其从GridLayout中弹出。通过重新将其子项设置为GridLayout，将其推送到GridLayout的末尾。在这两个操作之间，您可以以相同的速度插入项通过按特定顺序按下和弹出所有子项，而不必管理每个项上的行/列，从而将自动布局留给GridLayout，来确定位置

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.9
import QtQuick.Layouts 1.3

Window {
    id: window
    visible: true
    height: 600
    width: 800

    GridLayout {
        id: grid
        columns: 4
        Rectangle {
            id: rect1
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect2
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect3
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect4
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect5
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
    }

    Item {
        id: item
        visible: false
    }

    Button {
        text: "push first item to rear of gridview"
        anchors.bottom: parent.bottom
        onClicked: {
                var object = grid.children[0] 
                object.parent = item // pop from grid
                object.parent = grid // push to grid
        }
    }
}

啊，当然！我可以迭代子级并适当地更新这些属性；观察到的布局与实际的子级顺序无关……稍后将尝试并接受这个答案。谢谢；我只是需要有人指出显而易见的情况之一：^）
import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.9
import QtQuick.Layouts 1.3

Window {
    id: window
    visible: true
    height: 600
    width: 800

    GridLayout {
        id: grid
        columns: 4
        Rectangle {
            id: rect1
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect2
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect3
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect4
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
        Rectangle {
            id: rect5
            color: Qt.rgba(Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, Math.random()*0.5 + 0.25, 1)
            height: 20
            width: 20
        }
    }

    Item {
        id: item
        visible: false
    }

    Button {
        text: "push first item to rear of gridview"
        anchors.bottom: parent.bottom
        onClicked: {
                var object = grid.children[0] 
                object.parent = item // pop from grid
                object.parent = grid // push to grid
        }
    }
}