Navigation mit Compose für Wear OS

Die Navigationskomponente in Android Jetpack bietet Unterstützung für Jetpack Compose-Anwendungen. Sie können zwischen den Komponenten wechseln und dabei die Infrastruktur und Funktionen der Navigationskomponente nutzen.

Auf dieser Seite werden die Unterschiede zu Jetpack Navigation in Compose for Wear OS beschrieben.

Einrichten

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

Kotlin

dependencies {
    def wear_compose_version = "1.4.0"
    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.

Navigationscontroller, Host und Grafik erstellen

Für die Navigation mit Compose for Wear OS sind dieselben drei Komponenten erforderlich wie bei Apps, die nicht für Wear OS entwickelt wurden: Navigationscontroller, Host und Graph.

Verwenden Sie rememberSwipeDismissableNavController(), um eine Instanz von WearNavigator zu erstellen, einer für Wear OS-Anwendungen geeigneten Implementierung von NavController:

Kotlin

val navController = rememberSwipeDismissableNavController()

Die NavController ist die primäre API, die zum Navigieren in Compose-Anwendungen verwendet wird. Damit wird die Navigation zwischen den Komponenten im Navigationshost gesteuert, der in Wear OS SwipeDismissableNavHost ist.

Kotlin

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

Wie das NavHost-Kompositelement nimmt es eine Referenz auf den Navigationscontroller, die Route für das Startziel und den Builder für den Navigationsgraphen an, der hier als abschließendes Lambda dargestellt wird.

Das Startziel muss im Navigationsgraphen-Builder angegeben werden, zusammen mit allen anderen Zielen, die mit dem Navigationscontroller erreichbar sein sollen.

Deklarieren Sie in Ihrer Wear OS-App SwipeDismissableNavHost als Inhalt des Scaffold, um Komponenten der obersten Ebene wie Uhrzeit, Scroll-/Positionsanzeige und Seitenanzeige zu unterstützen. Verwenden Sie ein Horologist-Objekt AppScaffold über dem SwipeDismissableNavHost und das Horologist-Objekt ScreenScaffold auf Bildschirmebene, um dem Bildschirm standardmäßig ein TimeText-Objekt hinzuzufügen und dafür zu sorgen, dass es beim Wechseln zwischen Bildschirmen richtig animiert wird. Außerdem wird mit ScreenScaffold ein PositionIndicator für scrollbare Inhalte hinzugefügt.

AppScaffold {
    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")!!)
        }
    }
}
// ...
// .. Screen level content goes here
val scrollState = rememberScrollState()

ScreenScaffold(scrollState = scrollState) {
    // Screen content goes here

Weitere Informationen zu Jetpack Navigation finden Sie unter Mit Compose navigieren oder im Codelab zur Navigation mit Jetpack Compose.