استراتيجية نقل البيانات

إذا كان لديك تطبيق حالي مستند إلى "العرض"، قد لا تريد إعادة كتابة واجهة مستخدمه بالكامل في آنٍ واحد. تساعدك هذه الصفحة في إضافة مكونات جديدة من Compose إلى تطبيقك الحالي. لبدء استخدام Compose في تطبيقك، اطّلِع على إعداد Compose لتطبيق حالي.

تم تصميم Jetpack Compose مع إمكانية التشغيل التفاعلي لـ View منذ البداية. تعني هذه الوظيفة أنّه يمكنك نقل تطبيقك الحالي المستنِد إلى "العرض" إلى "الإنشاء"، مع إمكانية إنشاء ميزات جديدة. لنقل البيانات إلى Compose، ننصحك بنقل البيانات بشكل تدريجي حيث تتعايش Compose وViews في قاعدة بياناتك إلى أن يصبح تطبيقك متوافقًا مع Compose بالكامل.

مراحل نقل بيانات تطبيق مستند إلى ملف الاطِّلاع إلى ميزة "الإنشاء"
الشكل 1. مراحل نقل بيانات تطبيق مستند إلى ملف الاطِّلاع إلى Compose

لنقل بيانات تطبيقك إلى Compose، اتّبِع الخطوات التالية:

  1. إنشاء شاشات جديدة باستخدام ميزة "الإنشاء"
  2. أثناء إنشاء الميزات، حدِّد العناصر القابلة لإعادة الاستخدام وابدأ في إنشاء مكتبة من مكونات واجهة المستخدم الشائعة.
  3. استبدِل الميزات الحالية شاشة واحدة في كل مرّة.

إنشاء شاشات جديدة باستخدام ميزة "إنشاء"

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

شاشة جديدة مكتوبة في ميزة "الإنشاء"
الشكل 2: شاشة جديدة مكتوبة في ميزة "الإنشاء"

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

لاستخدام Compose في عنصر مجزأ، أعِد ComposeView في onCreateView()طريقة دورة حياة عنصر المجزأ. تحتوي ComposeView على طريقة setContent() يمكنك من خلالها تقديم دالة قابلة للتجميع.

class NewFeatureFragment : Fragment() {
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {
        return ComposeView(requireContext()).apply {
            setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)
            setContent {
                NewFeatureScreen()
            }
        }
    }
}
MigrationStrategySnippets.kt

اطّلِع على ComposeView في الأجزاء لمعرفة مزيد من المعلومات.

إضافة ميزات جديدة في الشاشات الحالية

شاشة حالية تتضمّن عروضًا وميزة "إنشاء" مختلطة
الشكل 3. شاشة حالية تتضمّن عروضًا وميزة "إنشاء" مختلطة

يمكنك أيضًا استخدام ميزة "الإنشاء" في شاشة حالية مستندة إلى عرض إذا كانت الميزة الجديدة التي تتم إضافتها جزءًا من شاشة حالية. لإجراء ذلك، أضِف ComposeView إلى التسلسل الهرمي لملف ملف الاطِّلاع، تمامًا مثل أي ملف اطِّلاع آخر.

على سبيل المثال، لنفترض أنّك تريد إضافة عرض فرعي إلى LinearLayout. يمكنك إجراء ذلك في ملف XML على النحو التالي:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <TextView
      android:id="@+id/text"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" />

  <androidx.compose.ui.platform.ComposeView
      android:id="@+id/compose_view"
      android:layout_width="match_parent"
      android:layout_height="match_parent" />
</LinearLayout>
migration_strategy_existing_screens.xml

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

لمزيد من المعلومات عن ComposeView، اطّلِع على واجهات برمجة التطبيقات للتوافق.

إنشاء مكتبة من مكوّنات واجهة المستخدم الشائعة

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

استنادًا إلى حجم تطبيقك، يمكن أن تكون هذه المكتبة حزمة أو وحدة أو وحدة مكتبة منفصلة. لمزيد من المعلومات عن تنظيم الوحدات في تطبيقك، يُرجى مراجعة دليل استخدام وحدات التطبيقات على Android.

استبدال الميزات الحالية بميزة "الإنشاء"

بالإضافة إلى استخدام أداة "الإنشاء" لإنشاء ميزات جديدة، عليك نقل الميزات الحالية في تطبيقك تدريجيًا للاستفادة من أداة "الإنشاء".

يمكن أن يؤدي استخدام Compose فقط في تطبيقك إلى تسريع عملية التطوير، كما يؤدي إلى تقليل حجم حزمة APK ووقت إنشاء تطبيقك. اطّلِع على مقارنة بين أداء Compose وView لمعرفة المزيد من المعلومات.

الشاشات البسيطة

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

خذ ملف XML التالي:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

  <TextView
      android:id="@+id/title_text"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/title"
      android:textAppearance="?attr/textAppearanceHeadline2" />

  <TextView
      android:id="@+id/subtitle_text"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/subtitle"
      android:textAppearance="?attr/textAppearanceHeadline6" />

  <TextView
      android:id="@+id/body_text"
      android:layout_width="wrap_content"
      android:layout_height="0dp"
      android:layout_weight="1"
      android:text="@string/body"
      android:textAppearance="?attr/textAppearanceBody1" />

  <Button
      android:id="@+id/confirm_button"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:text="@string/confirm"/>
</LinearLayout>
migration_strategy_xml_example.xml

يمكن إعادة كتابة ملف XML في ميزة "الإنشاء" في بضعة أسطر:

@Composable
fun SimpleScreen() {
    Column(Modifier.fillMaxSize()) {
        Text(
            text = stringResource(R.string.title),
            style = MaterialTheme.typography.headlineMedium
        )
        Text(
            text = stringResource(R.string.subtitle),
            style = MaterialTheme.typography.headlineSmall
        )
        Text(
            text = stringResource(R.string.body),
            style = MaterialTheme.typography.bodyMedium
        )
        Spacer(modifier = Modifier.weight(1f))
        Button(onClick = { /* Handle click */ }, Modifier.fillMaxWidth()) {
            Text(text = stringResource(R.string.confirm))
        }
    }
}
MigrationStrategySnippets.kt

عرض "مختلط" وشاشات "إنشاء"

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

النهج التصاعدي لنقل واجهة مستخدم مختلطة لعرض الرسائل وإنشاءها إلى ميزة &quot;إنشاء&quot;
الشكل 4. النهج التصاعدي لنقل واجهة مستخدم مختلطة من "الملف الشخصي" و"إنشاء" إلى "إنشاء"

إزالة المكوّنين "المقاطع" و"التنقّل"

يمكنك نقل البيانات إلى إنشاء التنقّل بعد أن تتمكّن من إزالة كل Fragments واستبدالها بعناصر قابلة للتجميع على مستوى الشاشة. يمكن أن تحتوي العناصر القابلة للتجميع على مستوى الشاشة على مزيج من محتوى "الإنشاء" و"العرض"، ولكن يجب أن تكون جميع وجهة التنقل قابلة للتجميع لتفعيل نقل ميزة "إنشاء" في "التنقّل". وحتى ذلك الحين، يجب مواصلة استخدام مكوّن التنقّل المستنِد إلى الأجزاء في قاعدة بيانات رمز View وCompose المختلطة. اطّلِع على نقل بيانات Jetpack Navigation إلى Navigation Compose للحصول على مزيد من المعلومات.

مصادر إضافية

اطّلِع على المراجع الإضافية التالية لمعرفة المزيد من المعلومات عن نقل تطبيقك الحالي المستنِد إلى ملف الاطِّلاع إلى ميزة "الإنشاء":

الخطوات التالية

بعد أن تعرّفت على الاستراتيجية التي يمكنك اتّخاذها لنقل ملف APK الحالي المستنِد إلى الاطّلاع، يمكنك استكشاف واجهات برمجة التطبيقات لإمكانية التشغيل التفاعلي للاطّلاع على مزيد من المعلومات.