Die Navigationskomponente in Android Jetpack bietet Unterstützung für Jetpack Compose-Anwendungen. Sie können zwischen Composables wechseln und dabei die Infrastruktur und Funktionen der Navigation-Komponente nutzen.
Auf dieser Seite werden die Unterschiede zu Jetpack Navigation in Compose for Wear OS beschrieben.
Einrichten
Verwenden Sie die folgende Abhängigkeit in der Datei „build.gradle“ Ihres App-Moduls:
Kotlin
dependencies { def wear_compose_version = "1.5.6" implementation "androidx.wear.compose:compose-navigation:$wear_compose_version" }
Dieses wird anstelle des androidx.navigation:navigation-compose-Artefakts verwendet, da es alternative Implementierungen speziell für Wear OS bietet.
Navigationscontroller, Host und Graph erstellen
Für die Navigation mit Compose für 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 Implementierung von NavController, die für Wear OS-Anwendungen geeignet ist:
val navController = rememberSwipeDismissableNavController()
Die NavController ist die primäre API, die zum Navigieren in Compose-Anwendungen verwendet wird. Damit wird die Navigation zwischen Composables im Navigationshost gesteuert, der in Wear OS SwipeDismissableNavHost ist.
val navController = rememberSwipeDismissableNavController() SwipeDismissableNavHost( navController = navController, startDestination = "message_list" ) { // TODO: build navigation graph }
Wie bei der zusammensetzbaren Funktion NavHost werden eine Referenz zum Navigationscontroller, die Route für das Startziel und der Builder für den Navigationsgraphen übergeben, der hier als nachgestellte Lambda-Funktion dargestellt wird.
Das Startziel muss im Navigationsdiagramm-Builder angegeben werden, zusammen mit allen anderen Zielen, die mit dem Navigationscontroller erreichbar sein sollen.
Deklarieren Sie in Ihrer Wear OS-AppSwipeDismissableNavHost als Inhalt von AppScaffold, um Komponenten der obersten Ebene wie Zeit, Scroll- oder Positionsanzeige und Seitenanzeige zu unterstützen.
Verwende ein AppScaffold-Objekt über dem SwipeDismissableNavHost> und dem 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")!!) } } } } // Implementation of one of the screens in the navigation @Composable fun MessageDetail(id: String) { // .. Screen level content goes here val scrollState = rememberTransformingLazyColumnState() val padding = rememberResponsiveColumnPadding( first = ColumnItemType.BodyText ) ScreenScaffold( scrollState = scrollState, contentPadding = padding ) { scaffoldPaddingValues -> // Screen content goes here // ...
Weitere Informationen zur Jetpack-Navigation finden Sie unter Mit Compose navigieren oder im Jetpack Compose Navigation-Codelab.
Empfehlungen für Sie
- Hinweis: Linktext wird angezeigt, wenn JavaScript deaktiviert ist.
- Jetpack Navigation zu Navigation Compose migrieren
- Navigation mit kombinierbarer Funktion
- Mit Compose zwischen Bildschirmen wechseln