نقل طرق العرض المستندة إلى XML إلى Jetpack Compose

تتيح Jetpack Compose إمكانية التشغيل التفاعلي مع Views، ما يتيح لك استخدام Compose في Views وViews في Compose. يتيح ذلك استخدام Compose في التطبيقات الحالية المستندة إلى View بدون الحاجة إلى نقل جميع عناصر View على الفور.

خطوات نقل البيانات

  1. إنشاء خطة: أنشئ خطة شاملة ومفصّلة لتنفيذ عملية النقل. ننصحك بإنشاء قائمة مهام متراكمة ذات أولوية لنقل البيانات.
  2. تحديد ملف XML المرشّح للنقل : حدِّد أصغر المكوّنات التي تمثّل عُقدًا فرعية في التسلسل الهرمي وابدأ بها، ثم وسِّع خطة النقل من الأسفل إلى الأعلى لتشمل المكوّنات الأعلى في التسلسل الهرمي بشكل تدريجي. تتضمّن الخيارات الجيدة لعملية النقل الأوّلية تلك التي تكون صغيرة الحجم وبدون حالة وتتضمّن عددًا أقل من التبعيات.
  3. تحليل التسلسل الهرمي: بعد تحديد XML View المطلوب نقله، حلِّل بنية تخطيط XML وطريقة تنفيذه.
  4. تسجيل الحالة الأولية: شغِّل اختبار لقطة شاشة لتسجيل الحالة الأولية لعنصر XML View المحدّد.
  5. المتطلبات الأساسية: إعداد تبعيات Compose حدِّد ما إذا كان المشروع يتضمّن تبعيات Compose وتم إعداد Compiler. إذا لم يكن الأمر كذلك، اتّبِع الخطوات الواردة في إعداد تبعيات Compose وCompiler.
  6. المتطلبات الأساسية: إعداد نظام تصميم Compose حدِّد ما إذا كان المشروع قد تم فيه إعداد نظام تصميم Compose من قبل. إذا لم يكن كذلك، اتّبِع خطوات تخصيص المظهر في Compose. احتفِظ بتصميم XML الأصلي أثناء تشغيل التطبيق في وضع التوافق نقل تصميم XML إلى Compose لفهم أنماط كيفية الحالة إلى أن يتم نقل المشروع بالكامل إلى Compose.
  7. نقل عرض XML إلى Compose: ابدأ عملية تحويل رمز XML إلى Compose، وطبِّق التصميم المناسب، وأضِف معاينات Compose إلى العناصر القابلة للإنشاء التي تم نقلها. للاطّلاع على سيناريوهات النقل الشائعة، يُرجى الرجوع إلى المراجع الإضافية. على سبيل المثال، لنقل البيانات إلى Lazy APIs في Compose، اتّبِع الخطوات الواردة في نقل البيانات من RecyclerView إلى Compose.
  8. استبدال الاستخدامات: استبدِل الاستخدامات السابقة لـ XML View لاستخدام مكوّن Compose الجديد. لإضافة ميزة "كتابة الأغاني" في "الفيديوهات القصيرة"، اتّبِع الخطوات الواردة في مقالة كتابة الأغاني في "الفيديوهات القصيرة". لإضافة طرق عرض في Compose، اتّبِع الخطوات الواردة في طرق العرض في Compose.
  9. التحقّق من صحة عملية النقل: تأكَّد من أنّ الحالة الأولية التي تم التقاطها في اختبار لقطة الشاشة هي نفسها معاينة Compose للعنصر القابل للإنشاء الذي تم نقل بياناته. إذا لم تتطابق الحالتان، كرِّر عملية إنشاء واجهة المستخدم الجديدة القابلة للإنشاء وتحسينها لتتطابق مع الحالة الأولية. أنشئ اختبارات جديدة لواجهة مستخدم Compose للعنصر الجديد القابل للإنشاء.
  10. إزالة XML: بعد أن تتطابق العناصر الجديدة القابلة للإنشاء مع واجهة المستخدم الأولية المستندة إلى XML، أزِل رمز XML View القديم واختباراته.

سيناريوهات نقل البيانات الشائعة

تأكَّد من استخدام الإضافتَين dp وsp (16.dp و20.sp) في العناصر القابلة للإنشاء. إذا كان tools:text متوفّرًا في "عرض XML"، استخدِمه في عنصر @Preview تركيبي منفصل.

تحويل السمة إلى معدِّل

تصبح معظم سمات XML جزءًا من سلسلة modifier أو مَعلمات الدالة القابلة للإنشاء.

سمة XML التركيب المكافئ
android:layout_width="match_parent" Modifier.fillMaxWidth()
android:layout_height="match_parent" Modifier.fillMaxHeight()
android:layout_width="wrap_content" (السلوك التلقائي، لا حاجة إلى مُعدِّل عادةً)
android:padding="Xdp" Modifier.padding(X.dp)
android:layout_margin="Xdp" Modifier.padding(X.dp) (المساحة الخارجية)
android:gravity="center" contentAlignment = Alignment.Center (مربع) أو horizontalAlignment / verticalArrangement (عمود/صف)
android:background="@color/white" Modifier.background(colorResource(R.color.white))
android:visibility="gone" التضمين في كتلة if (visible) { ... }

نقل الأنماط (styles.xml)

غالبًا ما تجمع أنماط XML بين سمات متعددة لإنشاء نمط. في Compose، يتم ذلك من خلال إنشاء صيغة قابلة للإنشاء بنمط معيّن.

قدِّم دوال @Composable منفصلة تحمل أسماءً وفقًا للنمط والمكوّن الأساسي، وذلك للإشارة إلى الاختلاف في الأنماط وحالات الاستخدام لهذه المكوّنات.

  • النمط: إذا كان عنصر XML يستخدم نمطًا مخصّصًا (مثل style="@style/MyPrimaryButton")، لا تحاول تكرار النمط في السطر. بدلاً من ذلك، اقترح إنشاء دالة برمجية محددة قابلة للإنشاء.
  • مثال:
    • XML: <Button style="@style/MyPrimaryButton" ... />
    • إنشاء: MyPrimaryButton(onClick = { ... })
  • مجموعات السمات الشائعة: إذا كان أحد الأنماط يضبط معدِّلات شائعة (مثل المساحة المتروكة والارتفاع)، استخرِجها إلى سمة إضافة قابلة للقراءة أو متغيّر Modifier مشترك.