ListModel QML Type

Definiert eine Freiform-Listen-Datenquelle. Mehr...

• Liste aller Mitglieder, einschließlich geerbter Mitglieder

Eigenschaften

• count : int
• dynamicRoles : bool

Methoden

• append(jsobject dict)
• clear()
• object get(int index)
• insert(int index, jsobject dict)
• move(int from, int to, int n)
• remove(int index, int count)
• set(int index, jsobject dict)
• setProperty(int index, string property, variant value)
• sync()

Ausführliche Beschreibung

Das ListModel ist ein einfacher Container mit ListElement Definitionen, die jeweils Datenrollen enthalten. Der Inhalt kann dynamisch oder explizit in QML definiert werden.

Die Anzahl der Elemente im Modell kann über die Eigenschaft count ermittelt werden. Zur Bearbeitung des Inhalts des Modells stehen eine Reihe bekannter Methoden zur Verfügung, darunter append(), insert(), move(), remove() und set(). Diese Methoden akzeptieren Wörterbücher als Argumente; diese werden vom Modell in ListElement Objekte übersetzt.

Elemente können über das Modell mit der Methode setProperty() manipuliert werden, mit der die Rollen des angegebenen Elements festgelegt und geändert werden können.

ListModel erbt von QAbstractListModel und bietet dessen Q_INVOKABLE Methoden. Sie können z. B. QAbstractItemModel::index verwenden, um eine QModelIndex für eine Zeile und Spalte abzurufen.

Beispielverwendung

Das folgende Beispiel zeigt ein ListModel mit drei Elementen mit den Rollen "name" und "cost".

import QtQuick

ListModel {
    id: fruitModel

    ListElement {
        name: "Apple"
        cost: 2.45
    }
    ListElement {
        name: "Orange"
        cost: 3.25
    }
    ListElement {
        name: "Banana"
        cost: 1.95
    }
}

Rollen (Eigenschaften) in jedem Element müssen mit einem Kleinbuchstaben beginnen und sollten für alle Elemente in einem Modell gleich sein. Die Dokumentation ListElement enthält weitere Richtlinien für die Definition von Elementen.

Da das Beispielmodell eine id -Eigenschaft enthält, kann diese von Ansichten referenziert werden, wie z. B. die ListView in diesem Beispiel:

import QtQuick

Rectangle {
    width: 200; height: 200

    ListModel {
        id: fruitModel
        ...
    }

    Component {
        id: fruitDelegate
        Row {
            spacing: 10
            Text { text: name }
            Text { text: '$' + cost }
        }
    }

    ListView {
        anchors.fill: parent
        model: fruitModel
        delegate: fruitDelegate
    }
}

Es ist möglich, dass Rollen Listendaten enthalten. Im folgenden Beispiel erstellen wir eine Liste von Obstattributen:

ListModel {
    id: fruitModel

    ListElement {
        name: "Apple"
        cost: 2.45
        attributes: [
            ListElement { description: "Core" },
            ListElement { description: "Deciduous" }
        ]
    }
    ListElement {
        name: "Orange"
        cost: 3.25
        attributes: [
            ListElement { description: "Citrus" }
        ]
    }
    ListElement {
        name: "Banana"
        cost: 1.95
        attributes: [
            ListElement { description: "Tropical" },
            ListElement { description: "Seedless" }
        ]
    }
}

Der Delegat zeigt alle Obstattribute an:

Component {
    id: fruitDelegate
    Item {
        width: 200; height: 50
        Text { id: nameField; text: name }
        Text { text: '$' + cost; anchors.left: nameField.right }
        Row {
            anchors.top: nameField.bottom
            spacing: 5
            Text { text: "Attributes:" }
            Repeater {
                model: attributes
                Text { text: description }
            }
        }
    }
}

Ändern von Listenmodellen

Der Inhalt eines ListModel kann mit den Methoden clear(), append(), set(), insert() und setProperty() erstellt und geändert werden. Ein Beispiel:

    Component {
        id: fruitDelegate
        Item {
            width: 200; height: 50
            Text { text: name }
            Text { text: '$' + cost; anchors.right: parent.right }

            // Double the price when clicked.
            MouseArea {
                anchors.fill: parent
                onClicked: fruitModel.setProperty(index, "cost", cost * 2)
            }
        }
    }

Beachten Sie, dass bei der dynamischen Erstellung von Inhalten die Menge der verfügbaren Eigenschaften nicht geändert werden kann, wenn sie einmal festgelegt wurde. Die Eigenschaften, die dem Modell zuerst hinzugefügt werden, sind die einzigen zulässigen Eigenschaften des Modells.

Verwendung von Threaded List Models mit WorkerScript

ListModel kann zusammen mit WorkerScript verwendet werden, um auf ein Listenmodell von mehreren Threads aus zuzugreifen. Dies ist nützlich, wenn Listenänderungen synchron sind und einige Zeit in Anspruch nehmen: Die Listenoperationen können in einen anderen Thread verschoben werden, um ein Blockieren des Haupt-GUI-Threads zu vermeiden.

Hier ist ein Beispiel, das WorkerScript verwendet, um periodisch die aktuelle Zeit an ein Listenmodell anzuhängen:

        Timer {
            id: timer
            interval: 2000; repeat: true
            running: true
            triggeredOnStart: true

            onTriggered: {
                var msg = {'action': 'appendCurrentTime', 'model': listModel};
                worker.sendMessage(msg);
            }
        }

Die enthaltene Datei dataloader.mjs sieht wie folgt aus:

WorkerScript.onMessage = function(msg) {
    if (msg.action == 'appendCurrentTime') {
        var data = {'time': new Date().toTimeString()};
        msg.model.append(data);
        msg.model.sync();   // updates the changes to the list
    }
}

Der Timer im Hauptbeispiel sendet Nachrichten an das Arbeitsskript, indem er WorkerScript::sendMessage() aufruft. Wenn diese Nachricht empfangen wird, wird WorkerScript.onMessage() in dataloader.mjs aufgerufen, das die aktuelle Zeit an das Listenmodell anhängt.

Beachten Sie den Aufruf von sync() aus dem externen Thread. Sie müssen sync() aufrufen, sonst werden die von diesem Thread an der Liste vorgenommenen Änderungen nicht im Listenmodell des Hauptthreads wiedergegeben.

Siehe auch Datenmodelle und Qt Qml.

Eigenschaft Dokumentation

Methode Dokumentation

fruitModel.append({"cost": 5.95, "name":"Pizza"})

Component.onCompleted: {
    fruitModel.append({"cost": 5.95, "name":"Jackfruit"});
    console.log(fruitModel.get(0).cost);
    fruitModel.get(0).cost = 10.95;
}

fruitModel.append(..., "attributes":
    [{"name":"spikes","value":"7mm"},
     {"name":"color","value":"green"}]);
fruitModel.get(0).attributes.get(1).value; // == "green"

fruitModel.insert(2, {"cost": 5.95, "name":"Pizza"})

fruitModel.move(0, fruitModel.count - 3, 3)

fruitModel.set(3, {"cost": 5.95, "name":"Pizza"})

fruitModel.setProperty(3, "cost", 5.95)