代码中的 QML ListView 部分

Question

我无法使用部分实现列表视图。我已经成功地重复了 Qt 文档中的一个示例，但是使用了 ListModel 可以正常工作，但不是 var。

如何使用示例：

ListView {
    width: 100
    height: 100
    id: listview
    model: ListModel {
        id: animalsModel
        ListElement { name: "Ant"; size: "Tiny" }
        ListElement { name: "Flea"; size: "Tiny" }
        ListElement { name: "Parrot"; size: "Small" }
        ListElement { name: "Guinea pig"; size: "Small" }
        ListElement { name: "Rat"; size: "Small" }
        ListElement { name: "Butterfly"; size: "Small" }
        ListElement { name: "Dog"; size: "Medium" }
        ListElement { name: "Cat"; size: "Medium" }
        ListElement { name: "Pony"; size: "Medium" }
        ListElement { name: "Koala"; size: "Medium" }
        ListElement { name: "Horse"; size: "Large" }
        ListElement { name: "Tiger"; size: "Large" }
        ListElement { name: "Giraffe"; size: "Large" }
        ListElement { name: "Elephant"; size: "Huge" }
        ListElement { name: "Whale"; size: "Huge" }
    }

    delegate: Text { text: name; font.pixelSize: 18 }

    section.property: "size"
    section.criteria: ViewSection.FullString
    section.delegate: Component {
        id: sectionHeading
        Rectangle {
            width: container.width
            height: childrenRect.height
            color: "lightsteelblue"

            Text {
                text: section
                font.bold: true
                font.pixelSize: 20
            }
        }
    }
}

但是当我尝试使用代码中的某个模型时（在我的情况下，它是来自PyQt5 的QVariant）它根本不起作用：

ListView {
    width: 100
    height: 100
    id: listview
    property var m: [
        {
            name: "Animal",
            size: "Big"
        },
        {
            name: "Dog",
            size: "Small"
        },
        {
            name: "Cat",
            size: "Small"
        }
    ]
    model: m

    delegate: Text { text: modelData.name; font.pixelSize: 18 }

    section.property: "modelData.size"
    section.criteria: ViewSection.FullString
    section.delegate: Component {
        id: sectionHeading
        Rectangle {
            width: container.width
            height: childrenRect.height
            color: "lightsteelblue"

            Text {
                text: section
                font.bold: true
                font.pixelSize: 20
            }
        }
    }
}

之所以选择var，是因为没有其他方法可以从 Python 接收模型，因此来自python 的任何list 或map 都需要包装为QVariant。

Answer 1

来自 Qt 文档：

模型：模型

This property holds the model providing data for the list. The model provides the set of data that is used to create the items in the view. Models can be created directly in QML using ListModel, XmlListModel or VisualItemModel, or provided by C++ model classes. If a C++ model class is used, it must be a subclass of QAbstractItemModel or a simple list.

所以你不能提供一个数组作为模型，它应该是上面的对象之一。 您可以创建此类模型并从 Python 代码访问它以添加/删除项目。

ListView {
    width: 100
    height: 100
    id: listview
    delegate: Text { text: name; font.pixelSize: 18 }

    model: ListModel { id: listModel }

    section.property: "size"
    section.criteria: ViewSection.FullString
    section.delegate: Component {
        id: sectionHeading
        Rectangle {
            width: container.width
            height: childrenRect.height
            color: "lightsteelblue"

            Text {
                text: section
                font.bold: true
                font.pixelSize: 20
            }
        }
    }

    function callFromPython {
        listModel.append({name: "Animal",size: "Big"});
        listModel.append({name: "Dog",size: "Small"});
        listModel.append({name: "Cat",size: "Small"});
    }
}