是否可以仅显示QML列表视图的某些索引？

Question

是否可以在QML列表视图中仅显示某些索引或一系列索引？

我有一个listmodel,有一堆我正在重用的信息.是否可以列出一个列表,例如,只显示索引5到8？

Answer 1

为问题提出纯QML方法会很有趣.当然,这不是短路,但它是一种解决方案.

该方法基于QML模块中的DelegateModel可用方法models.它读入文档:

DelegateModel类型封装模型和将为模型中的项实例化的委托.

通常不需要创建DelegateModel.但是,当QAbstractItemModel子类用作模型时,它可用于操作和访问modelIndex.此外,DelegateModel与Package 一起使用以向多个视图提供委托,并使用DelegateModelGroup对委托项进行排序和过滤.

DelegateModel是一个功能强大的类型,具有很多功能(详情请参阅链接文档).两个关键属性DelegateModel是groups和filterOnGroup.前者基本上是一个列表,DelegateModelGroup用于定义要过滤的项目.后者用于应用特定过滤器,即通过简单地将属性设置为所选组的名称来选择DelegateModelGroup包含在其中的特定过滤器groups.

注意,引用VisualDataModel或DelegateModel相同是因为第一个是出于兼容性原因而提供的(同样适用于VisualDataGroupwrt DelegateModelGroup).

总而言之,可以用这种方式过滤完整QML中的模型:

1. 创建一个model过滤模型的来源
2. 喂model到VisualDataModel/DelegateModel
3. 定义一个VisualDataGroup/ DelegateModelGroup(或多个) - includeByDefault设置false为避免自动添加原始模型中的所有项目
4. 定义填充组的策略
5. 设置filterOnGroup为所选组
6. 将视图模型设置为VisualDataModel模型

在下一个示例中,为简单起见,我只在Component.onCompleted事件处理程序中填充一次组.如上所述,应该选择策略,这取决于具体的用例.

在示例中,只有key角色等于的项0被添加到组中key0,该组是显示的组ListView.上面的清单在代码中突出显示.

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Window 2.0

ApplicationWindow {
    title: qsTr("DelegateModel test")
    width: 200
    height: 350
    visible: true

    ListView {
        id: displayListView
        anchors.fill: parent
        spacing: 5
        //
        model: displayDelegateModel             // 6
    }

    ListModel {                                 // 1
        id: myModel
        ListElement { vis: "One"; key: 0; }
        ListElement { vis: "two"; key: 1; }
        ListElement { vis: "Three"; key: 0; }
        ListElement { vis: "Four"; key: 0; }
        ListElement { vis: "Five"; key: 1; }
        ListElement { vis: "Six"; key: 1; }
        ListElement { vis: "Seven"; key: 0; }
    }

    VisualDataModel {
        id: displayDelegateModel

        delegate:  Rectangle {
            anchors.left: parent.left
            anchors.right: parent.right
            height: 25
            color: "steelblue"

            Text {
                text: vis
                anchors.centerIn: parent
                font.bold: true
                font.pixelSize: 20
            }
        }

        model: myModel                          // 2

        groups: [
            VisualDataGroup {                   // 3
                includeByDefault: false         // NECESSARY TO AVOID AUTOADDITION
                name: "key0"
            }
        ]

        filterOnGroup: "key0"                   // 5

        Component.onCompleted: {                // 4
            var rowCount = myModel.count;
            items.remove(0,rowCount);
            for( var i = 0;i < rowCount;i++ ) {
                var entry = myModel.get(i);
                if(entry.key == 0) {
                    items.insert(entry, "key0");
                }
            }
        }
    }
}