Wear OS için Compose ile gezinme


Android Jetpack'teki Navigation bileşeni, Jetpack Compose uygulamaları için destek sağlar. Navigation bileşeninin altyapısından ve özelliklerinden yararlanarak composable'lar arasında gezinebilirsiniz.

Bu sayfada, Wear OS için Compose'daki Jetpack Navigation ile ilgili farklılıklar açıklanmaktadır.

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.6.2"
    implementation "androidx.wear.compose:compose-navigation:$wear_compose_version"
}

Wear OS'e özel alternatif uygulamalar sağladığı için androidx.navigation:navigation-compose artefaktı yerine kullanılır.

Gezinme denetleyicisi, ana makine ve grafik oluşturma

Wear OS için Compose ile gezinme, Wear OS dışı uygulamalarda gereken üç bileşeni (gezinme denetleyicisi, ana makine ve grafik) gerektirir.

Wear OS uygulamaları için uygun olan NavController uygulaması WearNavigator örneği oluşturmak üzere rememberSwipeDismissableNavController() kullanın:

val navController = rememberSwipeDismissableNavController()

NavController, Compose uygulamalarında gezinmek için kullanılan birincil API'dir. Bu işlev, gezinme ana makinesindeki composable'lar arasında gezinmeyi kontrol eder. Wear OS'te bu ana makine SwipeDismissableNavHost'dir.

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

NavHost composable gibi, gezinme denetleyicisine, başlangıç hedefinin rotasına ve gezinme grafiği için oluşturucuya bir referans alır. Bu oluşturucu, burada sondaki lambda olarak gösterilir.

Başlangıç hedefi, gezinme grafiği oluşturucuda, gezinme denetleyicisiyle gezinilmesi gereken diğer tüm hedeflerle birlikte sağlanmalıdır.

Wear OS uygulamanızda, saat, kaydırma veya konum göstergesi ve sayfa göstergesi gibi üst düzey bileşenleri desteklemek için SwipeDismissableNavHost öğesini AppScaffold içeriği olarak bildirin. Ekran düzeyinde SwipeDismissableNavHost ve ScreenScaffold üzerinde bir AppScaffold nesnesi kullanarak ekrana varsayılan olarak bir TimeText nesnesi ekleyin ve ekranlar arasında gezinirken nesnenin doğru şekilde animasyon oluşturduğundan emin olun. Ayrıca, ScreenScaffold kaydırılabilir içerik için PositionIndicator ekler.
    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
        // ...

Jetpack Navigation hakkında daha fazla bilgi edinmek için Compose ile gezinme başlıklı makaleyi inceleyin veya Jetpack Compose Navigation kod laboratuvarına katılın.