Wear OS için Compose ile gezinme


Android Jetpack'teki Gezinme bileşeni, Jetpack Compose uygulamalarına destek sağlar. Navigasyon bileşeninin altyapısından ve özelliklerinden yararlanarak bileşenler arasında gezinebilirsiniz.

Bu sayfada, WearOS için Compose'daki Jetpack Navigation ile ilgili farklar 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.4.1"
    implementation "androidx.wear.compose:compose-navigation:$wear_compose_version"
}

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

Gezinme denetleyicisi, ana makine ve grafik oluşturma

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

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

Kotlin

val navController = rememberSwipeDismissableNavController()

NavController, Compose uygulamalarında gezinmek için kullanılan birincil API'dir. Navigasyon ana makinesindeki bileşenler arasında gezinmeyi kontrol eder. Wear OS'te bu SwipeDismissableNavHost olarak gösterilir.

Kotlin

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

NavHost bileşeni gibi, navigasyon denetleyicisine, başlangıç hedefinin rotasına ve burada son lambda olarak gösterilen navigasyon grafiğinin oluşturucusuna referans alır.

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

Zaman, kaydırma/konum göstergesi ve sayfa göstergesi gibi üst düzey bileşenleri desteklemek için Wear OS uygulamanızda SwipeDismissableNavHost öğesini AppScaffold içeriği olarak beyan edin. Varsayılan olarak ekrana bir TimeText nesnesi eklemek ve ekranlar arasında gezinirken doğru şekilde animasyonlu olmasını sağlamak için SwipeDismissableNavHost üzerinde bir AppScaffold nesnesi ve ekran düzeyinde ScreenScaffold kullanın. Ayrıca ScreenScaffold, kaydırılabilir içerik için bir 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
    ) {
        // 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ını tamamlayın.