Navigazione con Compose per Wear OS

Il componente di navigazione in Android Jetpack fornisce il supporto per le applicazioni Jetpack Compose. Puoi spostarti tra i composable sfruttando l'infrastruttura e le funzionalità del componente Navigation.

Questa pagina descrive le differenze con Jetpack Navigation su Compose for Wear OS.

Configura

Utilizza la seguente dipendenza nel file build.gradle del modulo dell'app:

Kotlin

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

Questo viene utilizzato al posto dell'artefatto androidx.navigation:navigation-compose perché fornisce implementazioni alternative specifiche per Wear OS.

Crea un controller di navigazione, un host e un grafico

La navigazione con Compose per Wear OS richiede gli stessi tre componenti necessari per le app non Wear OS: il controller di navigazione, l'host e il grafico.

Utilizza rememberSwipeDismissableNavController() per creare un'istanza di WearNavigator, un'implementazione di NavController adatta alle applicazioni Wear OS:

val navController = rememberSwipeDismissableNavController()
Navigation.kt

L'NavController è l'API principale utilizzata per navigare nelle applicazioni Compose. Controlla la navigazione tra i composable nell'host di navigazione che, su Wear OS, è SwipeDismissableNavHost.

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

Come il NavHost composable, accetta un riferimento al controller di navigazione, la route per la destinazione di partenza e il builder per il grafico di navigazione, mostrato qui come lambda finale.

La destinazione di partenza deve essere fornita nel builder del grafico di navigazione, insieme a tutte le altre destinazioni che devono essere navigabili con il controller di navigazione.

Nella tua app Wear OS, dichiara SwipeDismissableNavHost come contenuto di AppScaffold per supportare componenti di primo livello come l'ora, lo scorrimento o l'indicatore di posizione e l'indicatore di pagina. Utilizza un oggetto AppScaffold sopra SwipeDismissableNavHost e ScreenScaffold a livello di schermata per aggiungere un oggetto TimeText alla schermata per impostazione predefinita e per assicurarti che l'animazione funzioni correttamente quando navighi tra le schermate. Inoltre, ScreenScaffold aggiunge una PositionIndicator per i contenuti scorrevoli. 
    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

Per scoprire di più su Jetpack Navigation, consulta Navigare con Compose o segui il code lab di Jetpack Compose Navigation.