Nawigacja z użyciem Utwórz na Wear OS

Komponent Navigation w Androidzie Jetpack obsługuje aplikacje Jetpack Compose. Możesz poruszać się między funkcjami kompozycyjnymi, korzystając z infrastruktury i funkcji komponentu Navigation.

Na tej stronie opisujemy różnice w nawigacji Jetpack w Compose na Wear OS.

Konfiguracja

Użyj tej zależności w pliku build.gradle modułu aplikacji:

Kotlin

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

Jest on używany zamiast artefaktu androidx.navigation:navigation-compose, ponieważ zawiera alternatywne implementacje przeznaczone specjalnie dla Wear OS.

Tworzenie kontrolera nawigacji, hosta i wykresu

Nawigacja za pomocą Compose na Wear OS wymaga tych samych 3 komponentów co w przypadku aplikacji na inne platformy: kontrolera nawigacji, hosta i grafu.

Użyj rememberSwipeDismissableNavController() aby utworzyć instancję WearNavigator, implementację NavController odpowiednią dla aplikacji na Wear OS:

Kotlin

val navController = rememberSwipeDismissableNavController()

NavController to podstawowy interfejs API używany do poruszania się po aplikacjach Compose. Umożliwia nawigację między komponentami w kontenerze nawigacji, który na Wear OS jest reprezentowany przez element SwipeDismissableNavHost.

Kotlin

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

Podobnie jak NavHostfunkcja kompozycyjna przyjmuje odwołanie do kontrolera nawigacji, trasę do miejsca docelowego na początku i konstruktora wykresu nawigacji, który jest tu przedstawiony jako lambda końcowa.

Miejsce docelowe musi być podane w narzędziu do tworzenia wykresu nawigacji wraz z wszystkimi innymi miejscami docelowymi, po których można się poruszać za pomocą kontrolera nawigacji.

W aplikacji na Wear OS zadeklaruj SwipeDismissableNavHost jako zawartość elementu AppScaffold, aby obsługiwać komponenty najwyższego poziomu, takie jak czas, wskaźnik przewijania/pozycji i wskaźnik strony. Użyj obiektu AppScaffold powyżej obiektów SwipeDismissableNavHost i ScreenScaffold na poziomie ekranu, aby domyślnie dodać do ekranu obiekt TimeText i mieć pewność, że będzie on prawidłowo animowany podczas przechodzenia między ekranami. Dodatkowo ScreenScaffold dodaje PositionIndicator w przypadku treści przewijanych. 
    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
Navigation.kt

Więcej informacji o nawigacji w Jetpacku znajdziesz w artykule Nawigacja w Compose lub w samouczku dotyczącym nawigacji w Jetpacku Compose.