Android Kotlin से जुड़े 03.1 वर्शन: फ़्रैगमेंट बनाना

यह कोडलैब Android Kotlin के बुनियादी कोर्स में शामिल है. अगर आप कोडलैब के क्रम में काम करते हैं, तो आपको इस कोर्स का ज़्यादा से ज़्यादा फ़ायदा मिलेगा. सभी कोर्स कोडलैब Android Kotlin से जुड़े बेसिक कोडलैब के लैंडिंग पेज पर दिए गए हैं.

इस कोडलैब में, आप फ़्रैगमेंट के बारे में जान सकते हैं. साथ ही, आप AndroidTrivia नाम के स्टार्टर ऐप्लिकेशन में फ़्रैगमेंट बना सकते हैं. अगले कोडलैब में, आप नेविगेशन के बारे में ज़्यादा जानेंगे और AndroidTrivia ऐप्लिकेशन पर आगे काम करेंगे.

आपको क्या पता होना चाहिए

• Kotlin से जुड़ी बुनियादी बातें
• Kotlin में सामान्य Android ऐप्लिकेशन बनाने का तरीका
• लेआउट के साथ काम करने का तरीका

आप इन चीज़ों के बारे में जानेंगे

• फ़्रैगमेंट को अपने ऐप्लिकेशन में स्टैटिक तरीके से जोड़ने का तरीका

आप क्या कर पाएंगे!

• किसी ऐक्टिविटी में फ़्रैगमेंट बनाएं.

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

AndroidTrivia ऐप्लिकेशन नेविगेशन पैटर्न और कंट्रोल के बारे में बताता है. ऐप्लिकेशन में कई कॉम्पोनेंट होते हैं:

• शीर्षक स्क्रीन में, ऊपर स्क्रीनशॉट में बाईं ओर दिखाया गया, उपयोगकर्ता गेम शुरू करता है.
• गेम की स्क्रीन में, ऊपर दिए गए सवालों के साथ उपयोगकर्ता, गेम खेलता है और अपने जवाब सबमिट करता है.
• ऊपर दाईं ओर दिखाया गया नेविगेशन पैनल, ऐप्लिकेशन के किनारे से बाहर स्लाइड करता है और इसमें हेडर वाला मेन्यू होता है. पैनल का आइकॉन नेविगेशन पैनल को खोलता है. नेविगेशन-ड्रॉ मेन्यू में, जानकारी वाले पेज का लिंक और गेम के नियमों का लिंक मौजूद होता है.

ऐप्लिकेशन के सबसे ऊपर एक रंगीन व्यू दिखता है, जिसे ऐप्लिकेशन बार कहते हैं. इसे कार्रवाई बार भी कहा जाता है.

इस कोडलैब में आप एक स्टार्टर ऐप्लिकेशन से काम करते हैं, जो ट्रिविया ऐप्लिकेशन को पूरा करते समय टेंप्लेट कोड और फ़्रैगमेंट क्लास देता है.

1. Android Studio प्रोजेक्ट AndroidTrivia-Starter डाउनलोड करें.
2. प्रोजेक्ट को Android Studio में खोलें और ऐप्लिकेशन चलाएं. ऐप्लिकेशन खुलने पर, यह ऐप्लिकेशन का नाम और खाली स्क्रीन दिखाने के अलावा और कुछ नहीं कर सकता.
   
   
   
3. Android Studio प्रोजेक्ट पैनल में, प्रोजेक्ट फ़ाइल खोलने के लिए 'प्रोजेक्ट: Android व्यू' खोलें. MainActivity क्लास और फ़्रैगमेंट क्लास
   
   देखने के लिए, app > java फ़ोल्डर खोलें.
4. res > लेआउट फ़ोल्डर खोलें और activity_main.xml पर दो बार क्लिक करें. activity_main.xml फ़ाइल, लेआउट एडिटर में दिखती है.
5. डिज़ाइन टैब पर क्लिक करें. activity_main.xml फ़ाइल के लिए, कॉम्पोनेंट ट्री रूट लेआउट दिखाता है. यह वर्टिकल लेआउट, LinearLayout के तौर पर दिखता है.
   
   
   
   वर्टिकल में लीनियर लेआउट, लेआउट में मौजूद सभी चाइल्ड व्यू अलाइन कर लिए जाते हैं.

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

फ़्रैगमेंट को किसी गतिविधि के मॉड्यूलर सेक्शन की तरह देखें, जैसे कि &subt>सब गतिविधि&कोटेशन; जिसे आप दूसरी गतिविधियों में भी इस्तेमाल कर सकते हैं:

• फ़्रैगमेंट का अपना लाइफ़साइकल होता है और यह अपने इनपुट इवेंट पाता है.
• गतिविधि के दौरान, फ़्रैगमेंट को जोड़ा या हटाया जा सकता है.
• फ़्रैगमेंट को Kotlin क्लास में परिभाषित किया जाता है.
• फ़्रैगमेंट' के यूज़र इंटरफ़ेस (यूआई) को एक्सएमएल लेआउट फ़ाइल में तय किया जाता है.

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

पहला चरण: फ़्रैगमेंट क्लास जोड़ना

इस चरण में, आपको एक खाली TitleFragment क्लास बनानी होगी. नए फ़्रैगमेंट के लिए Kotlin क्लास बनाकर शुरुआत करें:

1. Android Studio में, प्रोजेक्ट फ़ाइलों पर वापस फ़ोकस लाने के लिए, प्रोजेक्ट पैनल के अंदर कहीं भी क्लिक करें. उदाहरण के लिए, com.example.android.navigation फ़ोल्डर पर क्लिक करें.
2. फ़ाइल > नया > फ़्रैगमेंट > फ़्रैगमेंट (खाली) चुनें.
3. फ़्रैगमेंट के नाम के लिए, TitleFragment का इस्तेमाल करें. लेआउट एक्सएमएल बनाएं, फ़्रैगमेंट फ़ैक्ट्री तरीकों को शामिल करें, और इंटरफ़ेस कॉलबैक शामिल करें समेत सभी चेकबॉक्स साफ़ करें.
4. पूरा करें पर क्लिक करें.
5. अगर TitleFragment.kt फ़्रैगमेंट फ़ाइल पहले से खुली हुई नहीं है, तो उसे खोलें. इसमें onCreateView() मैथड शामिल होता है. यह उन तरीकों में से एक है जिन्हें फ़्रैगमेंट और #39; लाइफ़साइकल के दौरान इस्तेमाल किया जाता है.
6. onCreateView() में, return TextView(activity).apply के सेक्शन को हटाएं. इसमें setText से शुरू होने वाली लाइन भी शामिल है. onCreateView() फ़ंक्शन सिर्फ़ इस कोड के साथ चलता है:

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                         savedInstanceState: Bundle?): View? {
}

बाइंडिंग ऑब्जेक्ट बनाना

फ़्रैगमेंट अभी कंपाइल नहीं हो पाएगा. फ़्रैगमेंट कंपाइल करने के लिए, आपको बाइंडिंग ऑब्जेक्ट बनाना होगा और फ़्रैगमेंट's व्यू को बढ़ाना होगा (जो किसी गतिविधि के लिए setContentView() का इस्तेमाल करने के बराबर है).

1. TitleFragment.kt के onCreateView() तरीके में, एक binding वैरिएबल (val binding) बनाएं.
2. फ़्रैगमेंट' के व्यू को इनफ़्लेट करने के लिए, फ़्रैगमेंट's Binding ऑब्जेक्ट पर DataBindingUtil.inflate() वाले तरीके को कॉल करें. यह FragmentTitleBinding है.
   
   इस तरीके में चार पैरामीटर पास करें:

• inflater, जो LayoutInflater का इस्तेमाल बाइंडिंग लेआउट को बढ़ाने के लिए किया जाता है.
• लेआउट का इनफ़्लेट बढ़ाने के लिए एक्सएमएल लेआउट रिसॉर्स. R.layout.fragment_title के लिए, पहले से तय किए गए किसी एक लेआउट का इस्तेमाल करें.
• पैरंट ViewGroup के लिए container. (यह पैरामीटर ज़रूरी नहीं है.)
• attachToParent मान के लिए false.
  

2. बाइंडिंग को असाइन करें, जो DataBindingUtil.inflate को binding वैरिएबल पर रिटर्न करता है.
3. इस तरीके से binding.root दिखाएं, जिसमें इनफ़्लेट किया गया व्यू शामिल है. आपका onCreateView() तरीका अब नीचे दिए गए कोड जैसा दिखता है:

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                         savedInstanceState: Bundle?): View? {
   val binding = DataBindingUtil.inflate<FragmentTitleBinding>(inflater,
           R.layout.fragment_title,container,false)
   return binding.root
   }

दूसरा चरण: नए फ़्रैगमेंट को मुख्य लेआउट फ़ाइल में जोड़ना

इस कदम में, ऐप्लिकेशन की TitleFragment लेआउट activity_main.xml लेआउट फ़ाइल जोड़ें.

1. res > layout > activity_main.xml खोलें और लेआउट का एक्सएमएल कोड देखने के लिए, टेक्स्ट टैब पर क्लिक करें.
2. मौजूदा LinearLayout एलिमेंट में fragment एलिमेंट जोड़ें.
3. फ़्रैगमेंट's का आईडी titleFragment पर सेट करें.
4. फ़्रैगमेंट' के नाम को फ़्रैगमेंट क्लास के पूरे पाथ पर सेट करें, जो इस मामले में com.example.android.navigation.TitleFragment है.
5. लेआउट की चौड़ाई और ऊंचाई को match_parent पर सेट करें.

<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <fragment
                android:id="@+id/titleFragment"
                android:name="com.example.android.navigation.TitleFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                />
        </LinearLayout>

</layout>

6. ऐप्लिकेशन चलाएं. फ़्रैगमेंट को आपकी मुख्य स्क्रीन पर जोड़ दिया गया है.

Android Studio प्रोजेक्ट: AndroidTriviaFragment

इस कोडलैब में, आपने AndroidTrivia ऐप्लिकेशन में एक फ़्रैगमेंट जोड़ा है, जो इस लेसन के अगले दो कोडलैब में काम करता रहेगा.

• फ़्रैगमेंट किसी गतिविधि का मॉड्यूलर सेक्शन होता है.
• फ़्रैगमेंट का अपना लाइफ़साइकल होता है और यह अपने इनपुट इवेंट पाता है.
• एक्सएमएल लेआउट फ़ाइल के फ़्रैगमेंट का लेआउट तय करने के लिए, <fragment> टैग का इस्तेमाल करें.
• onCreateView() में फ़्रैगमेंट के लिए लेआउट को इनफ़्लेट करें.
• गतिविधि के दौरान, फ़्रैगमेंट को जोड़ा या हटाया जा सकता है.

Udcity कोर्स:

• Kotlin के साथ Android ऐप्लिकेशन डेवलप करना

Android डेवलपर दस्तावेज़:

• लीनियर लेआउट
• LinearLayout
• फ़्रैगमेंट लाइफ़साइकल
• DataBindingUtil

इस सेक्शन में उन छात्र-छात्राओं के लिए गृहकार्य की असाइनमेंट की सूची दी गई है जो इस कोडलैब के ज़रिए एक शिक्षक की देखरेख में कोर्स में काम कर रहे हैं. यह क्रिएटर का काम #33 पर निर्भर करता है:

• अगर ज़रूरी हो, तो होमवर्क असाइन करें.
• छात्र-छात्राओं को होमवर्क के असाइनमेंट सबमिट करने के तरीके के बारे में बताएं.
• होमवर्क असाइनमेंट को ग्रेड दें.

शिक्षक इन सुझावों का इस्तेमाल जितनी चाहें उतनी कम या ज़्यादा कर सकते हैं. साथ ही, उन्हें अपने हिसाब से कोई भी होमवर्क असाइन करना चाहिए.

अगर आप इस कोडलैब के ज़रिए खुद काम कर रहे हैं, तो बेझिझक इन होमवर्क असाइनमेंट का इस्तेमाल करें.

इन सवालों के जवाब दें

पहला सवाल

फ़्रैगमेंट और गतिविधियों में क्या अंतर हैं? सभी सही जवाब चुनें.

• फ़्रैगमेंट बनाते समय, आप onCreateView() तरीके में लेआउट को इनफ़्लेट करते हैं. कोई गतिविधि बनाते समय, आप onCreate() में लेआउट को इनफ़्लेट करते हैं.
• किसी ऐक्टिविटी का अपना लेआउट होता है, लेकिन फ़्रैगमेंट का अपना लेआउट नहीं हो सकता.
• किसी गतिविधि का अपना लाइफ़साइकल होता है, लेकिन फ़्रैगमेंट #33 नहीं होता.
• किसी फ़्रैगमेंट या गतिविधि के लिए लेआउट को इनफ़्लेट करने पर, आप लेआउट को R.layout.layoutname के तौर पर रेफ़रंस दे सकते हैं.

दूसरा सवाल

फ़्रैगमेंट के बारे में इनमें से कौनसी बातें सही हैं? लागू होने वाले सभी विकल्प चुनें.

• फ़्रैगमेंट का इस्तेमाल एक से ज़्यादा गतिविधियों के लिए किया जा सकता है.
• एक ऐक्टिविटी में एक से ज़्यादा फ़्रैगमेंट हो सकते हैं.
• Kotlin क्लास में फ़्रैगमेंट तय करने के बाद, फ़्रैगमेंट अपने-आप activity_main.xml लेआउट फ़ाइल में जुड़ जाता है.
• फ़्रैगमेंट डालने के लिए, लेआउट फ़ाइल में जगह की जानकारी देने के लिए <fragment> टैग का इस्तेमाल करें.

अगला लेसन शुरू करें: 3.2 नेविगेशन पाथ तय करें

इस कोर्स में दिए गए दूसरे कोडलैब के लिंक के लिए, Android Kotlin की बुनियादी बातें कोडलैब का लैंडिंग पेज देखें.