Listo vidoj

Listviews povas helpi vin montri objektojn de modelo en alloga maniero. Por uzi listvidon, vi devas observi tri aferojn:

1. La modelo, kiu enhavas la datumojn, kiujn vi volas ke via listvido montru
2. La delegito, kiu difinas kiel ĉiu elemento en la modelo estos montrata
3. La listvido mem, kiu montros informojn el la modelo laŭ la delegito

Se vi ŝatus plian klarigon, la Qt-dokumentado havas informan paĝon pri la temo.

Kreante bazan listvidon

Listvido havas du esencajn ecojn, pri kiuj ni devas atenti:

• modelo, kiu akceptas la datumojn aŭ la id de la objekto kiu tenas la datumojn
• delegito, kiu akceptas la komponanton, kiun ni uzos por montri la datumojn en la modelo

import QtQuick 2.15
import QtQuick.Controls 2.15 as Controls
import QtQuick.Layouts 1.15
import org.kde.kirigami 2.20 as Kirigami

Kirigami.Page {

    ListView {
        id: myList

        // Provizi nombron por la modela propreco generos tiun nombron da dateneniroj ekde 0.
        model: 200

        delegate: Kirigami.BasicListItem {
            label: "Item " + modelData
        }
    }
}

En kazoj kie viaj modelaj datumoj nur enhavas ununuran datumon, kiel en la supra ekzemplo, vi povas simple kapti la datumojn en la modelo referencante modelData. -modelviewsdata-modelview.html#modeloj).

Noto pri delegitoj: se via modelo enhavas objektojn kun datumoj en nomitaj propraĵoj, la nomo de ĉi tiuj trajtoj estos aŭtomate elmontrita al via delegito kaj vi nur bezonos uzi ĉi tiujn nomojn en via delegito.

ListModel {
    id: myModel
    ListElement { type: "Item"; number: 0 }
    ListElement { type: "Item"; number: 1 }
    ListElement { type: "Item"; number: 2 }
    ListElement { type: "Item"; number: 3 }
}

ListView {
    id: myList

    model: myModel

    delegate: Kirigami.BasicListItem {
        label: type + " " + number
    }
}

Kirigami ofertas kelkajn komponentojn kiuj estis dezajnitaj specife por uzo en listvidoj, kiel ekzemple Kirigami.BasicListItem , Kirigami.CheckableListItem kaj [Kirigami.SwipeListItem] (docs:kirigami2;SwipeListItem), ĉiuj el kiuj baziĝas sur Kirigami.AbstractListItem . Ekzistas ankaŭ Kirigami.CheckDelegate , Kirigami.RadioDelegate , kaj Kirigami.SwitchDelegate , kiuj estas dizajnitaj por utiligi tiuj specifaj regiloj.

Tamen, vi ne estas limigita al uzado de ĉi tiuj komponantoj kaj vi povas elekti kiujn vi deziras. Ĉi tio eble postulas iom da tajlado de via aranĝo.

Mesaĝoj de lokokupilo

En iuj kazoj, vi eble volas uzi listvidon, kiu estas malplena ĝis la uzanto faras ion. En ĉi tiuj situacioj, uzi Kirigami.PlaceholderMessage povas esti alloga maniero diri al via uzanto ke la listo estas malplena kaj ke ili povas fari ion pri ĝi.

Vi ĝenerale volos meti loktenilon mesaĝon en la centron de la ListView kaj vi verŝajne ne volos, ke ĝi ampleksas la tutan larĝon de la ListView. Vi evidente ankaŭ volas, ke ĝi estu kaŝita post kiam la modelo de ListView pleniĝos per datumoj. Feliĉe, ListViews havas proprecon nomitan count kiu faras ĉi tion sufiĉe facila.

Vi eble ankaŭ volas aldoni helpan agon al via lokokupilo-mesaĝo. Ĉi tio povas esti farita alfiksante agon al la propreco PlaceholderMessage.helpfulAction .

ListView {
    id: myList

    model: ListModel { id: myModel }

    delegate: Kirigami.BasicListItem {
        label: text
    }

    Kirigami.PlaceholderMessage {
        anchors.centerIn: parent
        width: parent.width - Kirigami.Units.largeSpacing * 4
        visible: myList.count === 0
        text: "Add something to me!"

        helpfulAction: Kirigami.Action {
            icon.name: "list-add"
            text: "Add"
            onTriggered: myModel.append({"text": "Hello!!"})
        }
    }
}