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


يتيح مكوِّن التنقّل في Android Jetpack إمكانية استخدام تطبيقات Jetpack Compose. يمكنك التنقّل بين العناصر القابلة للإنشاء مع الاستفادة من البنية الأساسية والميزات التي يوفّرها مكوّن Navigation.

توضّح هذه الصفحة الاختلافات بين Jetpack Navigation وCompose for Wear OS.

ضبط إعدادات الميزة

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

Kotlin

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

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

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

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

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

Kotlin

val navController = rememberSwipeDismissableNavController()

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

Kotlin

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

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

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

في تطبيق 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
    ) { scaffoldPaddingValues ->
        // Screen content goes here

لمزيد من المعلومات حول Jetpack Navigation، يمكنك الاطّلاع على التنقّل باستخدام Compose أو المشاركة في تجربة Jetpack Compose Navigation العملية.