माइग्रेशन से जुड़ी रणनीति

अगर आपके पास View पर आधारित कोई मौजूदा ऐप्लिकेशन है, तो हो सकता है कि आप एक साथ उसका पूरा यूज़र इंटरफ़ेस (यूआई) फिर से न लिखना चाहें. इस पेज की मदद से, अपने मौजूदा ऐप्लिकेशन में Compose के नए कॉम्पोनेंट जोड़े जा सकते हैं. अपने ऐप्लिकेशन में Compose का इस्तेमाल शुरू करने के लिए, मौजूदा ऐप्लिकेशन के लिए Compose सेट अप करना लेख पढ़ें.

Jetpack Compose को शुरू से ही View के साथ काम करने के लिए डिज़ाइन किया गया था. इस सुविधा का मतलब है कि आपके पास अपने मौजूदा View-based ऐप्लिकेशन को Compose पर माइग्रेट करने का विकल्प है. साथ ही, नई सुविधाएं भी बनाई जा सकती हैं. Compose पर माइग्रेट करने के लिए, हमारा सुझाव है कि आप धीरे-धीरे माइग्रेट करें. इसमें, आपके कोडबेस में Compose और व्यू, तब तक साथ-साथ मौजूद रहेंगे, जब तक आपका ऐप्लिकेशन पूरी तरह से Compose पर माइग्रेट नहीं हो जाता.

व्यू के आधार पर बने ऐप्लिकेशन को Compose में माइग्रेट करने के चरण
पहली इमेज. व्यू पर आधारित ऐप्लिकेशन को Compose पर माइग्रेट करने के चरण

अपने ऐप्लिकेशन को Compose पर माइग्रेट करने के लिए, यह तरीका अपनाएं:

  1. 'लिखें' सुविधा का इस्तेमाल करके नई स्क्रीन बनाएं.
  2. सुविधाएं बनाते समय, फिर से इस्तेमाल किए जा सकने वाले एलिमेंट की पहचान करें और नए सिरे से सामान्य यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट की लाइब्रेरी.
  3. एक बार में एक स्क्रीन पर मौजूदा सुविधाओं को बदलें.

Compose की सुविधा का इस्तेमाल करके नई स्क्रीन बनाना

पूरी स्क्रीन को घेरने वाली नई सुविधाएं बनाने के लिए, कंपोज़ की सुविधा का इस्तेमाल करना सबसे अच्छा है इससे आपको कंपोज़ की सुविधा इस्तेमाल करने का मौक़ा मिलेगा. इस कार्यनीति की सहायता से, आप सुविधाएं जोड़ सकते हैं साथ ही, लिखें की सुविधा के फ़ायदे पाने के साथ-साथ, आपके कंपनी की कारोबारी ज़रूरतों को पूरा करती है.

Compose में नई स्क्रीन लिखी गई है
दूसरी इमेज. Compose में लिखी गई नई स्क्रीन

अपने मौजूदा ऐप्लिकेशन में नई स्क्रीन बनाने के लिए Compose का इस्तेमाल करने पर भी, आपको ऐप्लिकेशन के आर्किटेक्चर की सीमाओं के मुताबिक काम करना पड़ता है. अगर आप इसका इस्तेमाल कर रहे हैं, तो फ़्रैगमेंट और नेविगेशन घटक का उपयोग करते हैं, तो आपको फ़्रैगमेंट और उसका कॉन्टेंट Compose में मौजूद होना चाहिए.

किसी फ़्रैगमेंट में Compose का इस्तेमाल करने के लिए, अपने फ़्रैगमेंट के onCreateView() लाइफ़साइकल तरीके में ComposeView दिखाएं. 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 देखें.

मौजूदा स्क्रीन में नई सुविधाएं जोड़ना

मिले-जुले व्यू और Compose की सुविधा वाली मौजूदा स्क्रीन
तीसरी इमेज. व्यू और 'लिखें' टैब वाली मौजूदा स्क्रीन

आप किसी मौजूदा दृश्य-आधारित स्क्रीन में भी कंपोज़ का उपयोग कर सकते हैं यदि आप नई सुविधा जोड़ रहे हैं, तो वह मौजूदा स्क्रीन का हिस्सा है. ऐसा करने के लिए, ComposeView अन्य व्यू की तरह ही व्यू हैरारकी (व्यू और व्यू ग्रुप के लेआउट का क्रम) देखें.

उदाहरण के लिए, मान लें कि आपको LinearLayout में चाइल्ड व्यू जोड़ना है. इसे एक्सएमएल में इस तरह से किया जा सकता है:

<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 के बारे में ज़्यादा जानने के लिए, Interoperability API देखें.

सामान्य यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट की लाइब्रेरी बनाना

Compose की मदद से सुविधाएं बनाते समय, आपको पता चलेगा कि आपने कॉम्पोनेंट की लाइब्रेरी बना ली है. सामान्य यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट की लाइब्रेरी बनाने से, आपको अपने ऐप्लिकेशन में इन कॉम्पोनेंट के लिए एक ही सोर्स मिलता है. साथ ही, इन कॉम्पोनेंट को फिर से इस्तेमाल करने को बढ़ावा मिलता है. फिर, आप जो सुविधाएं बनाएंगे वे इस लाइब्रेरी पर निर्भर कर सकती हैं. यह तरीका खास तौर पर तब मददगार होता है, जब Compose में कस्टम डिज़ाइन सिस्टम बनाया जा रहा हो.

आपके ऐप्लिकेशन के साइज़ के हिसाब से, यह लाइब्रेरी एक अलग पैकेज, मॉड्यूल, या लाइब्रेरी मॉड्यूल का इस्तेमाल करना चाहिए. अपने ऐप्लिकेशन में मॉड्यूल व्यवस्थित करने के बारे में ज़्यादा जानने के लिए, Android ऐप्लिकेशन को मॉड्यूलर बनाने के बारे में गाइड देखें.

मौजूदा सुविधाओं को Compose से बदलना

नई सुविधाएं बनाने के लिए, कंपोज़ की सुविधा का इस्तेमाल करने के अलावा, आपको धीरे-धीरे Compose की सुविधा का इस्तेमाल करने के लिए, इसकी मौजूदा सुविधाओं को माइग्रेट कर सकते हैं.

अपने ऐप्लिकेशन को सिर्फ़ Compose में बनाने से, ऐप्लिकेशन को तेज़ी से डेवलप किया जा सकता है. साथ ही, ऐप्लिकेशन के APK साइज़ और उसे बनाने में लगने वाले समय को भी कम किया जा सकता है. ज़्यादा जानने के लिए, Compose और View की परफ़ॉर्मेंस की तुलना करना लेख पढ़ें.

सामान्य स्क्रीन

मौजूदा सुविधाओं को 'लिखें' बॉक्स में माइग्रेट करते समय, सबसे पहले इन पर नज़र रखनी चाहिए स्क्रीन. आसान स्क्रीन में वेलकम स्क्रीन, पुष्टि करने वाली स्क्रीन या सेटिंग स्क्रीन शामिल हो सकती हैं. इनमें यूज़र इंटरफ़ेस (यूआई) में दिखाया गया डेटा, अपेक्षाकृत स्टैटिक होता है.

यहां दी गई एक्सएमएल फ़ाइल लें:

<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>

एक्सएमएल फ़ाइल को Compose में कुछ लाइनों में फिर से लिखा जा सकता है:

@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 में न हो जाए. यह तरीका, इसे बॉटम-अप अप्रोच भी कहा जाता है.

अलग-अलग तरह के व्यू और Compose के यूज़र इंटरफ़ेस (यूआई) को Compose में माइग्रेट करने का बॉटम-अप अप्रोच
चौथी इमेज. मिले-जुले व्यू और 'लिखें' यूज़र इंटरफ़ेस (यूआई) को Compose में माइग्रेट करने का सबसे नीचे वाला तरीका

फ़्रैगमेंट और नेविगेशन कॉम्पोनेंट हटाना

सभी फ़्रैगमेंट हटाने और उन्हें स्क्रीन-लेवल के कॉम्पोज़ेबल से बदलने के बाद, नेविगेशन कॉम्पोज़ पर माइग्रेट किया जा सकता है. स्क्रीन-लेवल के कॉम्पोज़ेबल में, कॉम्पोज़ और व्यू कॉन्टेंट का मिक्स हो सकता है. हालांकि, नेविगेशन कॉम्पोज़ माइग्रेशन की सुविधा चालू करने के लिए, सभी नेविगेशन डेस्टिनेशन कॉम्पोज़ेबल होने चाहिए. तब तक आपको इस्तेमाल करते रहना चाहिए आपके मिक्स व्यू और कंपोज़ में फ़्रैगमेंट पर आधारित नेविगेशन कॉम्पोनेंट कोड बेस में एक्सपोर्ट करें. इनके लिए Jetpack नेविगेशन को नेविगेशन कंपोज़ पर माइग्रेट करना देखें ज़्यादा जानकारी देखें.

अन्य संसाधन

अपने मौजूदा व्यू-आधारित ऐप्लिकेशन को Compose में माइग्रेट करने के बारे में ज़्यादा जानने के लिए, यहां दिए गए अन्य संसाधन देखें:

अगले चरण

अब आपके पास अपने मौजूदा व्यू-आधारित ऐप्लिकेशन को माइग्रेट करने की रणनीति है. ज़्यादा जानने के लिए, इंटरऑपरेबिलिटी एपीआई एक्सप्लोर करें.

फ़िलहाल कोई सुझाव नहीं है.

अपने Google खाते में करने की कोशिश करें.