c++ 中继器内的QML列表视图

omqzjyyz  于 2022-12-15  发布在  其他
关注(0)|答案(3)|浏览(208)

如何将不同的模型分配给Repeater内部的ListView?我做了一个草图(我的实际项目要大得多):

Column {
    Repeater {
        model: ["Line1","Line2","Line3","Line4"]
        Rectangle {
            ListView {
                model: ???
                delegate: Rectangle {
                    Text {
                        text: somemodelproperty
                    }                
                }
            }
        }
    }
}

目前,我通过复制粘贴10个矩形来解决这个问题,每个矩形包含一个ListView。在C++中,我已经实现了10个QList<QObject*>,每个列表都“绑定”到一个ListView,方法是:

QQmlContext * example = engine.rootContext();
example->setContextProperty(modelname,QVariant::fromValue(listobject));

我非常肯定有一种更智能的方法来实现这一点,但是我几天前才开始使用QML,还没有找到解决方案。

z9gpfhce

z9gpfhce1#

这里有一个问题,你不能使用id作为列表元素的值,也不能在列表元素中嵌套列表模型,至少不能直接嵌套。
但是,您可以按如下方式填充它:

Item {
    id: models
    ListModel {/*...*/}
    ListModel {/*...*/}
    //...
}

ListModel {
    id: outerModel
}

function set() {
    for (var i = 0; i < models.data.length; ++i) {
        outerModel.append({"model": models.data[i] /* and other stuff */})
    }
}

或者,如果您更喜欢使用C++数据,则可以向列表中的每个元素添加QObject*“model”属性,并使用函数对其进行设置,如上面的示例所示,或者使用您指定的内部模型的id
再考虑一下,您可能希望使用另一个名称而不是“model”,因为我无法想象QML会对model: model这样的东西感到高兴

更新:您可以尝试这样做(假设您的10个模型在QML中公开为m1-m10

property var subModels: [m1, m2, ... m10]

然后,对于repeater委托中的ListView,您可以:

ListView {
    model: subModels[index]
    // ...
}

然后假设repeater中有10个元素,每个列表视图的模型将从具有适当元素索引的数组中选择。

f4t66c6m

f4t66c6m2#

声明repeater的模型,而不是使用字符串数组。您可以使用ListModel来实现此目的。您还可以向ListModels元素ListElement添加所需的任何属性。声明如下内容:

ListModel { 
   id: repeaterModel
   ListElement { title: "Line1"; model: modelForFirstElement; }
   ListElement { title: "Line2"; model: modelForSecondElement; }
   // ...
}

然后将其分配给Repeater的模型属性

Repeater {
   id: repeater
   model: repeaterModel
// ...

然后,您只需调用model的model属性,就可以访问ListView的model,如下所示(假设您已经为Repeater元素分配了id“repeater”):

ListView {
   model: repeater.model.model
// ...

1cklez4t

1cklez4t3#

对于该模型,考虑一个嵌套了子数组的数组。由于外部Repeater和内部ListView具有不同的modelData示例,因此要进行区分,请考虑将外部modelData复制到名为outerModelData的属性。
在下面的示例中,我重构出Column-Repeater-ListView,并将其替换为ListView-ListView。这两种模式实现了相同的功能,但后者的实现时间更短。

import QtQuick
import QtQuick.Controls

Page {
    ListView {
        anchors.fill: parent
        model: [
            {la:"English",v:["one","two","three"]},
            {la:"Mandarin",v:["yi","er","san"]},
            {la:"French",v:["un","duex","trois"]},
            {la:"German",v:["eins","zwei","drei"]},
            {la:"Indonesian",v:["satu","dua","tiga"]},
        ]
        delegate: ListView {
            property var outerModelData: modelData
            width: 120
            height: childrenRect.height
            header: Text { text: outerModelData.la }
            model: outerModelData.v
            delegate: Frame {
                width: 100
                Text { text: modelData }                
            }
        }
    }
}

你可以Try it Online!

相关问题