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

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

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

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

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

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

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

أفضل استخدام هو استخدام ميزة Compose لإنشاء ميزات جديدة تشمل الشاشة بأكملها لتعزيز اعتماد 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()
            }
        }
    }
}

اطّلِع على 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>

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

لمزيد من المعلومات حول ComposeView، يمكنك الاطّلاع على واجهات برمجة تطبيقات إمكانية التشغيل التفاعلي.

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

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

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

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

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

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

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

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

استخدِم ملف 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>

يمكن إعادة كتابة ملف 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))
        }
    }
}

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

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

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

إزالة الأجزاء ومكوِّن التنقل

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

مصادر إضافية

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

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

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