Dodajanje dejanj
Povzetek
Doslej nam je uspelo zgraditi preprosto aplikacijo, ki lahko prikazuje kartice. Vendar še nimamo načina dodajanja novih kartic v naš pogled kartic.
V tem učbeniku, bomo videli akcije Kirigami. Te nam bodo pomagale dodati interaktivnost v našo aplikacijo na dosleden, hiter in dostopen način.
Dejanja
Kirigami.Action vsebuje dejanje uporabniškega vmesnika. Z njimi lahko našim aplikacijam zagotovimo enostavno dostopna dejanja, ki so bistvena za njihovo funkcionalnost.

Dejanja strani na namizju

Dejanja strani na mobilni napravi
Če ste že prej uporabljali aplikacije Kirigami, ste zagotovo že spoznali interakcijo z Kirigami Actions. Na tej sliki lahko vidimo dejanja na desni strani naslova z različnimi ikonami. Kirigami Actions se lahko prikažejo na več načinov in lahko naredijo veliko različnih stvari.
Dodajanje odštevanj
Aplikacija za odštevanje je precej neuporabna brez možnosti dodajanja odštevanja. Ustvarimo akcijo, ki nam bo to dovolila.
pageStack.initialPage: Kirigami.ScrollablePage {
...
actions.main: Kirigami.Action {
id: addAction
icon.name: "list-add"
text: i18nc("@action:button", "Add kountdown")
onTriggered: kountdownModel.append({
name: "Kirigami Action added card!",
description: "Congratulations, your Kirigami Action works!",
date: 1000
})
}
...
}
Mi smo postavili naše dejanje Kirigami Action znotraj naše glavne strani iz naših prejšnjih vaj. Če bi želeli, bi lahko na našo stran dodali še več dejanj (in celo ugnezdili dejanja znotraj dejanj!). Komponente Kirigami.Action se uporabljajo kot kontekstualna dejanja na straneh Kirigami. Posebej nastavljamo lastnost strani actions.main predmet naše strani Kirigami.Page ima lastnosti, ki nam dovolijo nastaviti različna dejanja na različnih položajih, ker pa je naše dejanje 'Add kountdown' osrednje za naš uporabniški vmesnik, ga nastavljamo kot glavno dejanje te strani.
Lastnosti 'id' in 'text' bi vam morale biti znane iz prejšnjih vaj. Vendar pa bi morala biti nova podedovana lastnost Action.icon zanimiva: je namreč predmet z več lastnostmi, ki vam dovolijo prikazati določene ikone za dejanja. Na srečo je za uporabo ikon KDE vse, kar moramo storiti, zagotoviti ime lastnosti ikone 'icon.name'.
Opomba
Cuttlefish je aplikacija KDE, ki vam dovoli, da si ogledate vse ikone, ki jih lahko uporabite za svojo aplikacijo. Ponuja številne uporabne funkcije, kot so predogledi njihovega videza v različnih nameščenih temah, predogledi v različnih velikostih in drugo. Pri odločanju, katere ikone boste uporabili v aplikaciji, boste morda našli uporabno orodje.
Mnoge ikone KDE sledijo specifikaciji poimenovanja ikon FreeDesktop. Zato se utegne biti tudi koristno, da se posvetujete s spletnim mestom projekta FreeDesktop, ki na svoji spletni strani našteva vsa imena združljivih ikon.
Prožilnik
onTriggered
je najpomembnejši. To bo naredila naša dejavnost, ko bo uporabljena. Opazili boste, da v našem primeru uporabljamo metodo kountdownModel.append modela 'kountdownModel', ki smo ga ustvarili v prejšnjih vajah. S to metodo lahko v naš model seznama priložimo nov element. Ponujamo mu predmet, ki ima ustrezne lastnosti za naše odštevanje (ime - name
, opis - description
in datum bodoče lokacije - placeholder date
).

Vsakič, ko kliknemo naš gumb "Add kountdown" na zgornjem desnem kotu, je dodano naše odštevanje po meri

Mobilna verzija
Globalni predal
Ste opazili tiste tri vrstice poleg naslova strani na prejšnjem zajemu zaslona? To je hamburger meni, ki odpira globalni predal Kirigami.GlobalDrawer . Globalni predali so uporabni za globalno krmarjenje in dejanja: z drugimi besedami, tiste stvari, ki jih boste morda morali uporabljati vseskozi v aplikaciji. Ustvarili bomo preprost globalni predal, ki vključuje gumb za zapiranje.
Kirigami.ApplicationWindow {
id: root
...
globalDrawer: Kirigami.GlobalDrawer {
isMenu: true
actions: [
Kirigami.Action {
text: i18n("Quit")
icon.name: "gtk-quit"
shortcut: StandardKey.Quit
onTriggered: Qt.quit()
}
]
}
...
}
Tukaj smo dali naš globalni predal v okno aplikacije. Glavna lastnost, na katero moramo biti pozorni, so dejavnosti GlobalDrawer.actions , ki so v obliki elementov vektorja komponent Kirigami.Action . To dejanje ima ustrezno ikono in sproži funkcijo Qt.quit() in zapre program.
Ker za zdaj ohranjamo naš globalni predal preprost, postavljamo lastnost GlobalDrawer.isMenu na true. To prikazuje naš globalni predal kot običajni meni aplikacije, ki zavzame manj prostora kot privzeto podokno globalnega predala.

Globalni predal

Globalni predal kot meni
Opomba
Stran Actions based componentsv teh dokumentih vsebuje dodatne podrobnosti o dejanjih Kirigami in načinu, kako jih je mogoče uporabiti.Naša aplikacija do sedaj
|
|