Pogledi seznama

Pregledi seznamov Listviews vam lahko pomagajo prikazati predmete iz modela na privlačen način. Če želite uporabiti pogled seznama, morate spremljati tri stvari:

1. model, ki vsebuje podatke, ki jih želite prikazati v pogledu seznama
2. delegat, ki določa, kako bo vsak element v modelu prikazan
3. Sam pogled seznama, ki bo prikazoval informacije iz modela v skladu z delegatom

Če želite dodatno pojasnilo, ima dokumentacija Qt informativna stran na to temo.

Ustvarjanje osnovnega pregleda seznama

Seznamski pogled ima dve bistveni lastnosti, na kateri moramo biti pozorni:

• model, ki sprejema podatke ali 'id' predmeta, ki nosi podatke
• delegate, ki sprejema komponento, ki jo bomo uporabili za prikaz podatkov v modelu

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

        // Če navedete številko za lastnost modela, boste ustvarili, da se števec vnosov podatkov
        // začne od 0.
        model: 200

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

V primerih, ko podatki modela vsebujejo samo en del podatkov, kot v zgornjem primeru, lahko podatke v modelu zgrabite tako, da se sklicujete na modelData.

Opomba o delegatih, če vaš model vsebuje predmete s podatki v imenovanih lastnostih, bo ime teh lastnosti samodejno izpostavljeno vašemu delegatu in samo ta imena boste morali uporabljati v delegatu.

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 ponuja številne komponente, ki so bile zasnovane posebej za uporabo v pogledih seznama, kot so Kirigami.BasicListItem , Kirigami.CheckableListItem and Kirigami.SwipeListItem , vse pa gradijo na Kirigami.AbstractListItem . Obstajajo tudi Kirigami.CheckDelegate , Kirigami.RadioDelegate in Kirigami.SwitchDelegate , ki so zasnovani tako, da izkoristijo te posebne kontrole.

Vendar pa niste omejeni na uporabo teh komponent in lahko izberete, katere želite - čeprav to lahko pomeni nekaj preoblikovanja v vašo postavitev.

Sporočila oznak lokacije

V nekaterih primerih boste morda želeli uporabiti pogled seznama, ki je prazen, dokler uporabnik nekaj ne naredi. V teh primerih je lahko uporaba Kirigami.PlaceholderMessage privlačen način, da uporabniku poveste, da je seznam prazen in da lahko nekaj stori glede tega.

Na splošno boste želeli postaviti predmet placeholder message v središče predmeta seznam pogledov (ListView) in bi tudi želeli, da se ne bo razprl čez celotno širino predmeta seznama pogledov. Očitno boste tudi želeli, da ne bo viden, ko bo model seznama pogledov napolnjen s podatki: na srečo imajo seznami pogledov lastnost z imenom count, zaradi katere je to zelo enostavno.

V predmet placeholder message boste morda želeli dodati tudi dejanje pomoči. To lahko storite tako, da priložite dejanje lastnosti 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!!"})
        }
    }
}