Wear OS için Compose ile gezinme

Android Jetpack'teki Gezinme bileşeni, Jetpack Compose uygulamaları için destek. composable'lar arasında gezinebilirsiniz. ve Navigasyon bileşeninin altyapısından ve özellikleri.

Bu sayfada, Wear için Compose'da Jetpack Navigasyon ile olan farklılıklar açıklanmaktadır İşletim sistemi.

Kurulum

Uygulama modülünüzün build.gradle dosyasında aşağıdaki bağımlılığı kullanın:

Kotlin


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

Bu, androidx.navigation:navigation-compose yerine kullanılır çünkü Wear OS'e özgü alternatif uygulamalar sağlar.

Gezinme denetleyicisi, ana makinesi ve grafik oluşturun

Wear OS için Compose ile gezinmek için Wear OS dışı uygulamalar: gezinme denetleyicisi, ana makine ve grafik.

Tekliflerinizi otomatikleştirmek ve optimize etmek için rememberSwipeDismissableNavController() (NavController uygulaması) WearNavigator örneği oluşturmak için Wear OS uygulamalarına uygun:

Kotlin


val navController = rememberSwipeDismissableNavController()

NavController Compose uygulamalarında gezinmek için kullanılan birincil API. Navigasyonu kontrol eder Wear OS'te ise gezinme ana makinesinde composable'lar arasındaki SwipeDismissableNavHost.

Kotlin

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

Beğen NavHost composable, başlangıç noktasının rotası olan navigasyon denetleyicisine başvuruda bulunur. olarak gösterilen gezinme grafiğine yönelik oluşturucuyu ve lambda var.

Başlangıç hedefi, gezinme grafiği oluşturucuda navigasyon sırasında gidilebilmesi gereken diğer tüm hedeflerde denetleyici.

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")!!)
    }
}

Jetpack Navigasyon hakkında daha fazla bilgi edinmek için bkz. Oluşturma ile gezinme veya Jetpack Compose Gezinme kod laboratuvarı.

ziyaret edin.