Wiersze stron i stosy stron

Dodaj przepływ do swojej aplikacji: Dodawaj, usuwaj lub zastępuj strony na różne sposoby

PageRow

PageRow jest pojemnikiem, który rozmieszcza nasze rzeczy w poziomie w wierszu. Jeśli rzeczy podrzędne nie mieszczą się w PageRow , to będzie zachowywać się jak powierzchnia Flickable i stanie się widokiem kolumn przewijanych w poziomie.

PageRow może pokazać pojedynczą stronę lub kilka stron w kolumnach, w zależności od szerokości okna. Na telefonie, będzie wyświetlana pojedyncza kolumna, podczas gdy na tablecie lub komputerze biurkowym powinna być wyświetlana więcej niż jedna kolumna na raz.

Wszystkie kolumny mogą mieć ten sam rozmiar, mieć własny rozmiar nadany przez implicitWidth lub samoczynnie rozszerzać się, aby zająć całe dostępne miejsce. Domyślnie, ostatnia kolumna rozszerzy się, aby zająć całe dostępne miejsce.

Zrzut ekranu PageRow

Aby dotrzeć do metod metod widoku kolumny, możesz użyć właściwości pageStack swojego Kirigami.ApplicationWindow lub z dowolnego miejsca, używając applicationWindow().pageStack.

Początkowa strona została dodana przez właściwość pageStack.initialPage. Jako przykład: w prostej aplikacji, która wymaga od użytkownika jego uwierzytelnienia, początkową stroną byłaby strona logowania.

Kirigami.ApplicationWindow {
    pageStack.initialPage: LoginPage {}
}

Gdy użytkownik zaloguje się już do aplikacji, to będziesz musiał zastąpić stronę logowania stroną domową aplikacji. Aby to zrobić, będziesz musiał użyć pageStack.replace, usuwając stronę LoginPage i zastępując ją stroną HomePage.

// LoginPage.qml
Kirigami.Page {
    // Formularz logowania

    Button {
        onClicked: {
            const user = Backend.authentificate(usernameField.text, passwordField.text);
            if (user) {
                applicationWindow().pageStack.replace("qrc:/HomePage.qml", {
                    user: user, // give the registered user information to the homepage
                });
            } else {
                // wyświetl wiadomość błędu
            }
        }
    }
}

Teraz wyobraźmy sobie, że masz stronę ustawień, do której chciałbyś aby użytkownik miał dostęp ze strony domowej. Chciałbyś, aby użytkownik mógł wrócić do strony domowej, więc nie możesz użyć replace. Zamiast tego, użyłbyś push, aby wypchnąć nową stronę na stos.

// ConfigurationPage.qml
Kirigami.Page {
    required property string var1
}
// HomePage.qml
applicationWindow().pageStack.push("qrc:/MyPage.qml", {
    'var1': 'Hello',
});

Możesz także:

  • pop stronę (co usuwa ostatnią stronę ze stosu) lub
  • użyj insertPage do wstawienia strony w danym miejscu stosu,
  • użyj movePage , aby przenieść dane strony wewnątrz stosu lub
  • wyczyść wszystkie strony ze stosu.

Możesz także zmienić currentIndex, aby programowo zmienić obecnie wyświetlaną stronę lub użyć flickBack, aby zasymulować przesuwanie strony na dół stosu.

Warstwy

Na tę chwilę, widzieliśmy działanie poruszania się tylko w poziomie na 2 wymiarowym stosie. Możesz także użyć warstw w swojej aplikacji, aby wyświetlić stronę na pełnym ekranie.

W tym przypadku, tylko jedna strona na raz jest widoczna na urządzeniach przenośnych oraz na biurkowych.

Warstwy są dostępne z pageStack.layers i używają tego samego API co pageStack.