Nawigacja z użyciem Utwórz na Wear OS

Komponent Navigation w Android Jetpack obsługuje aplikacje Jetpack Compose. Możesz przechodzić między elementami kompozycyjnymi, korzystając z infrastruktury i funkcji komponentu Navigation.

Na tej stronie opisujemy różnice w Jetpack Navigation w Compose for Wear OS.

Konfiguracja

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

Kotlin

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

Jest ona używana zamiast artefaktu androidx.navigation:navigation-compose, ponieważ zawiera alternatywne implementacje specyficzne dla Wear OS.

Tworzenie kontrolera nawigacji, hosta i grafu

Nawigowanie za pomocą Compose for Wear OS wymaga tych samych 3 komponentów, które są potrzebne w aplikacjach innych niż Wear OS: kontrolera nawigacji, hosta i grafu.

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

val navController = rememberSwipeDismissableNavController()

NavController to główny interfejs API używany do nawigowania w aplikacjach Compose. Kontroluje on nawigowanie między elementami kompozycyjnymi w hoście nawigacji, którym w Wear OS jest SwipeDismissableNavHost.

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

Podobnie jak element kompozycyjny NavHost, przyjmuje on odniesienie do kontrolera nawigacji, trasę do miejsca docelowego i narzędzie do tworzenia grafu nawigacji, które jest tu przedstawione jako lambda końcowa.

Miejsce docelowe musi być podane w narzędziu do tworzenia grafu nawigacji wraz ze wszystkimi innymi miejscami docelowymi, do których można nawigować za pomocą kontrolera nawigacji.

W aplikacji na Wear OS zadeklaruj SwipeDismissableNavHost jako treść AppScaffold, aby obsługiwać komponenty najwyższego poziomu, takie jak czas, wskaźnik przewijania lub pozycji oraz wskaźnik strony. Użyj obiektu AppScaffold nad SwipeDismissableNavHost i ScreenScaffold na poziomie ekranu, aby domyślnie dodać do ekranu obiekt TimeText i zapewnić jego prawidłową animację podczas przechodzenia między ekranami. Dodatkowo ScreenScaffold dodaje PositionIndicator do treści z możliwością przewijania. 
    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
        // ...

Więcej informacji o Jetpack Navigation znajdziesz w artykule Navigating with Compose lub w ćwiczeniu z programowania Jetpack Compose Navigation.