qt - QML ListView 隐藏委托(delegate)项

Question

有没有办法隐藏ListView中的某些项目？

import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Window 2.2

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



    ListView {
        anchors.fill: parent

        model: ListModel {
            ListElement { color: "red"; visible: true}
            ListElement { color: "green"; visible: false}
            ListElement { color: "blue"; visible: true}
        }

        delegate: Rectangle {
            width: parent.width
            height: model.visible ? 30 : 0
            color: model.color
            visible: model.visible
            enabled: model.visible
        }
    }
}

如果只有 ListView 可以忽略不可见的 Item 的 height，上面的解决方案会很好。

手动将height设置为0对性能不利，因此我需要更好的解决方案。你能帮我吗？

Answer 1

希望这能解决问题。对于像我这样的初学者来说，解决这个问题有助于进一步了解 qml。

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

ApplicationWindow {
    width: 640
    height: 480
    visible: true

ListView {
    id: displayListView
    anchors.fill: parent
    model: displayDelegateModel
}

ListModel {
    id: myModel
    ListElement { colo: "orange"; visible: true}
    ListElement { colo: "red"; visible: false}
    ListElement { colo: "white"; visible: true}
    ListElement { colo: "black"; visible: false}
    ListElement { colo: "green"; visible: true}
    ListElement { colo: "yellow"; visible: false}
}

VisualDataModel {
    id: displayDelegateModel

    delegate:  Rectangle {
        width: parent.width
        height: 30
        color: colo

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

    model: myModel

    groups: [
        VisualDataGroup {
            includeByDefault: false
            name: "visible"
        }
    ]

    filterOnGroup: "visible"

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