Używanie stron z kartami ze stronami w stosie nawigacji

Nawigacja wysuwana i z kartami to tylko dwa sposoby umożliwienia użytkownikowi nawigowania po danych prezentowanych przez aplikację. Inną techniką jest użycie nawigacji stosu. Każdy typ nawigacji jest odpowiedni dla różnych typów relacji między stronami.

Nawigację stosu można używać w połączeniu z wysuwanymi i kartami. W tej lekcji krótko zapoznamy się z różnicami między nawigacją na karcie i wysuwaną nawigacją po stosie, a następnie dowiesz się, jak tworzyć aplikacje łączące obie techniki.

Przegląd wysuwanych i nawigacji na kartach

Okna wysuwane i nawigacja na kartach zapewniają przydatny mechanizm umożliwiający użytkownikowi wybranie strony do wyświetlenia w dowolnym momencie. Użytkownik przechodzi do strony po prostu wybierając odpowiednią kartę lub element wysuwany. Ta forma nawigacji jest przydatna w przypadku elementów danych, które mają relację równorzędną ze sobą. W aplikacji astronomicznej strony Słońce, Księżyc i Informacje są wszystkimi elementami równorzędnymi; nie ma bezpośredniej relacji między nimi.

Jednak w przypadku danych hierarchicznych nawigacja stosu może być bardziej odpowiednia. Nawigacja stosu umożliwia użytkownikowi przechodzenie do szczegółów serii stron, gdzie następna strona w stosie zapewnia bardziej szczegółowy widok wybranego elementu na poprzedniej stronie.

Rozważmy następujący scenariusz:

Do aplikacji astronomicznej dodaje się nową stronę, która wyświetla ciała astronomiczne. Chcesz, aby użytkownik nacisnął jeden z tych obiektów niebiańskich, a następnie wyświetlił informacje o nim. Strona zawierająca listę ciał astronomicznych najlepiej byłoby przedstawić na stronie karty jako element równorzędny fazy księżyca i stron wschód słońca. Szczegółowe informacje o ciele astronomicznym są lepiej przedstawione jako seria kroków korzystających z nawigacji stosu. Ten mechanizm umożliwia również użytkownikowi powrót do głównej strony ciał astronomicznych przez naciśnięcie przycisku Wstecz.

Nawigowanie po nawigacji stosem

Powłoka interfejsu użytkownika aplikacji wieloplatformowej platformy .NET (MAUI) zawiera środowisko nawigacji oparte na identyfikatorze URI, które używa tras do przechodzenia do dowolnej strony w aplikacji bez konieczności korzystania z ustawionej hierarchii nawigacji. Ponadto umożliwia przechodzenie do tyłu bez konieczności odwiedzania wszystkich stron w stosie nawigacji.

Klasa Shell definiuje następujące właściwości związane z nawigacją:

• BackButtonBehavior, typu BackButtonBehavior, dołączona właściwość, która definiuje zachowanie przycisku Wstecz.
• CurrentItem, typu ShellItem, aktualnie wybranego elementu.
• CurrentPage, typu Page, aktualnie prezentowana strona.
• CurrentState, typu ShellNavigationState, bieżący stan nawigacji .Shell
• Current, typu , alias rzutowany na typ Shelldla .Application.Current.MainPage

Nawigacja jest wykonywana przez wywołanie GoToAsync metody z Shell klasy .

Trasy

Nawigacja jest wykonywana w aplikacji powłoki, określając identyfikator URI do przejścia do. Identyfikatory URI nawigacji mogą mieć trzy składniki:

• Trasa, która definiuje ścieżkę do zawartości, która istnieje w ramach hierarchii wizualizacji powłoki.
• Strona. Strony, które nie istnieją w hierarchii wizualizacji powłoki, można wypchnąć do stosu nawigacji z dowolnego miejsca w aplikacji powłoki. Na przykład strona szczegółów nie jest zdefiniowana w hierarchii wizualizacji powłoki, ale można ją wypchnąć do stosu nawigacji zgodnie z potrzebami.
• Co najmniej jeden parametr zapytania. Parametry zapytania to parametry, które można przekazać do strony docelowej podczas nawigowania.

Gdy identyfikator URI nawigacji zawiera wszystkie trzy składniki, struktura to: //route/page?queryParameters

Rejestrowanie tras

Trasy można definiować na FlyoutItemobiektach , , TabBarTabi ShellContent za pomocą ich Route właściwości:

<Shell ...>
    <FlyoutItem ... 
        Route = "astronomy">
        <ShellContent ...
            Route="moonphase" />
        <ShellContent ...
            Route="sunrise" />
    </FlyoutItem>
    <FlyoutItem>
        <ShellContent ...
            Route="about" />
    </FlyoutItem>
</Shell>

Aby przejść do moonphase trasy, bezwzględny identyfikator URI trasy to //astronomy/moonphase

Rejestrowanie tras szczegółów

W konstruktorze Shell podklasy lub w dowolnej innej lokalizacji, która jest uruchamiana przed wywołaną trasą, można jawnie zarejestrować trasę przy użyciu Routing.RegisterRoute metody dla wszystkich stron szczegółów, które nie są reprezentowane w hierarchii wizualizacji powłoki.

Routing.RegisterRoute("astronomicalbodydetails", typeof(AstronomicalBodyPage));

Aby przejść do metody AstronomicalBodyPage, należy wywołać następujące polecenie:

await Shell.Current.GoToAsync("astronomicalbodydetails");`

Nawigacja wstecz

Nawigacja wsteczna może być wykonywana przez określenie ".". Jako argument metody GoToAsync :

await Shell.Current.GoToAsync("..");

Przekazywanie danych

Dane pierwotne mogą być przekazywane jako parametry zapytania oparte na ciągach podczas wykonywania nawigacji programowej opartej na identyfikatorze URI. Przekaż dane, dołączając ? je po trasie, a następnie identyfikator parametru zapytania, =i wartość:

string celestialName = "moon";

await Shell.Current.GoToAsync($"astronomicalbodydetails?bodyName={celestialName}");

W tym przykładzie trasa jest astronomiczną wartościąbodydetails, parametrem jest bodyName, a wartość pochodzi ze zmiennej celestialName.

Pobieranie danych

Dane nawigacji można odbierać, dekorując klasę odbierającą za pomocą QueryPropertyAttribute parametru zapytania dla każdego parametru zapytania opartego na ciągu i parametru nawigacji opartej na obiektach:

[QueryProperty(nameof(AstroName), "bodyName")]
public partial class AstronomicalBodyPage : ContentPage
{
    string astroName;
    public string AstroName
    {
        get => astroName;
        set
        {
            astroName = value;
        }
    }

    ...
}

W tym przykładzie pierwszy argument queryPropertyAttribute określa nazwę właściwości odbierającej dane, a drugi argument określający identyfikator parametru.