Navigazione con Compose per Wear OS

Il componente Navigation 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.1"
    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:

Kotlin

val navController = rememberSwipeDismissableNavController()

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

Kotlin

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

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 per Wear OS, dichiara SwipeDismissableNavHost come contenuto di AppScaffold per supportare i componenti di primo livello come l'ora, l'indicatore di scorrimento/posizione e l'indicatore di pagina. Utilizza un oggetto AppScaffold sopra SwipeDismissableNavHost e ScreenScaffold a livello di schermo per aggiungere un oggetto TimeText allo schermo per impostazione predefinita e assicurarti che l'animazione venga riprodotta correttamente durante la navigazione tra gli schermi. 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.