Files de pàgines i piles de pàgines
La «PageRow»
La
PageRow
és un contenidor que col·loca els elements horitzontalment en una fila. Si tots els elements fills no caben a la PageRow
, es comportarà com una superfície Flickable
i es convertirà en una vista de columnes desplaçable horitzontalment.
Una PageRow pot mostrar una sola pàgina o diverses com a columnes, depenent de l'amplada de la finestra. En un telèfon, es podria veure una sola columna, mentre que en una tauleta o un ordinador d'escriptori, es veuran més d'una columna alhora.
Les columnes poden tenir totes la mateixa mida fixa, dimensionar-les amb impllicitWidth
o expandir-les automàticament per a ocupar tota l'amplada disponible. De manera predeterminada, l'última columna s'expandirà per a ocupar tot l'espai disponible.

Podeu accedir als mètodes de vista de columna des de la propietat pageStack
del vostre element
Kirigami.ApplicationWindow
o des de qualsevol altre lloc emprant applicationWindow().pageStack
.
La pàgina inicial s'afegeix amb la propietat pageStack.initialPage
. Com a exemple: en una aplicació senzilla que requereixi que l'usuari s'autentiqui, la pàgina inicial seria una pàgina d'inici de sessió.
Kirigami.ApplicationWindow {
pageStack.initialPage: LoginPage {}
}
Una vegada l'usuari hagi iniciat la sessió, haureu de substituir la pàgina d'inici de sessió amb la pàgina inicial de l'aplicació. Per a fer això, empraríem pageStack.replace
, eliminant la LoginPage
i substituint-la amb una HomePage
.
// LoginPage.qml
Kirigami.Page {
// formulari d'inici de sessió
Button {
onClicked: {
const user = Backend.authentificate(usernameField.text, passwordField.text);
if (user) {
applicationWindow().pageStack.replace("qrc:/HomePage.qml", {
user: user, // proporciona la informació de l'usuari registrat a la pàgina
// d'inici
});
} else {
// mostra el missatge d'error
}
}
}
}
Nota
pageStack.replace
accepts either a QML Component or a url to a QML file.Ara imaginem que teniu una pàgina de configuració a la qual voleu que l'usuari accedeixi des de la pàgina inicial. Voleu que l'usuari torni a la pàgina inicial, de manera que no podreu emprar replace
. En el seu lloc, emprarem push
per a inserir una pàgina nova en la pila.
// ConfigurationPage.qml
Kirigami.Page {
required property string var1
}
// HomePage.qml
applicationWindow().pageStack.push("qrc:/MyPage.qml", {
'var1': 'Hello',
});
També podeu veure:
- pop una pàgina (la qual elimina l'última pàgina de la pila) o
- empreu insertPage per a inserir una pàgina en una posició específica a la pila,
- empreu movePage per a moure pàgines específiques dins de la pila, o
- netegeu totes les pàgines de la pila.
També podeu modificar currentIndex
per a canviar la pàgina actualment activa mitjançant la programació, o emprar flickBack per a simular moure una pàgina cap enrere en la pila.
Capes (Layer)
De moment, només hem vist la navegació horitzontal funcionant en una pila bidimensional. També podeu emprar capes a l'aplicació per a inserir-hi una pàgina de pantalla completa.
En aquest cas, només estarà visible una pàgina alhora en el dispositiu mòbil i a l'escriptori.
Les capes són accessibles des d'una pageStack.layers
i utilitzen la mateixa API que pageStack
.