Nawigacja z użyciem Utwórz na Wear OS

Komponent Nawigacja w Android Jetpack umożliwia obsługę aplikacji Jetpack Compose. Możesz poruszać się między składanymi elementami, korzystając z infrastruktury i funkcji komponentu Nawigacja.

Na tej stronie opisano różnice w poruszaniu się po Jetpacku 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.4.0"
    implementation "androidx.wear.compose:compose-navigation:$wear_compose_version"
}

Jest on używany zamiast artefaktu androidx.navigation:navigation-compose, ponieważ zapewnia alternatywne implementacje na potrzeby Wear OS.

Tworzenie kontrolera nawigacji, gospodarza i grafu

Nawigacja w usłudze Compose w Wear OS wymaga tych samych 3 komponentów co w aplikacjach innych niż Wear OS: kontrolera nawigacji, hosta i wykresów.

Użyj interfejsu rememberSwipeDismissableNavController(), aby utworzyć instancję interfejsu WearNavigator, czyli implementacji interfejsu NavController, która jest odpowiednia dla aplikacji na Wear OS:

Kotlin

val navController = rememberSwipeDismissableNavController()

Interfejs NavController to podstawowy interfejs API używany do nawigacji w aplikacjach Compose. Element ten steruje poruszaniem się między składanymi elementami w gospodarzu nawigacji, którym na Wear OS jest SwipeDismissableNavHost.

Kotlin

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

Podobnie jak kompozyt NavHost odwołuje się on do kontrolera nawigacji, trasy do miejsca docelowego i budynku do tworzenia grafu nawigacji, który jest tu widoczny jako lambda końcowa.

Miejsce docelowe początkowego trzeba podać w kreatorze wykresów nawigacyjnych wraz ze wszystkimi innymi miejscami docelowymi, po których można poruszać się za pomocą kontrolera nawigacji.

W aplikacji na Wear OS zadeklaruj SwipeDismissableNavHost jako zawartość Scaffold, aby obsługiwać komponenty najwyższego poziomu, takie jak czas, wskaźnik przewijania/pozycji i wskaźnik strony. Użyj obiektu Horologist AppScaffold nad SwipeDismissableNavHost i Horologist 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 tag PositionIndicator w przypadku treści, które można przewijać. 

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
Navigation.kt

Więcej informacji o Nawigacji w Jetpack