स्थिति और Jetpack Compose

ऐप्लिकेशन में मौजूद कोई भी वैल्यू, समय के साथ बदल सकती है. यह एक बहुत ही व्यापक परिभाषा है. इसमें Room डेटाबेस से लेकर किसी क्लास में मौजूद वैरिएबल तक, सब कुछ शामिल है.

सभी Android ऐप्लिकेशन, उपयोगकर्ता को स्थिति दिखाते हैं. Android ऐप्लिकेशन की स्थिति के कुछ उदाहरण:

• स्नैकबार, जो नेटवर्क कनेक्शन न होने पर दिखता है.
• ब्लॉग पोस्ट और उससे जुड़ी टिप्पणियां.
• बटन पर रिपल एनिमेशन, जो उपयोगकर्ता के क्लिक करने पर चलता है.
• वे स्टिकर जिन्हें उपयोगकर्ता इमेज के ऊपर बना सकता है.

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

स्थिति और कंपोज़िशन

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

@Composable
private fun HelloContent() {
    Column(modifier = Modifier.padding(16.dp)) {
        Text(
            text = "Hello!",
            modifier = Modifier.padding(bottom = 8.dp),
            style = MaterialTheme.typography.bodyMedium
        )
        OutlinedTextField(
            value = "",
            onValueChange = { },
            label = { Text("Name") }
        )
    }
}
StateOverviewSnippets.kt

इसे चलाने और टेक्स्ट डालने की कोशिश करने पर, आपको कुछ नहीं दिखेगा. ऐसा इसलिए होता है, क्योंकि TextField अपने-आप अपडेट नहीं होता. यह value पैरामीटर बदलने पर अपडेट होता है. ऐसा इस वजह से होता है कि कंपोज़िशन और रिकंपोज़िशन, कंपोज़िशन में कैसे काम करते हैं.

मुख्य शब्द: कॉम्पोज़िशन: जब Jetpack Compose, कॉम्पोज़ेबल को लागू करता है, तो उससे बने यूज़र इंटरफ़ेस (यूआई) का ब्यौरा.

शुरुआती कंपोज़िशन: पहली बार कॉम्पोज़ेबल चलाकर कंपोज़िशन बनाना.

फिर से कॉम्पोज़ करना: डेटा में बदलाव होने पर, कॉम्पोज़ेशन को अपडेट करने के लिए, कॉम्पोज़ेबल को फिर से चलाना.

शुरुआती कॉम्पोज़िशन और फिर से कॉम्पोज़ करने के बारे में ज़्यादा जानने के लिए, कॉम्पोज़ करने के बारे में सोचना लेख पढ़ें.

कॉम्पोनेंसेज़ में स्टेटस

कॉम्पोज़ेबल फ़ंक्शन, किसी ऑब्जेक्ट को मेमोरी में सेव करने के लिए, remember एपीआई का इस्तेमाल कर सकते हैं. remember से कैलकुलेट की गई वैल्यू, कॉम्पोज़िशन के शुरुआती कॉम्पोज़िशन के दौरान कॉम्पोज़िशन में सेव की जाती है. साथ ही, सेव की गई वैल्यू को फिर से कॉम्पोज़ करने के दौरान दिखाया जाता है. remember का इस्तेमाल, बदले जा सकने वाले और नहीं बदले जा सकने वाले, दोनों ऑब्जेक्ट को सेव करने के लिए किया जा सकता है.

ध्यान दें: remember, कॉम्पोज़िशन में ऑब्जेक्ट सेव करता है. साथ ही, remember को कॉल करने वाले कॉम्पोज़ेबल को कॉम्पोज़िशन से हटाने पर, ऑब्जेक्ट को मिटा देता है.

mutableStateOf एक ऑब्ज़र्वेबल MutableState<T> बनाता है, जो Compose रनटाइम के साथ इंटिग्रेट किया गया ऑब्ज़र्वेबल टाइप है.

interface MutableState<T> : State<T> {
    override var value: T
}

value में किए गए किसी भी बदलाव से, value को पढ़ने वाले सभी कंपोजेबल फ़ंक्शन फिर से कॉम्पोज़ किए जाते हैं.

किसी कंपोज़ेबल में MutableState ऑब्जेक्ट का एलान करने के तीन तरीके हैं:

• val mutableState = remember { mutableStateOf(default) }
• var value by remember { mutableStateOf(default) }
• val (value, setValue) = remember { mutableStateOf(default) }

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

by डेलिगेट सिंटैक्स के लिए, इन इंपोर्ट की ज़रूरत होती है:

import androidx.compose.runtime.getValue
import androidx.compose.runtime.setValue

सेव की गई वैल्यू का इस्तेमाल, अन्य कॉम्पोज़ेबल के लिए पैरामीटर के तौर पर किया जा सकता है. इसके अलावा, स्टेटमेंट में लॉजिक के तौर पर भी इसका इस्तेमाल किया जा सकता है, ताकि यह बदला जा सके कि कौनसे कॉम्पोज़ेबल दिखाए जाएं. उदाहरण के लिए, अगर आपको नाम खाली होने पर नमस्ते नहीं दिखाना है, तो if स्टेटमेंट में इसकी जानकारी दें:

@Composable
fun HelloContent() {
    Column(modifier = Modifier.padding(16.dp)) {
        var name by remember { mutableStateOf("") }
        if (name.isNotEmpty()) {
            Text(
                text = "Hello, $name!",
                modifier = Modifier.padding(bottom = 8.dp),
                style = MaterialTheme.typography.bodyMedium
            )
        }
        OutlinedTextField(
            value = name,
            onValueChange = { name = it },
            label = { Text("Name") }
        )
    }
}
StateOverviewSnippets.kt

remember की मदद से, डेटा को फिर से कॉम्पोज़ करने पर उसकी स्थिति को बनाए रखा जा सकता है. हालांकि, कॉन्फ़िगरेशन में बदलाव करने पर, डेटा की स्थिति को बनाए नहीं रखा जा सकता. इसके लिए, आपको rememberSaveable का इस्तेमाल करना होगा. rememberSaveable, Bundle में सेव की जा सकने वाली किसी भी वैल्यू को अपने-आप सेव कर देता है. अन्य वैल्यू के लिए, कस्टम सेवर ऑब्जेक्ट पास किया जा सकता है.

चेतावनी: Compose में ArrayList<T> या mutableListOf() जैसे बदलाव किए जा सकने वाले ऑब्जेक्ट को स्टेटस के तौर पर इस्तेमाल करने पर, आपके उपयोगकर्ताओं को आपके ऐप्लिकेशन में गलत या पुराना डेटा दिखता है. बदलाव किए जा सकने वाले ऐसे ऑब्जेक्ट जिनका डेटा देखा नहीं जा सकता, जैसे कि ArrayList या बदलाव किए जा सकने वाली डेटा क्लास, Compose के ज़रिए नहीं देखे जा सकते. साथ ही, इनमें बदलाव होने पर, Compose में फिर से कॉम्पोज़ करने की प्रोसेस ट्रिगर नहीं होती. हमारा सुझाव है कि आप ऐसे डेटा होल्डर का इस्तेमाल करें जिसका डेटा देखा जा सकता हो. जैसे, State<List<T>> और ऐसा डेटा होल्डर जिसका डेटा नहीं बदला जा सकता, जैसे कि listOf().

काम करने वाली अन्य स्थितियां

Compose में, स्टेटस को सेव करने के लिए MutableState<T> का इस्तेमाल करना ज़रूरी नहीं है. यह, ऑब्ज़र्व किए जा सकने वाले अन्य टाइप के साथ काम करता है. Compose में किसी दूसरे ऑब्ज़र्वेबल टाइप को पढ़ने से पहले, आपको उसे State<T> में बदलना होगा, ताकि स्टेटस में बदलाव होने पर, कॉम्पोज़ेबल अपने-आप फिर से कॉम्पोज़ हो सकें.

Android ऐप्लिकेशन में इस्तेमाल किए जाने वाले, मॉनिटर किए जा सकने वाले सामान्य टाइप से State<T> बनाने के लिए, अलग-अलग फ़ंक्शन वाले शिप बनाएं. इन इंटिग्रेशन का इस्तेमाल करने से पहले, यहां बताए गए तरीके से सही आर्टफ़ैक्ट जोड़ें:

• Flow: collectAsStateWithLifecycle()

  collectAsStateWithLifecycle() Flow से वैल्यू इकट्ठा करके, लाइफ़साइकल के बारे में जानकारी इकट्ठा करता है. इससे आपके ऐप्लिकेशन में, ऐप्लिकेशन के संसाधन सेव किए जा सकते हैं. यह कंपोज़ State से जनरेट हुई सबसे नई वैल्यू दिखाता है. Android ऐप्लिकेशन पर फ़्लो इकट्ठा करने के लिए, इस एपीआई का इस्तेमाल करें.

  ध्यान दें: collectAsStateWithLifecycle() एपीआई की मदद से, Android में सुरक्षित तरीके से फ़्लो इकट्ठा करने के बारे में ज़्यादा जानने के लिए, यह ब्लॉग पोस्ट पढ़ें.

  build.gradle फ़ाइल में यह डिपेंडेंसी ज़रूरी है. यह 2.6.0-beta01 या उससे नया वर्शन होना चाहिए:

Kotlin

dependencies {
      ...
      implementation("androidx.lifecycle:lifecycle-runtime-compose:2.8.5")
}

Groovy

dependencies {
      ...
      implementation "androidx.lifecycle:lifecycle-runtime-compose:2.8.5"
}

• Flow: collectAsState()

  collectAsState, collectAsStateWithLifecycle से मिलता-जुलता है, क्योंकि यह भी Flow से वैल्यू इकट्ठा करता है और उसे Compose State में बदल देता है.

  सिर्फ़ Android के लिए इस्तेमाल किए जाने वाले collectAsStateWithLifecycle के बजाय, collectAsState का इस्तेमाल करें.

  collectAsState के लिए, अतिरिक्त डिपेंडेंसी की ज़रूरत नहीं है, क्योंकि यह compose-runtime में उपलब्ध है.

• LiveData: observeAsState()

  observeAsState() इस LiveData को मॉनिटर करना शुरू कर देता है और State के ज़रिए इसकी वैल्यू दिखाता है.

  build.gradle फ़ाइल में, यह डिपेंडेंसी ज़रूरी है:

Kotlin

dependencies {
      ...
      implementation("androidx.compose.runtime:runtime-livedata:1.7.3")
}

ग्रूवी

dependencies {
      ...
      implementation "androidx.compose.runtime:runtime-livedata:1.7.3"
}

• RxJava2: subscribeAsState()

  subscribeAsState() ऐसे एक्सटेंशन फ़ंक्शन हैं जो RxJava2 की रिऐक्टिव स्ट्रीम (उदाहरण के लिए, Single, Observable, Completable) को Compose State में बदल देते हैं.

  build.gradle फ़ाइल में, यहां दी गई डिपेंडेंसी ज़रूरी है:

Kotlin

dependencies {
      ...
      implementation("androidx.compose.runtime:runtime-rxjava2:1.7.3")
}

ग्रूवी

dependencies {
      ...
      implementation "androidx.compose.runtime:runtime-rxjava2:1.7.3"
}

• RxJava3: subscribeAsState()

  subscribeAsState() ऐसे एक्सटेंशन फ़ंक्शन हैं जो RxJava3 की रिऐक्टिव स्ट्रीम (जैसे, Single, Observable, Completable) को Compose State में बदल देते हैं.

  build.gradle फ़ाइल में, यहां दी गई डिपेंडेंसी ज़रूरी है:

Kotlin

dependencies {
      ...
      implementation("androidx.compose.runtime:runtime-rxjava3:1.7.3")
}

ग्रूवी

dependencies {
      ...
      implementation "androidx.compose.runtime:runtime-rxjava3:1.7.3"
}

अहम जानकारी: State ऑब्जेक्ट को पढ़ने के बाद, 'लिखें' सुविधा अपने-आप फिर से कॉम्पोज़ हो जाती है. अगर Compose में LiveData जैसे किसी दूसरे ऑब्ज़र्वेबल टाइप का इस्तेमाल किया जाता है, तो उसे पढ़ने से पहले उसे State में बदल देना चाहिए. पक्का करें कि टाइप कन्वर्ज़न, LiveData<T>.observeAsState() जैसे कंपोज़ेबल एक्सटेंशन फ़ंक्शन का इस्तेमाल करके, कंपोज़ेबल में होता है.

ध्यान दें: इन इंटिग्रेशन के अलावा, और भी इंटिग्रेशन इस्तेमाल किए जा सकते हैं. Jetpack Compose के लिए एक्सटेंशन फ़ंक्शन बनाया जा सकता है, जो मॉनिटर किए जा सकने वाले अन्य टाइप को पढ़ता है. अगर आपका ऐप्लिकेशन, ऑब्ज़र्वेबल की किसी कस्टम क्लास का इस्तेमाल करता है, तो उसे produceState एपीआई का इस्तेमाल करके State<T> में बदलें.

ऐसा करने के तरीके के उदाहरणों के लिए, पहले से मौजूद फ़ंक्शन को लागू करने का तरीका देखें: collectAsStateWithLifecycle. किसी भी ऐसे ऑब्जेक्ट को State<T> में बदला जा सकता है और Composable में पढ़ा जा सकता है जो Jetpack Compose को हर बदलाव की सदस्यता लेने की अनुमति देता है.

स्टेटफ़ुल बनाम स्टेटलेस

किसी ऑब्जेक्ट को सेव करने के लिए remember का इस्तेमाल करने वाला कॉम्पोज़ेबल, इंटरनल स्टेटस बनाता है. इससे कॉम्पोज़ेबल स्टेटफ़ुल हो जाता है. HelloContent एक स्टेटफ़ुल कंपोज़ेबल का उदाहरण है, क्योंकि यह अपनी name स्थिति को अंदरूनी तौर पर होल्ड करता है और उसमें बदलाव करता है. यह उन स्थितियों में काम आ सकता है जहां कॉलर को राज्य को कंट्रोल करने की ज़रूरत नहीं है और वह इसका इस्तेमाल कर सकता है. इसके लिए, उसे स्टेट को खुद मैनेज करने की ज़रूरत नहीं है. हालांकि, इंटरनल स्टेट वाले कॉम्पोज़ेबल को फिर से इस्तेमाल करना मुश्किल होता है और उनकी जांच करना भी मुश्किल होता है.

स्टेटलेस कंपोज़ेबल ऐसे कंपोज़ेबल को कहा जाता है जिसमें कोई स्थिति नहीं होती. स्टेट होइस्टिंग का इस्तेमाल करके, स्टेटलेस सुविधा को आसानी से हासिल किया जा सकता है.

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

स्टेट होइस्टिंग

Compose में स्टेटस को होस्ट करने का मतलब, स्टेटस को कॉम्पोज़ेबल के कॉलर पर ले जाना है. इससे कॉम्पोज़ेबल को स्टेटलेस बनाया जा सकता है. Jetpack Compose में स्टेटस को होस्ट करने का सामान्य पैटर्न, स्टेटस वैरिएबल को दो पैरामीटर से बदलना है:

• value: T: दिखाने के लिए मौजूदा वैल्यू
• onValueChange: (T) -> Unit: वैल्यू बदलने का अनुरोध करने वाला इवेंट, जहां T सुझाई गई नई वैल्यू है

हालांकि, आपको onValueChange तक ही सीमित नहीं रहना होगा. अगर कंपोज़ेबल के लिए ज़्यादा सटीक इवेंट सही हैं, तो आपको उन्हें लैम्ब्डा का इस्तेमाल करके तय करना चाहिए.

इस तरह होस्ट की गई स्थिति की कुछ अहम प्रॉपर्टी हैं:

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

उदाहरण के मामले में, HelloContent से name और onValueChange को निकाला जाता है और उन्हें ट्री में ऊपर, HelloScreen कॉम्पोज़ेबल में ले जाया जाता है, जो HelloContent को कॉल करता है.

@Composable
fun HelloScreen() {
    var name by rememberSaveable { mutableStateOf("") }

    HelloContent(name = name, onNameChange = { name = it })
}

@Composable
fun HelloContent(name: String, onNameChange: (String) -> Unit) {
    Column(modifier = Modifier.padding(16.dp)) {
        Text(
            text = "Hello, $name",
            modifier = Modifier.padding(bottom = 8.dp),
            style = MaterialTheme.typography.bodyMedium
        )
        OutlinedTextField(value = name, onValueChange = onNameChange, label = { Text("Name") })
    }
}
StateOverviewSnippets.kt

HelloContent से स्टेट को बाहर निकालने से, कंपोज़ेबल के बारे में तर्क करना, अलग-अलग स्थितियों में दोबारा इस्तेमाल करना, और टेस्ट करना आसान हो जाता है. HelloContent को इस तरह से बांटा जाता है कि उसकी स्थिति को सेव नहीं किया जाता. डिकोड करने का मतलब है कि HelloScreen में बदलाव करने या उसे बदलने पर, आपको HelloContent को लागू करने का तरीका नहीं बदलना होगा.

जिस पैटर्न में स्थिति नीचे की ओर जाती है और इवेंट ऊपर जाते हैं उसे एकतरफ़ा डेटा फ़्लो कहा जाता है. इस मामले में, स्टेटस HelloScreen से HelloContent पर चला जाता है और इवेंट HelloContent से HelloScreen पर चले जाते हैं. एकतरफ़ा डेटा फ़्लो का इस्तेमाल करके, यूज़र इंटरफ़ेस (यूआई) में दिखने वाले कंपोज़ेबल को आपके ऐप्लिकेशन के उन हिस्सों से अलग किया जा सकता है जो स्टोर में मौजूद होते हैं और उनकी स्थिति बदलते हैं.

अहम जानकारी: स्टेटस को होस्ट करते समय, ये तीन नियम आपको यह तय करने में मदद करते हैं कि स्टेटस कहां जाना चाहिए:

1. स्टेटस को कम से कम उन सभी कॉम्पोज़ेबल के सबसे छोटे कॉमन पैरंट पर होस्ट किया जाना चाहिए जो स्टेटस का इस्तेमाल करते हैं (रीड).
2. राज्य को कम से कम पर उस के सबसे ऊंचे स्तर पर सेट किया जाना चाहिए जिसमें बदलाव किया जा सकता है (लिखें).
3. अगर एक ही इवेंट के जवाब में दो राज्य बदलते हैं, तो उन्हें एक साथ लहराना चाहिए.

इन नियमों के मुताबिक, होस्ट की गई स्थिति को ज़्यादा ऊपर किया जा सकता है. हालांकि, होस्ट की गई स्थिति को कम करने पर, एकतरफ़ा डेटा फ़्लो को फ़ॉलो करना मुश्किल या असंभव हो जाता है.

ज़्यादा जानने के लिए, स्टेटस को कहां होस्ट करना है पेज देखें.

Compose में स्टेटस को वापस लाना

rememberSaveable एपीआई, remember की तरह ही काम करता है. ऐसा इसलिए होता है, क्योंकि यह फिर से कॉम्पोज़ करने के दौरान स्थिति को बनाए रखता है. साथ ही, सेव किए गए इंस्टेंस की स्थिति के तरीके का इस्तेमाल करके, गतिविधि या प्रोसेस को फिर से बनाने के दौरान भी स्थिति को बनाए रखता है. उदाहरण के लिए, ऐसा तब होता है, जब स्क्रीन को घुमाया जाता है.

ध्यान दें: अगर उपयोगकर्ता ने गतिविधि को पूरी तरह से खारिज कर दिया है, तो rememberSaveable की स्थिति में कोई बदलाव नहीं होगा. उदाहरण के लिए, अगर उपयोगकर्ता हाल ही की गतिविधियों की स्क्रीन से मौजूदा गतिविधि को ऊपर की ओर स्वाइप करता है, तो यह स्थिति सेव नहीं रहती.

स्टेटस सेव करने के तरीके

Bundle में जोड़े गए सभी डेटा टाइप अपने-आप सेव हो जाते हैं. अगर आपको Bundle में जोड़ी जा सकने वाली कोई जानकारी सेव करनी है, तो इसके लिए कई विकल्प हैं.

Parcelize

इसका सबसे आसान समाधान है कि ऑब्जेक्ट में @Parcelize एनोटेशन जोड़ें. ऑब्जेक्ट को पार्स किया जा सकता है और उसे बंडल किया जा सकता है. उदाहरण के लिए, यह कोड पार्स किया जा सकने वाला City डेटा टाइप बनाता है और उसे राज्य में सेव करता है.

@Parcelize
data class City(val name: String, val country: String) : Parcelable

@Composable
fun CityScreen() {
    var selectedCity = rememberSaveable {
        mutableStateOf(City("Madrid", "Spain"))
    }
}
StateOverviewSnippets.kt

MapSaver

अगर किसी वजह से @Parcelize सही नहीं है, तो mapSaver का इस्तेमाल करके, किसी ऑब्जेक्ट को वैल्यू के सेट में बदलने के लिए अपना नियम तय किया जा सकता है. इस नियम को सिस्टम, Bundle में सेव कर सकता है.

data class City(val name: String, val country: String)

val CitySaver = run {
    val nameKey = "Name"
    val countryKey = "Country"
    mapSaver(
        save = { mapOf(nameKey to it.name, countryKey to it.country) },
        restore = { City(it[nameKey] as String, it[countryKey] as String) }
    )
}

@Composable
fun CityScreen() {
    var selectedCity = rememberSaveable(stateSaver = CitySaver) {
        mutableStateOf(City("Madrid", "Spain"))
    }
}
StateOverviewSnippets.kt

ListSaver

मैप के लिए कुंजियां तय करने की ज़रूरत से बचने के लिए, listSaver का इस्तेमाल भी किया जा सकता है. साथ ही, इसके इंडेक्स का इस्तेमाल कुंजियों के तौर पर भी किया जा सकता है:

data class City(val name: String, val country: String)

val CitySaver = listSaver<City, Any>(
    save = { listOf(it.name, it.country) },
    restore = { City(it[0] as String, it[1] as String) }
)

@Composable
fun CityScreen() {
    var selectedCity = rememberSaveable(stateSaver = CitySaver) {
        mutableStateOf(City("Madrid", "Spain"))
    }
}
StateOverviewSnippets.kt

Compose में राज्य के मालिक

स्टेटस को आसानी से होस्ट करने की सुविधा, कंपोज करने वाले फ़ंक्शन में ही मैनेज की जा सकती है. हालांकि, अगर ट्रैक करने के लिए स्टेटस की संख्या बढ़ जाती है या कॉम्पोज़ेबल फ़ंक्शन में काम करने के लिए लॉजिक की ज़रूरत पड़ती है, तो लॉजिक और स्टेटस की ज़िम्मेदारियों को दूसरी क्लास को सौंपना एक अच्छा तरीका है: स्टेटस होल्डर.

मुख्य शब्द: स्टेट होल्डर, कॉम्पोज़ेबल के लॉजिक और स्टेट को मैनेज करते हैं.

ध्यान दें कि अन्य मटीरियल में, स्टेट होल्डर को होइस्ड स्टेट ऑब्जेक्ट भी कहा जाता है.

ज़्यादा जानने के लिए, Compose में स्टेटस होस्टिंग दस्तावेज़ देखें. इसके अलावा, आम तौर पर, आर्किटेक्चर गाइड में स्टेटस होल्डर और यूज़र इंटरफ़ेस (यूआई) स्टेटस पेज देखें.

कुंजियों में बदलाव होने पर, कैलकुलेशन को याद रखने की सुविधा को फिर से ट्रिगर करना

remember एपीआई को MutableState के साथ अक्सर इस्तेमाल किया जाता है:

var name by remember { mutableStateOf("") }
StateOverviewSnippets.kt

यहां remember फ़ंक्शन का इस्तेमाल करने से, MutableState वैल्यू फिर से कॉम्पोनेंट में बंटने के बाद भी बनी रहती है.

आम तौर पर, remember में calculation Lambda पैरामीटर इस्तेमाल किया जाता है. जब remember पहली बार चलाया जाता है, तो यह calculation लैम्ब्डा फ़ंक्शन को कॉल करता है और उसका नतीजा सेव करता है. फिर से कॉम्पोज़ करने के दौरान, remember वह वैल्यू दिखाता है जिसे पिछली बार सेव किया गया था.

स्टेटस को कैश मेमोरी में सेव करने के अलावा, remember का इस्तेमाल करके कॉम्पोज़िशन में किसी ऐसे ऑब्जेक्ट या ऑपरेशन का नतीजा भी सेव किया जा सकता है जिसे शुरू करने या कैलकुलेट करने में ज़्यादा समय लगता है. हो सकता है कि आप हर बार कंपोजिशन बदलने पर, यह हिसाब न लगाना चाहें. इसका एक उदाहरण यह है कि इस ShaderBrush ऑब्जेक्ट को बनाया जा रहा है, जो कि एक महंगा ऑपरेशन है:

val brush = remember {
    ShaderBrush(
        BitmapShader(
            ImageBitmap.imageResource(res, avatarRes).asAndroidBitmap(),
            Shader.TileMode.REPEAT,
            Shader.TileMode.REPEAT
        )
    )
}
StateOverviewSnippets.kt

remember, वैल्यू को तब तक सेव करता है, जब तक वह कॉम्पोज़िशन से बाहर नहीं निकल जाती. हालांकि, कैश मेमोरी में सेव की गई वैल्यू को अमान्य करने का एक तरीका है. remember एपीआई में key या keys पैरामीटर भी शामिल होता है. अगर इनमें से कोई भी कुंजी बदलती है, तो अगली बार फ़ंक्शन फिर से बनने पर, remember कैश मेमोरी को अमान्य कर देता है और कैलकुलेशन के लिए lambda ब्लॉक को फिर से चलाता है. इस तरीके से, कॉम्पोज़िशन में किसी ऑब्जेक्ट के लाइफ़टाइम को कंट्रोल किया जा सकता है. कैलकुलेशन तब तक मान्य रहती है, जब तक इनपुट में बदलाव नहीं हो जाता. वह वैल्यू तब तक मान्य रहती है, जब तक याद रखी गई वैल्यू कंपोज़िशन से बाहर न निकल जाए.

नीचे दिए गए उदाहरणों से पता चलता है कि यह प्रोसेस कैसे काम करती है.

इस स्निपेट में, एक ShaderBrush बनाया गया है और इसका इस्तेमाल Box कंपोज़ेबल के बैकग्राउंड पेंट के तौर पर किया गया है. remember, ShaderBrush इंस्टेंस को सेव करता है, क्योंकि इसे फिर से बनाना महंगा होता है. जैसा कि पहले बताया गया है. remember, avatarRes को key1 पैरामीटर के तौर पर लेता है. यह बैकग्राउंड की चुनी गई इमेज होती है. अगर avatarRes में बदलाव होता है, तो ब्रश नई इमेज को फिर से दिखने लगता है और Box पर लागू हो जाता है. ऐसा तब हो सकता है, जब उपयोगकर्ता पिकर से बैकग्राउंड के तौर पर कोई दूसरी इमेज चुनता है.

@Composable
private fun BackgroundBanner(
    @DrawableRes avatarRes: Int,
    modifier: Modifier = Modifier,
    res: Resources = LocalContext.current.resources
) {
    val brush = remember(key1 = avatarRes) {
        ShaderBrush(
            BitmapShader(
                ImageBitmap.imageResource(res, avatarRes).asAndroidBitmap(),
                Shader.TileMode.REPEAT,
                Shader.TileMode.REPEAT
            )
        )
    }

    Box(
        modifier = modifier.background(brush)
    ) {
        /* ... */
    }
}
StateOverviewSnippets.kt

अगले स्निपेट में, स्टेट को सामान्य स्टेट होल्डर क्लास पर होस्ट किया गया है MyAppState. यह remember का इस्तेमाल करके, कक्षा के किसी इंस्टेंस को शुरू करने के लिए rememberMyAppState फ़ंक्शन को एक्सपोज़ करता है. Compose में, ऐसे फ़ंक्शन को एक्सपोज़ करना एक सामान्य पैटर्न है जिससे फिर से कॉम्पोज़ करने के बाद भी इंस्टेंस बना रहता है. rememberMyAppState फ़ंक्शन को windowSizeClass मिलता है, जो remember के लिए key पैरामीटर के तौर पर काम करता है. अगर यह पैरामीटर बदलता है, तो ऐप्लिकेशन को नई वैल्यू के साथ, प्लैन स्टेट होल्डर क्लास को फिर से बनाना होगा. उदाहरण के लिए, ऐसा तब हो सकता है, जब उपयोगकर्ता डिवाइस को घुमाए.

@Composable
private fun rememberMyAppState(
    windowSizeClass: WindowSizeClass
): MyAppState {
    return remember(windowSizeClass) {
        MyAppState(windowSizeClass)
    }
}

@Stable
class MyAppState(
    private val windowSizeClass: WindowSizeClass
) { /* ... */ }
StateOverviewSnippets.kt

ध्यान दें: सामान्य स्टेटस होल्डर क्लास के बारे में ज़्यादा जानने के लिए, स्टेटस के मालिक के तौर पर सामान्य स्टेटस होल्डर क्लास दस्तावेज़ देखें. इसके अलावा, आर्किटेक्चर गाइड में स्टेटस होल्डर और यूज़र इंटरफ़ेस (यूआई) स्टेटस दस्तावेज़ देखें.

Compose, क्लास के equals लागू करने का इस्तेमाल करके यह तय करता है कि किसी कुंजी में बदलाव हुआ है या नहीं. साथ ही, सेव की गई वैल्यू को अमान्य कर देता है.

ध्यान दें: पहली नज़र में, कुंजियों के साथ remember का इस्तेमाल करना, derivedStateOf जैसे अन्य Compose API का इस्तेमाल करने जैसा लग सकता है. इनके बीच के अंतर के बारे में जानने के लिए, Jetpack Compose — derivedStateOf का इस्तेमाल कब करना चाहिए? ब्लॉग पोस्ट देखें.

फिर से कॉम्पोज़ करने के बाद, कुंजियों के साथ स्टेटस सेव करना

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

ध्यान दें: एपीआई के नामकरण में अंतर है, जिस पर आपको ध्यान देना चाहिए. remember API में, पैरामीटर के नाम के तौर पर keys का इस्तेमाल किया जाता है. वहीं, rememberSaveable में उसी काम के लिए inputs का इस्तेमाल किया जाता है. अगर इनमें से किसी पैरामीटर में बदलाव होता है, तो कैश मेमोरी में सेव की गई वैल्यू अमान्य हो जाती है.

नीचे दिए गए उदाहरण में, rememberSaveable userTypedQuery को तब तक सेव करता है, जब तक कि typedQuery में बदलाव नहीं होता:

var userTypedQuery by rememberSaveable(typedQuery, stateSaver = TextFieldValue.Saver) {
    mutableStateOf(
        TextFieldValue(text = typedQuery, selection = TextRange(typedQuery.length))
    )
}
StateOverviewSnippets.kt

ज़्यादा जानें

स्टेट और Jetpack Compose के बारे में ज़्यादा जानने के लिए, यहां दिए गए अन्य रिसॉर्स देखें.

सैंपल

कोड लैब

• Jetpack Compose में स्टेट का इस्तेमाल करना

वीडियो

• कॉम्पोज़ करने के लिए सही मनोदशा

ब्लॉग

• Compose में TextField के लिए, स्टेट को असरदार तरीके से मैनेज करना