Nawigacja do miejsca docelowego

Komponent Nawigacja pozwala w prosty i ogólny sposób nawigacji do celu. Ten interfejs obsługuje różne konteksty i UI zasad. Możesz na przykład użyć komponentu Nawigacja z opcją tworzenia wiadomości, widoki, fragmenty, działania, a nawet niestandardowe platformy UI.

W tym przewodniku opisano sposób korzystania z komponentu Nawigacja do przechodzenia do w różnych kontekstach.

Używanie kontrolera NavController

Typ klucza używanego do poruszania się między miejscami docelowymi to NavController. Więcej informacji o klasie znajdziesz w artykule Tworzenie kontrolera nawigacji. i jak utworzyć jego instancję. Z tego przewodnika dowiesz się, jak z niego korzystać.

Nawigacja

Niezależnie od używanej platformy interfejsu użytkownika dostępna jest jedna funkcja, aby przejść do miejsca docelowego: NavController.navigate().

Dostępnych jest wiele przeciążeń dla funkcji navigate(). Przeciążenie, pasuje dokładnie do Twojego kontekstu. Na przykład należy użyć jednego z nich podczas przechodzenia do funkcji kompozycyjnej lub widoku.

W sekcjach poniżej opisujemy niektóre kluczowe przeciążenia funkcji navigate(), które można i ich używanie.

Przechodzenie do funkcji kompozycyjnej

Aby przejść do funkcji kompozycyjnej, należy użyć skrótu NavController.navigate<T>. Przy tym przeciążeniu navigate() przyjmuje pojedynczy argument route, dla którego przekazują typ. Jest to klucz do miejsca docelowego.

@Serializable
object FriendsList

navController.navigate(route = FriendsList)

Aby przejść do funkcji kompozycyjnej na wykresie nawigacyjnym, najpierw zdefiniuj NavGraph w taki sposób, aby każde miejsce docelowe odpowiadało typowi. Dla: za pomocą funkcji composable().

Udostępnianie zdarzeń z elementów kompozycyjnych

Gdy funkcja kompozycyjna musi przejść do nowego ekranu, nie przekazuj odwołuje się do NavController, by umożliwić bezpośrednie wywołanie navigate(). Zgodnie z zasadami uniwersalnego przepływu danych (UDF) powinien udostępniać zdarzenie obsługiwane przez NavController.

Funkcja kompozycyjna powinna mieć parametr typu () -> Unit. Gdy dodajesz miejsca docelowe do: NavHost za pomocą: composable() funkcji, przekaż wywołanie funkcji kompozycyjne do funkcji NavController.navigate().

Przykład znajdziesz w następnej podsekcji.

Ostrzeżenie: nie przekazuj elementu NavController do funkcji kompozycyjnych. Udostępnij zdarzenie jako opisane tutaj.

Przykład

W ramach demonstracji poprzednich sekcji zwróć uwagę na te punkty w ten fragment:

1. Każde miejsce docelowe na wykresie jest tworzone z użyciem trasy, która jest zserializowany obiekt lub klasa opisująca dane wymagane przez ten element miejsce docelowe.
2. Funkcja kompozycyjna MyAppNavHost zawiera instancję NavController.
3. W związku z tym wywołania navigate() powinny następować w tym miejscu, a nie w niższej funkcji kompozycyjnej, takiej jak ProfileScreen.
4. ProfileScreen zawiera przycisk, który przekierowuje użytkownika do strony FriendsList po kliknięciu. Nie powoduje ona jednak wywołania funkcji navigate().
5. Zamiast tego przycisk wywołuje funkcję, która jest widoczna jako parametr. onNavigateToFriends
6. Gdy funkcja MyAppNavHost doda do wykresu nawigacyjnego element ProfileScreen, przez onNavigateToFriends przekazuje wartość lambda, która wywołuje funkcję navigate(route = FriendsList).
7. Dzięki temu po naciśnięciu przez użytkownika przycisku ProfileScreen nawiguj poprawnie do: FriendsListScreen.

@Serializable
object Profile
@Serializable
object FriendsList

@Composable
fun MyAppNavHost(
    modifier: Modifier = Modifier,
    navController: NavHostController = rememberNavController(),

) {
    NavHost(
        modifier = modifier,
        navController = navController,
        startDestination = Profile
    ) {
        composable<Profile> {
            ProfileScreen(
                onNavigateToFriends = { navController.navigate(route = FriendsList) },
                /*...*/
            )
        }
        composable<FriendsList> { FriendsListScreen(/*...*/) }
    }
}

@Composable
fun ProfileScreen(
    onNavigateToFriends: () -> Unit,
    /*...*/
) {
    /*...*/
    Button(onClick = onNavigateToFriends) {
        Text(text = "See friends list")
    }
}

Ostrzeżenie: element navigate() należy wywołać tylko w ramach wywołania zwrotnego, a nie w ramach tego wywołania elementu kompozycyjnego. Pozwoli to uniknąć połączenia z użytkownikiem navigate() co zmianę kompozycji.

Nawigacja przy użyciu identyfikatora liczby całkowitej

Aby wyznaczyć trasę do miejsca docelowego przy użyciu identyfikatora w postaci liczby całkowitej, wywołaj funkcję navigate(int) przeciążenie. Przyjmuje identyfikator zasobu działania lub miejsca docelowego. ten fragment kodu pokazuje, jak za pomocą tego przeciążenia przejść do ViewTransactionsFragment:

Kotlin

viewTransactionsButton.setOnClickListener { view ->
  view.findNavController().navigate(R.id.viewTransactionsAction)
}

Java

viewTransactionsButton.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View view) {
      Navigation.findNavController(view).navigate(R.id.viewTransactionsAction);
  }
});

Gdy korzystasz z identyfikatorów, w miarę możliwości wykonuj działania. Działania dostarczają dodatkowych informacji na wykresie nawigacyjnym, prezentując, jak miejsca docelowe łączą się ze sobą.

Uwaga: w przypadku przycisków dostępne są 3 wersje Navigation.createNavigateOnClickListener() Te warianty są przydatne, jeśli: używasz języka programowania Java. Jeśli używasz Kotlin, OnClickListener to interfejs SAM, więc na końcu może być lambda. Ten może być krótsza i łatwiejsza do odczytania niż rozmowa createNavigateOnClickListener().

Uwaga: obsługa innych popularnych komponentów interfejsu, takich jak górny pasek aplikacji i dolna część strony. nawigacji, zapoznaj się z artykułem Aktualizowanie komponentów interfejsu za pomocą interfejsu NavigationUI.

Nawigacja za pomocą NavDeepLinkRequest

Aby przejść do miejsca docelowego precyzyjnego linku, użyj komponentu Przeciążenie navigate(NavDeepLinkRequest). Ten fragment kodu udostępnia implementacji tej metody:

Kotlin

val request = NavDeepLinkRequest.Builder
  .fromUri("android-app://androidx.navigation.app/profile".toUri())
  .build()
findNavController().navigate(request)

Java

NavDeepLinkRequest request = NavDeepLinkRequest.Builder
  .fromUri(Uri.parse("android-app://androidx.navigation.app/profile"))
  .build()
NavHostFragment.findNavController(this).navigate(request)

W przeciwieństwie do nawigacji za pomocą identyfikatorów działań lub miejsc docelowych możesz niezależnie od tego, czy miejsce docelowe jest widoczne. Dostępne opcje możesz przejść do miejsca docelowego na bieżącym wykresie lub do miejsca docelowego na inny wykres.

Uwaga: jeśli używasz NavDeepLinkRequest, stos tylny nie . Różni się to od innych form nawigacji za pomocą precyzyjnych linków. Jednak popUpTo() i popUpToInclusive() nadal usuwają miejsca docelowe z a potem tak samo jak przy korzystaniu z identyfikatora.

Uwaga: dla wygody możesz też użyć funkcji navigate(Uri), która obejmuje Uri w: DeepLinkRequest.

Działania i typy MIME

Oprócz Uri, NavDeepLinkRequest obsługuje również precyzyjne linki z atrybutami działania i typy MIME. Aby dodać działanie do prośby, użyj fromAction() lub setAction(). Aby dodać typ MIME do żądania: użyj fromMimeType() lub setMimeType().

Aby parametr NavDeepLinkRequest był prawidłowo dopasowywany do niejawnego miejsca docelowego precyzyjnego linku, identyfikator URI, działanie i typ MIME muszą być zgodne z parametrami NavDeepLink w polu miejsce docelowe. Identyfikatory URI muszą być zgodne ze wzorcem, a działania muszą być identyczne a typy MIME muszą być ze sobą powiązane. Na przykład image/jpg wskazuje dopasowanie do image/\*

Dalsze konteksty

Z tego dokumentu dowiesz się, jak maksymalnie wykorzystać możliwości NavController.navigate() w typowych przypadkach użycia. Funkcja ta ma jednak szereg przeciążeń, które można w różnych kontekstach i w połączeniu z dowolną platformą Ui. Zobacz w dokumentacji znajdziesz bardziej szczegółowe informacje o tych przeciążeniach.

Więcej materiałów

Więcej informacji znajdziesz na tych stronach:

• Tworzenie kontrolera nawigacji
• Nawigacja i stos tylny
• Nawigowanie z wykorzystaniem opcji
• Bezpieczeństwo pisania w usłudze Kotlin DSL i nawigacji Navigation Compose