如何在 QML 中显示二维数组的值？

Posted 2023-02-16

【中文标题】如何在 QML 中显示二维数组的值？

【英文标题】：How to display values of 2d array in QML?

【发布时间】：2017-04-16 18:50:31

【问题描述】：

所以我在我的 qml 的根元素中创建了一个属性，并用 javascript 作为二维数组填充它。我是这样做的：

property var cars: 

    var carList = new Array(root.numberOfCars)

    for (var i=0;i<root.numberOfCars;i++) 

        var carProperties = new Array(numberOfCarProperties);

        carProperties[root.currentStation] = -1;
        carProperties[root.score] = 100;
        carProperties[root.numberOfErrors] = 0;
        carProperties[root.hasProblem] = false;
        carProperties[root.errorScore] = 0;
        carProperties[root.finished] = false;

        carList[i] = carProperties;
    
    return carList;

当程序通过 JavaScript 运行时，数组的值会发生变化。

我想在表格中显示这个二维数组的值，并在它们发生更改时更新它们，此外还有一些影响数组所在行的值的操作按钮。

我只是 QML 和一般编程方面的菜鸟，所以如果这是一个非常基本的问题，请告诉我在哪里可以了解更多信息，因为我在网上找到的学习 QML 的资源很少。

【问题讨论】：

doc.qt.io/qt-5/qtquick-modelviewsdata-modelview.html

【参考方案1】：

如果您打算可视化数据，纯数组不是理想的解决方案。 QML 视图可以使用数组作为模型，但如果你想反映内部变化，这是低效的。您要么必须强制更新整个视图，重新创建所有视图代理，而不仅仅是更新更改的值，要么您必须实现自己的机制来更新更改。

最容易使用的是ListModel 元素，而不是将属性实现为数组（无论如何都是个坏主意），您可以将它们实现为列表元素属性：

ListModel 
    id: carList 
    ListElement 
        currentStation: -1
        score: 100
        numberOfErrors: 0
        // ...
    
    ListElement 
        // ...
    

模型可以像上面那样以声明方式填充，也可以强制填充：

carList.append("currentStation": -1, "score": 100, ...)

您还有通常的索引访问、属性访问等，只需scroll through the doc 即可了解接口。

这样做的好处是您将在视图中获得高效的自动更新。因此，您只需设置一个视图并实现一个用于可视化和操作数据的委托。

【讨论】：

非常感谢！那么我可以使用for 来填充ListModel 任意次数，而不必分别声明每个ListElement，对吧？

是的，您可以以声明方式或命令方式（如循环）填充模型。

非常感谢！