Zu einem Ziel navigieren

Die Komponente „Navigation“ bietet eine einfache und allgemeine Möglichkeit, auf dem Weg zu einem Ziel ist. Diese Schnittstelle unterstützt eine Reihe von Kontexten und UI-Elementen Frameworks. Sie können beispielsweise die Navigationskomponente mit „Schreiben“ verwenden, Ansichten, Fragmenten, Aktivitäten und sogar benutzerdefinierten UI-Frameworks erstellen.

In diesem Leitfaden wird beschrieben, wie Sie mithilfe der Navigationskomponente zu einer in verschiedenen Kontexten.

NavController verwenden

Der Schlüsseltyp, den Sie zum Wechseln zwischen Zielen verwenden, ist NavController. Weitere Informationen zur Klasse selbst finden Sie unter Navigations-Controller erstellen. und wie Sie eine Instanz davon erstellen. In diesem Leitfaden wird die Verwendung beschrieben.

Navigieren

Unabhängig davon, welches UI-Framework Sie verwenden, können Sie eine einzige Funktion verwenden, , um zu einem Ziel zu gelangen: NavController.navigate().

Für navigate() sind viele Überlastungen verfügbar. Die Überlastung, die Sie die Ihrem genauen Kontext entsprechen. Sie sollten z. B. eine beim Navigieren zu einer zusammensetzbaren Funktion und einer anderen beim Navigieren zu einer Ansicht.

In den folgenden Abschnitten werden einige der wichtigsten navigate()-Überlastungen beschrieben, die Sie verwenden.

Rufen Sie eine zusammensetzbare Funktion auf.

Um eine zusammensetzbare Funktion aufzurufen, verwenden Sie NavController.navigate<T>. Bei dieser Überlast übernimmt navigate() ein einzelnes route-Argument, für das Sie einen Typ übergeben. Sie dient als Schlüssel für ein Ziel.

@Serializable
object FriendsList

navController.navigate(route = FriendsList)

Um in der Navigationsgrafik zu einer zusammensetzbaren Funktion zu navigieren, definieren Sie zuerst Ihre NavGraph, sodass jedes Ziel einem Typ entspricht. Für zusammensetzbare Funktionen verwenden, verwenden Sie dafür die Funktion composable().

Ereignisse aus zusammensetzbaren Funktionen freigeben

Wenn eine zusammensetzbare Funktion zu einem neuen Bildschirm wechseln muss, Es handelt sich um einen Verweis auf NavController, sodass navigate() direkt aufgerufen werden kann. Gemäß den Prinzipien des unidirektionalen Datenflusses (Unidirektionaler Datenfluss, UDF) kann die zusammensetzbare Funktion sollte stattdessen ein Ereignis bereitstellen, das von NavController verarbeitet wird.

Direkter ausgedrückt: Ihre zusammensetzbare Funktion sollte einen Parameter vom Typ () -> Unit haben. Wenn Sie NavHost mit der composable() Ziele hinzufügen -Funktion verwenden, übergeben Sie Ihrer zusammensetzbaren Funktion einen Aufruf an NavController.navigate().

Ein Beispiel hierfür finden Sie im folgenden Unterabschnitt.

Warnung: Übergeben Sie NavController nicht an die zusammensetzbaren Funktionen. Ereignis freigeben als beschrieben.

Beispiel

Berücksichtigen Sie als Demonstration der vorherigen Abschnitte diese Punkte in der folgendes Snippet:

1. Jedes Ziel in der Grafik wird mithilfe einer Route erstellt. Dabei handelt es sich um eine serialisierbares Objekt oder eine serialisierbare Klasse, die die dafür erforderlichen Daten Ziel.
2. Die zusammensetzbare Funktion MyAppNavHost enthält die Instanz NavController.
3. Dementsprechend sollten Aufrufe von navigate() dort und nicht in einer niedrigeren zusammensetzbar wie ProfileScreen.
4. ProfileScreen enthält eine Schaltfläche, über die der Nutzer zu FriendsList weitergeleitet wird wenn darauf geklickt wird. Es ruft jedoch nicht selbst navigate() auf.
5. Stattdessen ruft die Schaltfläche eine Funktion auf, die als der Parameter onNavigateToFriends
6. Wenn MyAppNavHost dem Navigationsdiagramm ProfileScreen hinzufügt, onNavigateToFriends wird eine Lambda-Funktion übergeben, die navigate(route = FriendsList aufruft.
7. Dadurch wird sichergestellt, dass Nutzende, wenn sie auf die Schaltfläche ProfileScreen Navigieren Sie korrekt zu 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")
    }
}

Warnung: Rufen Sie navigate() nur als Teil eines Rückrufs und nicht als Teil eines Rückrufs auf. Ihrer zusammensetzbaren Funktion selbst. Dadurch wird navigate() nicht auf jedem neu zusammensetzen.

Mit ganzzahliger ID navigieren

Rufen Sie die Methode navigate(int) auf, um mithilfe einer ganzzahligen ID zu einem Ziel zu gelangen. Überlastung. Sie verwendet die Ressourcen-ID einer Aktion oder eines Ziels. Die Das folgende Code-Snippet zeigt, wie Sie mithilfe dieser Überlastung 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);
  }
});

Wenn Sie IDs verwenden, sollten Sie nach Möglichkeit Aktionen verwenden. Aktionen zusätzliche Informationen in Ihrem Navigationsdiagramm zur Verfügung stellen, die visuell zeigen, die Ziele miteinander verbunden sind.

Hinweis: Für Schaltflächen gibt es drei Varianten von Navigation.createNavigateOnClickListener() Diese Varianten sind nützlich, wenn Sie verwenden die Programmiersprache Java. Wenn Sie Kotlin verwenden, OnClickListener ist eine SAM-Schnittstelle, sodass Sie eine nachgestellte Lambda-Funktion verwenden können. Dieses kann kürzer und leichter zu lesen sein als createNavigateOnClickListener() direkt.

Hinweis :Zur Verarbeitung anderer gängiger UI-Komponenten wie der oberen und unteren App-Leiste. findest du unter UI-Komponenten mit NavigationUI aktualisieren.

Mit NavDeepLinkRequest navigieren

Wenn Sie zu einem impliziten Deeplink-Ziel wechseln möchten, verwenden Sie die Methode navigate(NavDeepLinkRequest)-Überlastung. Das folgende Snippet bietet eine Implementierung dieser Methode:

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)

Im Gegensatz zur Navigation mit Aktions- oder Ziel-IDs können Sie zu jeder beliebigen in der Grafik, unabhängig davon, ob das Ziel sichtbar ist. Sie können navigieren Sie zu einem Ziel in der aktuellen Grafik oder zu einem Ziel in einer in einer anderen Grafik.

Achtung :Wenn Sie mit NavDeepLinkRequest navigieren, wird der Back-Stack nicht zurückgesetzt werden. Dieses Verhalten unterscheidet sich von anderen Formen der Navigation über Deeplinks. popUpTo() und popUpToInclusive() entfernen jedoch immer noch Ziele aus dem Back-Stack so, als ob Sie mit einer ID navigiert hätten.

Hinweis: Der Einfachheit halber können Sie auch navigate(Uri) verwenden, das ein umschlossenes Uri in einem DeepLinkRequest.

Aktionen und MIME-Typen

Neben Uri unterstützt NavDeepLinkRequest auch Deeplinks mit Aktionen und MIME-Typen. Um der Anfrage eine Aktion hinzuzufügen, verwenden Sie fromAction() oder setAction() Um einen MIME-Typ zu einer Anfrage hinzuzufügen, Verwenden Sie fromMimeType() oder setMimeType().

Damit ein NavDeepLinkRequest richtig mit einem impliziten Deeplink-Ziel übereinstimmt, URI, Aktion und MIME-Typ müssen alle mit dem NavDeepLink im Ziel. URIs müssen mit dem Muster übereinstimmen, die Aktionen müssen genau übereinstimmen, und die MIME-Typen müssen verwandt sein. Beispielsweise stimmt image/jpg mit image/\*

Weitere Kontexte

In diesem Dokument erfahren Sie, wie Sie NavController.navigate() in den meisten häufige Anwendungsfälle. Die Funktion weist jedoch eine Reihe von Überlastungen auf, in verschiedenen Kontexten und in Verbindung mit Ui-Frameworks verwenden können. Weitere Informationen finden Sie in der finden Sie weitere Informationen zu diesen Überlastungen.

Weitere Informationen

Weitere Informationen finden Sie auf den folgenden Seiten:

• Navigationscontroller erstellen
• Navigation und Back Stack
• Navigation mit Optionen
• Typsicherheit in Kotlin DSL und Navigation Compose