QML tableview中的Ordereddict列表

Question

我有一个Ordereddict列表，如下所示

list1= [OrderedDict([('Numbers', '15'), ('FirstName', 'John'), ('SecondName', 'Raul'), ('MiddleName', 'Kyle'), ('Grade', 22)]),
OrderedDict([('Names', 'John'), ('NewFirstName', 'Mark'), ('NewSecondName', 'Sachel'), ('NewThirdName', 'Raul'), ('Grade', 15)]),
OrderedDict([('Numbers', '25'),  ('FirstName', 'Kyle'), ('SecondName', 'Venn'), ('MiddleName', 'Marcus'), ('Grade', 24)]),
OrderedDict([('Names', 'Sachel'), ('NewFirstName', 'Venn'), ('NewSecondName', 'Kyle'), ('NewThirdName', 'John'), ('Grade', 71)])]

其中有8个唯一键和一个公共键，我想在QML中以相同顺序从中创建表视图，键是表的标题。我的预期输出如下

以qml为单位的预期输出

如何从python在QML中显示它

Answer 1

您可以创建QAbstractItemModel或更简单地使用QStandardItemModel：

from PyQt5 import QtCore, QtGui, QtQml
from collections import OrderedDict

datas = [
    OrderedDict(
        [
            ("Numbers", "15"),
            ("FirstName", "John"),
            ("SecondName", "Raul"),
            ("MiddleName", "Kyle"),
            ("Grade", 22),
        ]
    ),
    OrderedDict(
        [
            ("Names", "John"),
            ("NewFirstName", "Mark"),
            ("NewSecondName", "Sachel"),
            ("NewThirdName", "Raul"),
            ("Grade", 15),
        ]
    ),
    OrderedDict(
        [
            ("Numbers", "25"),
            ("FirstName", "Kyle"),
            ("SecondName", "Venn"),
            ("MiddleName", "Marcus"),
            ("Grade", 24),
        ]
    ),
    OrderedDict(
        [
            ("Names", "Sachel"),
            ("NewFirstName", "Venn"),
            ("NewSecondName", "Kyle"),
            ("NewThirdName", "John"),
            ("Grade", 71),
        ]
    ),
]

if __name__ == "__main__":
    import os
    import sys

    app = QtGui.QGuiApplication(sys.argv)
    engine = QtQml.QQmlApplicationEngine()
    model = QtGui.QStandardItemModel()
    model.setHorizontalHeaderLabels(
        [
            "Numbers",
            "FirstName",
            "SecondName",
            "MiddleName",
            "Grade",
            "Names",
            "NewFirstName",
            "NewSecondName",
            "NewThirdName",
        ]
    )
    for data in datas:
        items = []
        for j in range(model.columnCount()):
            header = model.horizontalHeaderItem(j)
            t = data.get(header.text(), "")
            it = QtGui.QStandardItem()
            it.setData(t, QtCore.Qt.DisplayRole)
            items.append(it)
        model.appendRow(items)

    engine.rootContext().setContextProperty("table_model", model)
    file = os.path.join(os.path.dirname(os.path.realpath(__file__)), "main.qml")
    engine.load(QtCore.QUrl.fromLocalFile(file))
    if not engine.rootObjects():
        sys.exit(-1)
    sys.exit(app.exec())

main.qml

import QtQuick 2.12
import QtQuick.Controls 2.4
import QtQuick.Window 2.11

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    color: '#222222'

    TableView {
        id: tableView

        columnWidthProvider: function (column) { return 120; }
        rowHeightProvider: function (column) { return 60; }
        anchors.fill: parent
        leftMargin: rowsHeader.implicitWidth
        topMargin: columnsHeader.implicitHeight
        model: table_model
        delegate: Rectangle {
            color: 'white'
            border.color: 'black' 
            Text {
                text: display
                anchors.fill: parent
                anchors.margins: 10
                color: 'black'
                font.pixelSize: 15
                verticalAlignment: Text.AlignVCenter
            }
        }
        Rectangle { // mask the headers
            z: 3
            color: "#222222"
            y: tableView.contentY
            x: tableView.contentX
            width: tableView.leftMargin
            height: tableView.topMargin
        }

        Row {
            id: columnsHeader
            y: tableView.contentY
            z: 2
            Repeater {
                model: tableView.columns > 0 ? tableView.columns : 1
                Label {
                    width: tableView.columnWidthProvider(modelData)
                    height: 35
                    text: table_model.headerData(modelData, Qt.Horizontal)
                    color: '#aaaaaa'
                    font.pixelSize: 15
                    padding: 10
                    verticalAlignment: Text.AlignVCenter

                    background: Rectangle { color: "#333333" }
                }
            }
        }
        Column {
            id: rowsHeader
            x: tableView.contentX
            z: 2
            Repeater {
                model: tableView.rows > 0 ? tableView.rows : 1
                Label {
                    width: 40
                    height: tableView.rowHeightProvider(modelData)
                    text: table_model.headerData(modelData, Qt.Vertical)
                    color: '#aaaaaa'
                    font.pixelSize: 15
                    padding: 10
                    verticalAlignment: Text.AlignVCenter

                    background: Rectangle { color: "#333333" }
                }
            }
        }

        ScrollIndicator.horizontal: ScrollIndicator { }
        ScrollIndicator.vertical: ScrollIndicator { }
    }
}