洗牌QML ListModel

Question

我有一个ListModel和一个中继器。中继器从ListModel中提取项目，其中一项位于另一项之上。到目前为止还不错。

除了每次申请开始时，我想有一个不同的抽签顺序。

因此，我想最好是在应用Repeater之前“洗牌”ListElements中的ListModel。我该怎么做？

Answer 1

使用下列答案：

• https://stackoverflow.com/a/2450976/6622587
• https://stackoverflow.com/a/36645492/6622587

并对ListModel进行调整，您将得到以下函数：

utils.js

//https://stackoverflow.com/a/2450976/6622587
function shuffle(model){
    var currentIndex = model.count, temporaryValue, randomIndex;

    // While there remain elements to shuffle...
    while (0 !== currentIndex) {
        // Pick a remaining element...
        randomIndex = Math.floor(Math.random() * currentIndex)
        currentIndex -= 1
        // And swap it with the current element.
        // the dictionaries maintain their reference so a copy should be made
        // https://stackoverflow.com/a/36645492/6622587
        temporaryValue = JSON.parse(JSON.stringify(model.get(currentIndex)))
        model.set(currentIndex, model.get(randomIndex))
        model.set(randomIndex, temporaryValue);
    }
    return model;
}

main.qml

import QtQuick 2.9
import QtQuick.Window 2.2
import "utils.js" as Util

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    ListModel {
        id: fruitModel
        ListElement {
            name: "Apple"
            cost: 2.45
        }
        ListElement {
            name: "Banana"
            cost: 1.95
        }
        ListElement {
            name: "Orange"
            cost: 3.25
        }
    }

    Column {
        Repeater {
            model: Util.shuffle(fruitModel)
            Row {
                spacing: 10
                Text { text: name }
                Text { text: '$' + cost }
            }
        }
    }
}

在这个链接中，您可以找到一个例子。

Answer 2

如果您想保持原始的ListModel不可变(即不变)，您可以控制如何通过DelegateModel查看ListModel。在下面，我们将初始化DelegateModel以通过ListModel，然后我们将任意地对它执行10个随机交换：

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
Page {
    ListView {
        anchors.fill: parent
        model: ShuffleDelegateModel {
            id: shuffleDelegateModel
            model: animals
            delegate: Frame {
                width: ListView.view.width
                Text {
                    text: model.name
                }
            }
        }
    }
    ListModel {
        id: animals
        ListElement { name: "cat" }
        ListElement { name: "dog" }
        ListElement { name: "monkey" }
        ListElement { name: "lion" }
        ListElement { name: "giraffe" }
        ListElement { name: "elephant" }
    }
    footer: Frame {
        RowLayout {
            Button {
                text: qsTr("Shuffle")
                onClicked: shuffleDelegateModel.shuffle(10)
            }
        }
    }
}

//ShuffleDelegateModel.qml
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQml.Models 2.15
DelegateModel {
    groups: [
        DelegateModelGroup {
            id: visibleItems
            name: "visible"
            includeByDefault: true
        }
    ]
    filterOnGroup: "visible"
    function shuffle(loops) {
        for (let i = 0; i < loops; i++) {
            let index = Math.floor(Math.random() * visibleItems.count);
            let newIndex = Math.floor(Math.random() * visibleItems.count);
            if (index === newIndex) continue;
            visibleItems.move(index, newIndex, 1);
        }
    }
}

你可以在网上试试！