التنقّل باستخدام ميزة الإنشاء في نظام التشغيل Wear OS


يقدّم مكوّن التنقّل في Android Jetpack دعمًا لتطبيقات Jetpack Compose. يمكنك التنقّل بين العناصر القابلة للتجميع مع الاستفادة من البنية الأساسية لعنصر التنقّل و ميزاته.

توضّح هذه الصفحة الاختلافات مع Jetpack Navigation في Compose لنظام التشغيل Wear.

ضبط إعدادات الجهاز

استخدِم التبعية التالية في ملف build.gradle الخاص بوحدة تطبيقك:

Kotlin

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

يتم استخدام هذا العنصر بدلاً من العنصر androidx.navigation:navigation-compose لأنّه يقدّم عمليات تنفيذ بديلة خاصة بنظام التشغيل Wear OS.

إنشاء وحدة تحكّم في التنقّل ومضيف ورسم بياني

يتطلب التنقّل باستخدام Compose لنظام التشغيل Wear OS المكونات الثلاثة نفسها المطلوبة في التطبيقات غير المتوافقة مع Wear OS: وحدة التحكّم في التنقّل والمضيف والرسم البياني.

استخدِم rememberSwipeDismissableNavController() لإنشاء مثيل من WearNavigator، وهو تنفيذ NavController مناسب لتطبيقات Wear OS:

Kotlin

val navController = rememberSwipeDismissableNavController()

NavController هي واجهة برمجة التطبيقات الأساسية المستخدَمة للتنقّل في تطبيقات Compose. يتحكّم هذا العنصر في التنقّل بين العناصر القابلة للتجميع في مضيف التنقّل الذي يمثّل رمزه على نظام التشغيل Wear OS هو SwipeDismissableNavHost.

Kotlin

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

مثل العنصر القابل للتركيب NavHost، فإنه يأخذ إشارة إلى وحدة التحكّم في التنقّل ومسار الوجهة الأولية وباني الرسم البياني للتنقّل الذي يظهر هنا كدالّة lambda متأخرة.

يجب توفير وجهة البدء في أداة إنشاء الرسم البياني للتنقّل، بالإضافة إلى جميع الوجهات الأخرى التي يجب أن يكون بالإمكان التنقّل بينها باستخدام أداة التحكّم في التنقّل.

في تطبيق Wear OS، حدِّد SwipeDismissableNavHost كمحتوى AppScaffold لتفعيل المكوّنات ذات المستوى الأعلى، مثل الوقت ومؤشر التمرير/الموضع ومؤشر الصفحة. استخدِم عنصر AppScaffold فوق SwipeDismissableNavHost وScreenScaffold على مستوى الشاشة لإضافة عنصر TimeText إلى الشاشة تلقائيًا والتأكّد من أنّه يتحرك بشكل صحيح عند التنقّل بين الشاشات. بالإضافة إلى ذلك، يضيف ScreenScaffold PositionIndicator للمحتوى الذي يمكن التمرير فيه.
    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، اطّلِع على مقالة التنقّل باستخدام Compose أو يمكنك المشاركة في مختبر رموز Jetpack Navigation.