Razlaganje strani
Naša aplikacija
V prejšnjem učbeniku, smo uspeli vzpostaviti, graditi, in prevesti našo prvo Kirigami aplikacijo. Z osnovami, ki so na mestu, lahko začnemo naše potovanje v smeri ustvarjanja celotne aplikacije z veliko možnostmi.
Te vaje se bodo osredotočile na ustvarjanje aplikacije, ki uporabniku dovoli, da vidi, koliko dni je ostalo do dogodka po svoji izbiri. To ne pomeni, da ne smete odstopati in poskušati ustvariti svoje stvari! Samo poskrbite, da boste pozorno pozorni na to, kako stvari delujejo v prvo, tako da se lahko prilagodite, ko so stvari drugačne v vaši lastni kodi. Priporočamo vam tudi, da preverite Kirigami Gallery, ki ponuja številne uporabne primere uporabniškega vmesnika in omogoča enostaven dostop do vse kode.
V tem razdelku se bomo osredotočili na strani, enega ključnih strukturnih elementov vsake Kirigami aplikacije.
Strani
Kirigami aplikacije so običajno organizirane v strani Pages . To so različni "zasloni" aplikacije. Želeli boste imeti stran, posvečeno določenim vidikom interakcije v aplikaciji, in lahko ustvarite različne QML datoteke, ki vsebujejo kodo za vsako stran.
Strani so organizirane v skladu strani page stack , kjer jih je mogoče pokriti (angl. push) in odkriti (angl. pop). V telefonu je prikazana le vrhnja stran, na večjem zaslonu (namizju ali tabličnem računalniku) pa je mogoče med seboj pokazati več strani eno zraven druge.
Opomba
KDE ima Smernice za uporabniški vmesnik Human Interface Guidelines (HIG), ki vsebuje podrobnosti o tem, kako najbolje zasnovati svojo aplikacijo. Navodila bodo pomagala zagotoviti, da vaša aplikacija ostane uporabna, dosledna in estetska.
Stran Kirigami.Page deduje od strani Controls.Page , tako da lahko uporabite tudi lastnosti slednje.
Pojdimo nazaj na datoteko 'main.qml', ki smo jo ustvarili v prejšnji vaji:
|
|
Našo aplikacijo zaženemo z našo stranjo Kirigami.Page . Vse, kar smo vključili vanjo, je oznaka, ki vsebuje 'Hello World', ampak bomo obnašanje še malo izboljšali.
Zamisel naše aplikacijo je, da bomo lahko uporabniku prikazali nekaj odštevanj. Težava pri normalni strani Kirigami.Page je v tem, da ima fiksno navpično velikost, vendar ne skrbite: Kirigami podpira tudi pomikanje strani. Stran Kirigami.ScrollablePage bo zdaj zamenjal našo glavno stran.
Opozorilo
Če ste sem prišli pred vajo, ste morda opazili, da obstaja tudi taka stvar, kot je ScrollView , ki jo lahko uporabite za vsebino komponent. Vendar NE dajajte 'ScrollView' v notranjost 'ScrollablePage', saj lahko to povzroča težave. Nasledniki 'ScrollablePage' so funkcionalno že v 'ScrollView'.
|
|
Kirigami strani imajo tudi lepe naslove, ki so v orodni vrstici, da uporabniku hitro označujejo, na kateri strani so. Vse, kar moramo storiti za nastavitev naslova strani z lastnostjo 'title' v Kirigami.ScrollablePage . V tem primeru smo uporabili eno od funkcij 'i18nc()', ki smo jo raziskali že v naši prejšnji vaji.
Opomba
Določite lahko vašo stran v v svojem dokumentu QML. Če želite to storiti, ustvarite novo datoteko QML, kot na primer "StartPage.qml", jo dodajte v vašo datoteko resources.qrc
in nastavite okno, da je to prva naložena stran takole:
pageStack.initialPage: Qt.resolvedUrl("StartPage.qml")
'pageStack.initialPage' določa začetno stran sklada strani in Qt.resolvedUrl pretvori relativni naslov URL datoteke QML v absolutni naslov.
Obstajajo še dodatne informacije o alternativnih strukturah strani v naši dokumentaciji o Kirigami.