Navigation mit Compose für Wear OS

Die Navigationskomponente in Android Jetpack unterstützt Jetpack Compose-Anwendungen. Sie können zwischen den zusammensetzbaren Funktionen wechseln und gleichzeitig die Infrastruktur und Funktionen der Navigationskomponente nutzen.

Auf dieser Seite werden die Unterschiede zur Jetpack-Navigation in Compose für Wear OS beschrieben.

Einrichten

Verwenden Sie die folgende Abhängigkeit in der build.gradle-Datei Ihres App-Moduls:

Kotlin


dependencies {
    def wear_compose_version = "1.3.1"
    implementation "androidx.wear.compose:compose-navigation:$wear_compose_version"
}

Es wird anstelle des Artefakts androidx.navigation:navigation-compose verwendet, da es alternative, speziell für Wear OS implementierte Implementierungen bietet.

Navigations-Controller, Host und Grafik erstellen

Für die Navigation mit Compose für Wear OS sind dieselben drei Komponenten erforderlich, die auch für Nicht-Wear OS-Apps benötigt werden: Navigations-Controller, Host und Grafik.

Mit rememberSwipeDismissableNavController() kannst du eine Instanz von WearNavigator erstellen. Das ist eine Implementierung von NavController, die für Wear OS-Anwendungen geeignet ist:

Kotlin


val navController = rememberSwipeDismissableNavController()

Die NavController ist die primäre API, die zur Navigation in Compose-Anwendungen verwendet wird. Damit wird die Navigation zwischen zusammensetzbaren Funktionen im Navigationshost gesteuert. Unter Wear OS ist das SwipeDismissableNavHost.

Kotlin

val navController = rememberSwipeDismissableNavController()
SwipeDismissableNavHost(
    navController = navController,
    startDestination = "message_list"
) {
    // TODO: build navigation graph
}

Wie bei der komponierbaren NavHost wird auch hier auf den Navigations-Controller, die Route für das Startziel und den Builder für den Navigationsdiagramm verwiesen, der hier als nachgestelltes Lambda dargestellt wird.

Das Startziel muss im Builder für Navigationsgrafiken angegeben werden, zusammen mit allen anderen Zielen, die mit dem Navigations-Controller navigierbar sein sollen.

val navController = rememberSwipeDismissableNavController()
SwipeDismissableNavHost(
    navController = navController,
    startDestination = "message_list"
) {
    composable("message_list") {
        MessageList(onMessageClick = { id ->
            navController.navigate("message_detail/$id")
        })
    }
    composable("message_detail/{id}") {
        MessageDetail(id = it.arguments?.getString("id")!!)
    }
}
Navigation.kt

Weitere Informationen zu Jetpack Navigation finden Sie unter Mit Compose navigieren oder das Code-Lab für Jetpack Compose-Navigation.