फायरबेस और जेटपैक कंपोज़ के साथ एक एंड्रॉइड ऐप बनाएं

1 परिचय

अंतिम अद्यतन: 2022-11-16

फायरबेस और जेटपैक कंपोज़ के साथ एक एंड्रॉइड ऐप बनाना

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

यह समझने के लिए पहला कदम कि फायरबेस और जेटपैक कंपोज़ एक साथ कितनी अच्छी तरह काम करते हैं, आधुनिक एंड्रॉइड आर्किटेक्चर को समझना है। एक अच्छा आर्किटेक्चर सिस्टम को समझने में आसान, विकसित करने में आसान और रखरखाव में आसान बनाता है, क्योंकि यह यह स्पष्ट करता है कि घटक कैसे व्यवस्थित हैं और एक दूसरे के साथ संवाद करते हैं। एंड्रॉइड दुनिया में, अनुशंसित आर्किटेक्चर को मॉडल - व्यू - व्यूमॉडल कहा जाता है। मॉडल उस परत का प्रतिनिधित्व करता है जो एप्लिकेशन में डेटा तक पहुंचती है। दृश्य यूआई परत है और इसे व्यावसायिक तर्क के बारे में कुछ नहीं पता होना चाहिए। और ViewModel वह जगह है जहां व्यावसायिक तर्क लागू किया जाता है, जिसे कभी-कभी मॉडल परत को कॉल करने के लिए ViewModel की आवश्यकता होती है।

जेटपैक कंपोज़ के साथ निर्मित एंड्रॉइड ऐप पर मॉडल - व्यू - व्यूमॉडल को कैसे लागू किया जाता है, यह समझने के लिए हम इस लेख को पढ़ने की दृढ़ता से सलाह देते हैं, क्योंकि इससे कोडबेस को समझना आसान हो जाएगा और अगले चरणों को पूरा करना आसान हो जाएगा।

आप क्या बनाएंगे

मेक इट सो एक सरल टू-डू सूची एप्लिकेशन है जो उपयोगकर्ता को कार्यों को जोड़ने और संपादित करने, झंडे, प्राथमिकताएं और नियत तिथियां जोड़ने और कार्यों को पूर्ण के रूप में चिह्नित करने की अनुमति देता है। नीचे दी गई छवियां इस एप्लिकेशन के दो मुख्य पृष्ठ दिखाती हैं: कार्य निर्माण पृष्ठ और बनाए गए कार्यों की सूची वाला मुख्य पृष्ठ।

इसे बनाएं ताकि टास्क स्क्रीन जोड़ेंइसे होम स्क्रीन बनाएं

आप कुछ ऐसी सुविधाएं जोड़ेंगे जो इस ऐप में नहीं हैं:

  • उपयोगकर्ताओं को ईमेल और पासवर्ड से प्रमाणित करें
  • फायरस्टोर संग्रह में एक श्रोता जोड़ें और यूआई को परिवर्तनों पर प्रतिक्रिया दें
  • ऐप में विशिष्ट कोड के प्रदर्शन की निगरानी के लिए कस्टम निशान जोड़ें
  • रिमोट कॉन्फिग का उपयोग करके एक फीचर टॉगल बनाएं और इसे लॉन्च करने के लिए चरणबद्ध रोलआउट का उपयोग करें

आप क्या सीखेंगे

  • आधुनिक एंड्रॉइड एप्लिकेशन में फायरबेस प्रमाणीकरण, प्रदर्शन मॉनिटरिंग, रिमोट कॉन्फ़िगरेशन और क्लाउड फायरस्टोर का उपयोग कैसे करें
  • फायरबेस एपीआई को एमवीवीएम आर्किटेक्चर में कैसे फिट किया जाए
  • कंपोज़ यूआई में फायरबेस एपीआई के साथ किए गए परिवर्तनों को कैसे प्रतिबिंबित करें

आपको किस चीज़ की ज़रूरत पड़ेगी

2. नमूना ऐप प्राप्त करें और फायरबेस सेट करें

नमूना ऐप का कोड प्राप्त करें

कमांड लाइन से GitHub रिपॉजिटरी को क्लोन करें:

git clone https://github.com/FirebaseExtended/make-it-so-android.git

फायरबेस सेट करें

पहली चीज़ जो आपको करने की ज़रूरत है वह है फ़ायरबेस कंसोल पर जाना और "+ प्रोजेक्ट जोड़ें" बटन पर क्लिक करके फ़ायरबेस प्रोजेक्ट बनाना, जैसा कि आप नीचे देख सकते हैं:

फायरबेस कंसोल

प्रोजेक्ट निर्माण पूरा करने के लिए स्क्रीन पर दिए गए चरणों का पालन करें।

प्रत्येक फायरबेस प्रोजेक्ट के अंदर, आप अलग-अलग ऐप बना सकते हैं: एंड्रॉइड, आईओएस, वेब, फ़्लटर और यूनिटी के लिए। जैसा कि आप यहां देख रहे हैं, Android विकल्प चुनें:

फायरबेस परियोजना अवलोकन

फिर इन चरणों का पालन करें:

  1. पैकेज नाम के रूप में com.example.makeitso दर्ज करें और, वैकल्पिक रूप से, एक उपनाम दर्ज करें। इस कोडलैब के लिए, आपको डिबग हस्ताक्षर प्रमाणपत्र जोड़ने की आवश्यकता नहीं है।
  2. अपने ऐप को पंजीकृत करने और फायरबेस कॉन्फ़िगरेशन फ़ाइल तक पहुंचने के लिए अगला क्लिक करें।
  3. अपनी कॉन्फ़िगरेशन फ़ाइल डाउनलोड करने और इसे make-it-so-android/app निर्देशिका में सहेजने के लिए डाउनलोड google-services.json पर क्लिक करें।
  4. अगला पर क्लिक करें । चूँकि फ़ायरबेस SDK पहले से ही नमूना प्रोजेक्ट में build.gradle फ़ाइल में शामिल हैं, इसलिए अगले चरणों पर जाने के लिए Next पर क्लिक करें।
  5. समाप्त करने के लिए कंसोल पर जारी रखें पर क्लिक करें।

मेक इट सो ऐप को ठीक से काम करने के लिए, कोड पर जाने से पहले आपको कंसोल में दो चीजें करने की ज़रूरत है: प्रमाणीकरण प्रदाताओं को सक्षम करें और फायरस्टोर डेटाबेस बनाएं। सबसे पहले, आइए प्रमाणीकरण सक्षम करें ताकि उपयोगकर्ता ऐप में लॉग इन कर सकें:

  1. बिल्ड मेनू से, प्रमाणीकरण चुनें, और फिर प्रारंभ करें पर क्लिक करें।
  2. साइन-इन विधि कार्ड से, ईमेल/पासवर्ड चुनें और इसे सक्षम करें।
  3. इसके बाद, नया प्रदाता जोड़ें पर क्लिक करें और अज्ञात को चुनें और सक्षम करें।

इसके बाद, फायरस्टोर स्थापित करें। आप साइन-इन किए गए उपयोगकर्ता के कार्यों को संग्रहीत करने के लिए फायरस्टोर का उपयोग करेंगे। प्रत्येक उपयोगकर्ता को डेटाबेस के संग्रह के भीतर अपना स्वयं का दस्तावेज़ मिलेगा।

  1. बिल्ड मेनू से, फायरस्टोर चुनें, फिर डेटाबेस बनाएं पर क्लिक करें।
  2. प्रोडक्शन मोड में स्टार्ट को सक्षम रखें और नेक्स्ट पर क्लिक करें।
  3. संकेत मिलने पर, उस स्थान का चयन करें जहां आपका क्लाउड फायरस्टोर डेटा संग्रहीत किया जाएगा। एक प्रोडक्शन ऐप विकसित करते समय, आप चाहेंगे कि यह आपके अधिकांश उपयोगकर्ताओं के करीब एक क्षेत्र में हो और फ़ंक्शंस जैसी अन्य फायरबेस सेवाओं के साथ समान हो। इस कोडलैब के लिए, आप डिफ़ॉल्ट क्षेत्र को बनाए रख सकते हैं या अपने निकटतम क्षेत्र का चयन कर सकते हैं।
  4. अपने फायरस्टोर डेटाबेस को व्यवस्थित करने के लिए सक्षम करें पर क्लिक करें।

आइए फायरस्टोर डेटाबेस के लिए मजबूत सुरक्षा नियम बनाने के लिए कुछ समय लें। फायरस्टोर डैशबोर्ड खोलें और नियम टैब पर जाएं। फिर इस तरह दिखने के लिए सुरक्षा नियमों को अपडेट करें:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow create: if request.auth != null;
      allow read, update, delete: if request.auth != null && resource.data.userId == request.auth.uid;
    }
  }
}

ये नियम मूल रूप से कहते हैं कि ऐप का कोई भी साइन-इन उपयोगकर्ता किसी भी संग्रह में अपने लिए एक दस्तावेज़ बना सकता है। फिर, एक बार बन जाने के बाद, केवल उस दस्तावेज़ को बनाने वाला उपयोगकर्ता ही उस दस्तावेज़ को देख, अपडेट या हटा सकेगा।

एप्लिकेशन चलाएँ

अब आप एप्लिकेशन चलाने के लिए तैयार हैं! एंड्रॉइड स्टूडियो में make-it-so-android/start फ़ोल्डर खोलें और ऐप चलाएं (यह एंड्रॉइड एमुलेटर या वास्तविक एंड्रॉइड डिवाइस का उपयोग करके किया जा सकता है)।

3. फायरबेस प्रमाणीकरण

आप कौन सी सुविधा जोड़ने जा रहे हैं?

मेक इट सो सैंपल ऐप की वर्तमान स्थिति में, उपयोगकर्ता पहले साइन-इन किए बिना ऐप का उपयोग शुरू कर सकता है। इसे प्राप्त करने के लिए यह अनाम प्रमाणीकरण का उपयोग करता है। हालाँकि, अनाम खाते किसी उपयोगकर्ता को अन्य उपकरणों पर या भविष्य के सत्रों में भी अपने डेटा तक पहुँचने की अनुमति नहीं देते हैं। यद्यपि अनाम प्रमाणीकरण गर्मजोशीपूर्ण ऑनबोर्डिंग के लिए उपयोगी है, आपको हमेशा उपयोगकर्ताओं को साइन-इन के एक अलग रूप में कनवर्ट करने का विकल्प प्रदान करना चाहिए। इसे ध्यान में रखते हुए, इस कोडलैब में, आप मेक इट सो ऐप में ईमेल और पासवर्ड प्रमाणीकरण जोड़ देंगे।

कोड करने का समय!

जैसे ही उपयोगकर्ता एक खाता बनाता है, एक ईमेल और एक पासवर्ड टाइप करके, आपको ईमेल क्रेडेंशियल के लिए फायरबेस प्रमाणीकरण एपीआई से पूछना होगा, फिर नए क्रेडेंशियल को अज्ञात खाते से लिंक करना होगा। एंड्रॉइड स्टूडियो में AccountServiceImpl.kt फ़ाइल खोलें और linkAccount फ़ंक्शन को अपडेट करें ताकि यह निम्न जैसा दिखे:

मॉडल/सेवा/impl/AccountServiceImpl.kt

override suspend fun linkAccount(email: String, password: String) {
    val credential = EmailAuthProvider.getCredential(email, password)
    auth.currentUser!!.linkWithCredential(credential).await()
}

अब SignUpViewModel.kt खोलें और onSignUpClick फ़ंक्शन के launchCatching ब्लॉक के अंदर सर्विस linkAccount फ़ंक्शन को कॉल करें:

स्क्रीन/sign_up/SignUpViewModel.kt

launchCatching {
    accountService.linkAccount(email, password)
    openAndPopUp(SETTINGS_SCREEN, SIGN_UP_SCREEN)
}

सबसे पहले यह प्रमाणित करने का प्रयास करता है, और यदि कॉल सफल हो जाती है, तो यह अगली स्क्रीन ( SettingsScreen ) पर आगे बढ़ती है। चूँकि आप इन कॉलों को launchCatching ब्लॉक के अंदर निष्पादित कर रहे हैं, यदि पहली पंक्ति पर कोई त्रुटि होती है, तो अपवाद को पकड़ लिया जाएगा और नियंत्रित किया जाएगा, और दूसरी पंक्ति तक बिल्कुल भी नहीं पहुंचा जाएगा।

जैसे ही SettingsScreen दोबारा खोली जाती है, आपको यह सुनिश्चित करना होगा कि साइन इन और खाता बनाएं के विकल्प खत्म हो गए हैं, क्योंकि अब उपयोगकर्ता पहले से ही प्रमाणित है। ऐसा करने के लिए, आइए SettingsViewModel को वर्तमान उपयोगकर्ता की स्थिति सुनें ( AccountService.kt में उपलब्ध), यह जांचने के लिए कि खाता गुमनाम है या नहीं। ऐसा करने के लिए, निम्नलिखित की तरह दिखने के लिए uiState को SettingsViewModel.kt में अपडेट करें:

स्क्रीन/सेटिंग्स/सेटिंग्सव्यूमॉडल.kt

val uiState = accountService.currentUser.map {
    SettingsUiState(it.isAnonymous)
}

आखिरी चीज़ जो आपको करने की ज़रूरत है वह है SettingsViewModel द्वारा उत्सर्जित राज्यों को एकत्र करने के लिए SettingsScreen.kt .kt में uiState अपडेट करना:

स्क्रीन/सेटिंग्स/SettingsScreen.kt

val uiState by viewModel.uiState.collectAsState(
    initial = SettingsUiState(false)
)

अब हर बार जब उपयोगकर्ता बदलता है, SettingsScreen उपयोगकर्ता की नई प्रमाणीकरण स्थिति के अनुसार विकल्प प्रदर्शित करने के लिए स्वयं को पुन: संयोजित करेगी।

परीक्षण का समय!

मेक इट सो चलाएँ और स्क्रीन के ऊपरी दाएँ कोने पर गियर आइकन पर क्लिक करके सेटिंग्स पर जाएँ। वहां से, खाता बनाएं विकल्प पर क्लिक करें:

इसे सेटिंग स्क्रीन पर बनाएंइसे बनाएं तो साइन अप स्क्रीन

अपना खाता बनाने के लिए एक वैध ईमेल और एक मजबूत पासवर्ड टाइप करें। इसे काम करना चाहिए और आपको सेटिंग पृष्ठ पर पुनः निर्देशित किया जाना चाहिए, जहां आपको दो नए विकल्प दिखाई देंगे: साइन आउट करने और अपना खाता हटाने के लिए। आप उपयोगकर्ता टैब पर क्लिक करके फायरबेस कंसोल पर प्रमाणीकरण डैशबोर्ड में बनाए गए नए खाते की जांच कर सकते हैं।

4. क्लाउड फायरस्टोर

आप कौन सी सुविधा जोड़ने जा रहे हैं?

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

कोड करने का समय!

इस तरह दिखने के लिए StorageServiceImpl.kt में उपलब्ध Flow अपडेट करें:

मॉडल/सेवा/impl/StorageServiceImpl.kt

override val tasks: Flow<List<Task>>
    get() =
      auth.currentUser.flatMapLatest { user ->
        firestore.collection(TASK_COLLECTION).whereEqualTo(USER_ID_FIELD, user.id).dataObjects()
      }

यह कोड user.id के आधार पर कार्य संग्रह में एक श्रोता जोड़ रहा है। प्रत्येक कार्य को tasks नामक संग्रह में एक दस्तावेज़ द्वारा दर्शाया जाता है, और उनमें से प्रत्येक में userId नामक एक फ़ील्ड होता है। कृपया ध्यान दें कि यदि currentUser की स्थिति बदलती है (उदाहरण के लिए, साइन आउट करके) तो एक नया Flow उत्सर्जित होगा।

अब आपको TasksViewModel.kt में Flow सेवा के समान ही प्रतिबिंबित करने की आवश्यकता है:

स्क्रीन/कार्य/टास्कव्यूमॉडल.kt

val tasks = storageService.tasks

और आखिरी बात होगी TasksScreens.kt में composable function बनाना, जो यूआई का प्रतिनिधित्व करता है, इस प्रवाह से अवगत रहें और इसे एक स्थिति के रूप में एकत्रित करें। हर बार जब स्थिति बदलती है, तो कंपोज़ेबल फ़ंक्शन स्वचालित रूप से स्वयं को पुन: संयोजित करेगा और उपयोगकर्ता को नवीनतम स्थिति प्रदर्शित करेगा। इसे TasksScreen composable function में जोड़ें:

स्क्रीन/कार्य/टास्कस्क्रीन.kt

val tasks = viewModel
    .tasks
    .collectAsStateWithLifecycle(emptyList())

एक बार जब कंपोज़ेबल फ़ंक्शन की इन स्थितियों तक पहुंच हो जाती है, तो आप इस तरह दिखने के लिए LazyColumn (जो वह संरचना है जिसका उपयोग आप स्क्रीन पर एक सूची प्रदर्शित करने के लिए करते हैं) को अपडेट कर सकते हैं:

स्क्रीन/कार्य/टास्कस्क्रीन.kt

LazyColumn {
    items(tasks.value, key = { it.id }) { taskItem ->
        TaskItem( [...] )
    }
}

परीक्षण का समय!

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

5. प्रदर्शन की निगरानी

आप कौन सी सुविधा जोड़ने जा रहे हैं?

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

कोड करने का समय!

यदि आप Performance.kt फ़ाइल खोलते हैं, तो आपको ट्रेस नामक एक इनलाइन फ़ंक्शन दिखाई देगा। यह फ़ंक्शन एक कस्टम ट्रेस बनाने के लिए परफॉर्मेंस मॉनिटरिंग एपीआई को कॉल करता है, जो एक पैरामीटर के रूप में ट्रेस नाम के साथ गुजरता है। दूसरा पैरामीटर जो आप देखते हैं वह कोड का ब्लॉक है जिसे आप मॉनिटर करना चाहते हैं। प्रत्येक ट्रेस के लिए एकत्र की गई डिफ़ॉल्ट मीट्रिक पूरी तरह से चलने में लगने वाला समय है:

मॉडल/सेवा/Performance.kt

inline fun <T> trace(name: String, block: Trace.() -> T): T = Trace.create(name).trace(block)

आप चुन सकते हैं कि कोडबेस के किन हिस्सों को मापना आपके लिए महत्वपूर्ण है और उसमें कस्टम ट्रेस जोड़ें। यहां linkAccount फ़ंक्शन में एक कस्टम ट्रेस जोड़ने का एक उदाहरण दिया गया है जिसे आपने पहले इस कोडलैब में ( AccountServiceImpl.kt में) देखा था:

मॉडल/सेवा/impl/AccountServiceImpl.kt

override suspend fun linkAccount(email: String, password: String): Unit =
  trace(LINK_ACCOUNT_TRACE) {
      val credential = EmailAuthProvider.getCredential(email, password)
      auth.currentUser!!.linkWithCredential(credential).await()
  }

अब आपकी बारी है! मेक इट सो ऐप में कुछ कस्टम निशान जोड़ें और यह जांचने के लिए अगले अनुभाग पर जाएं कि क्या यह अपेक्षा के अनुरूप काम करता है।

परीक्षण का समय!

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

कस्टम ट्रेस टैब पर जाएं और जांचें कि कोडबेस में आपके द्वारा जोड़े गए ट्रेस वहां प्रदर्शित हो रहे हैं, और आप देख सकते हैं कि कोड के इन टुकड़ों को निष्पादित करने में आमतौर पर कितना समय लगता है।

6. रिमोट कॉन्फिग

आप कौन सी सुविधा जोड़ने जा रहे हैं?

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

कोड करने का समय!

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

रिमोट कॉन्फिग एक पैरामीटर संवाद बनाएं

एक बार सभी फ़ील्ड भर जाने के बाद, आप सहेजें बटन पर क्लिक कर सकते हैं और फिर प्रकाशित कर सकते हैं । अब जब पैरामीटर बन गया है और आपके कोडबेस पर उपलब्ध है, तो आपको वह कोड जोड़ना होगा जो आपके ऐप में नए मान लाएगा। ConfigurationServiceImpl.kt फ़ाइल खोलें और इन दो कार्यों के कार्यान्वयन को अद्यतन करें:

मॉडल/सेवा/impl/ConfigurationServiceImpl.kt

override suspend fun fetchConfiguration(): Boolean {
  return remoteConfig.fetchAndActivate().await()
}

override val isShowTaskEditButtonConfig: Boolean
  get() = remoteConfig[SHOW_TASK_EDIT_BUTTON_KEY].asBoolean()

पहला फ़ंक्शन सर्वर से मान प्राप्त करता है, और ऐप शुरू होते ही इसे SplashViewModel.kt में कॉल किया जा रहा है। यह सुनिश्चित करने का सबसे अच्छा तरीका है कि सबसे अद्यतित मान शुरुआत से ही सभी स्क्रीन पर उपलब्ध होंगे। यदि आप बाद में यूआई या ऐप का व्यवहार बदलते हैं, जब उपयोगकर्ता कुछ करने के बीच में होता है तो यह एक अच्छा उपयोगकर्ता अनुभव नहीं है!

दूसरा फ़ंक्शन बूलियन मान लौटा रहा है जो उस पैरामीटर के लिए प्रकाशित किया गया था जिसे आपने अभी कंसोल में बनाया था। और आपको निम्नलिखित को loadTaskOptions फ़ंक्शन में जोड़कर TasksViewModel.kt में इस जानकारी को पुनः प्राप्त करना होगा:

स्क्रीन/कार्य/टास्कव्यूमॉडल.kt

fun loadTaskOptions() {
  val hasEditOption = configurationService.isShowTaskEditButtonConfig
  options.value = TaskActionOption.getOptions(hasEditOption)
}

आप पहली पंक्ति पर मान पुनर्प्राप्त कर रहे हैं, और दूसरी पंक्ति पर कार्य आइटम के लिए मेनू विकल्प लोड करने के लिए इसका उपयोग कर रहे हैं। यदि मान false है, तो इसका मतलब है कि मेनू में संपादन विकल्प नहीं होगा। अब जब आपके पास विकल्पों की सूची है, तो आपको यूआई को इसे सही ढंग से प्रदर्शित करने की आवश्यकता है। जैसे ही आप जेटपैक कंपोज़ के साथ एक ऐप बना रहे हैं, आपको composable function की तलाश करनी होगी जो घोषित करता है कि TasksScreen का यूआई कैसा दिखना चाहिए। इसलिए TasksScreen.kt फ़ाइल खोलें और TasksViewModel.kt में उपलब्ध विकल्पों को इंगित करने के लिए LazyColum अपडेट करें:

स्क्रीन/कार्य/टास्कस्क्रीन.kt

val options by viewModel.options

LazyColumn {
  items(tasks.value, key = { it.id }) { taskItem ->
    TaskItem(
      options = options,
      [...]
    )
  }
}

TaskItem एक अन्य composable function है जो बताता है कि किसी एकल कार्य का यूआई कैसा दिखना चाहिए। और प्रत्येक कार्य में विकल्पों के साथ एक मेनू होता है जो तब प्रदर्शित होता है जब उपयोगकर्ता इसके अंत में तीन बिंदु वाले आइकन पर क्लिक करता है।

परीक्षण का समय!

अब आप ऐप चलाने के लिए तैयार हैं! जांचें कि फायरबेस कंसोल का उपयोग करके आपने जो मान प्रकाशित किया है वह ऐप के व्यवहार से मेल खाता है:

  • यदि यह false , तो तीन बिंदु वाले आइकन पर क्लिक करते समय आपको केवल दो विकल्प दिखाई देने चाहिए;
  • यदि यह true , तो तीन बिंदु वाले आइकन पर क्लिक करते समय आपको तीन विकल्प दिखाई देने चाहिए;

कंसोल में मान को कुछ बार बदलने और ऐप को पुनरारंभ करने का प्रयास करें। रिमोट कॉन्फिग का उपयोग करके अपने ऐप में नई सुविधाएं लॉन्च करना कितना आसान है!

7. बधाई

बधाई हो, आपने फायरबेस और जेटपैक कंपोज़ के साथ सफलतापूर्वक एक एंड्रॉइड ऐप बना लिया है!

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

अग्रिम पठन

संदर्भ दस्तावेज़