नेविगेशन एडिटर

Android Studio में एक जीयूआई होता है. इसकी मदद से, नेविगेशन ग्राफ़ बनाया और उसमें बदलाव किया जा सकता है. यह असल में, एक्सएमएल रिसॉर्स फ़ाइल के लिए एक एडिटर है.

खास जानकारी

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

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

इससे जुड़ा एक्सएमएल देखने के लिए, टेक्स्ट टैब पर क्लिक करें. यह एक्सएमएल, यहां दिए गए स्निपेट जैसा दिखना चाहिए:

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/nav_graph">

</navigation>

<navigation> एलिमेंट, नेविगेशन ग्राफ़ का रूट एलिमेंट होता है. ग्राफ़ में डेस्टिनेशन और उन्हें कनेक्ट करने वाले ऐक्शन जोड़ने पर, यहां चाइल्ड एलिमेंट के तौर पर, उनसे जुड़े <destination> और <action> एलिमेंट दिखते हैं. अगर आपके पास नेस्ट किए गए ग्राफ़ हैं, तो वे चाइल्ड <navigation> एलिमेंट के तौर पर दिखते हैं.

डेस्टिनेशन जोड़ना

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

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

1. नेविगेशन एडिटर में, नया डेस्टिनेशन आइकॉन पर क्लिक करें. इसके बाद, नया डेस्टिनेशन बनाएं पर क्लिक करें.
2. दिखने वाले नया Android कॉम्पोनेंट डायलॉग में, अपना फ़्रैगमेंट बनाएं. फ़्रैगमेंट के बारे में ज़्यादा जानने के लिए, फ़्रैगमेंट की खास जानकारी देखें.

नेविगेशन एडिटर में वापस आने पर, ध्यान दें कि Android Studio ने इस डेस्टिनेशन को ग्राफ़ में जोड़ दिया है.

दूसरी इमेज में, डेस्टिनेशन और एक प्लेसहोल्डर डेस्टिनेशन का उदाहरण दिखाया गया है.

अपने नेविगेशन ग्राफ़ में डेस्टिनेशन जोड़ने के अन्य तरीके जानने के लिए, अन्य डेस्टिनेशन देखें.

किसी मौजूदा फ़्रैगमेंट या ऐक्टिविटी से डेस्टिनेशन बनाना

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

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

नया फ़्रैगमेंट डेस्टिनेशन बनाना

नेविगेशन एडिटर का इस्तेमाल करके, नया डेस्टिनेशन टाइप जोड़ने के लिए, यह तरीका अपनाएं:

1. नेविगेशन एडिटर में, नया डेस्टिनेशन आइकॉन पर क्लिक करें.

   इसके बाद, नया डेस्टिनेशन बनाएं पर क्लिक करें.

2. दिखने वाले नया Android कॉम्पोनेंट डायलॉग में, अपना फ़्रैगमेंट बनाएं.

नेविगेशन एडिटर में वापस आने पर, ध्यान दें कि Android Studio ने इस डेस्टिनेशन को ग्राफ़ में जोड़ दिया है.

तीसरी इमेज में, डेस्टिनेशन और प्लेसहोल्डर डेस्टिनेशन का उदाहरण दिखाया गया है.

डेस्टिनेशन की संरचना

किसी डेस्टिनेशन को चुनने के लिए उस पर क्लिक करें. इसके बाद, एट्रिब्यूट पैनल में ये एट्रिब्यूट देखें:

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

अपने नेविगेशन ग्राफ़ का एक्सएमएल व्यू दिखाने के लिए, टेक्स्ट टैब पर क्लिक करें. एक्सएमएल में, डेस्टिनेशन के लिए वही id, name, label, और layout एट्रिब्यूट होते हैं जो यहां दिए गए स्निपेट में हैं:

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    app:startDestination="@id/blankFragment">
    <fragment
        android:id="@+id/blankFragment"
        android:name="com.example.cashdog.cashdog.BlankFragment"
        android:label="@string/label_blank"
        tools:layout="@layout/fragment_blank" />
</navigation>

NavHostFragment

किसी ऐक्टिविटी में NavHostFragment जोड़ने के लिए, लेआउट एडिटर का भी इस्तेमाल किया जा सकता है. इसके लिए, यह तरीका अपनाएं:

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

डेस्टिनेशन कनेक्ट करना

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

ऐक्शन की मदद से, उन अलग-अलग पाथ को दिखाया जाता है जिनकी मदद से उपयोगकर्ता आपके ऐप्लिकेशन में नेविगेट कर सकते हैं. ध्यान दें कि डेस्टिनेशन पर नेविगेट करने के लिए, आपको नेविगेशन करने का कोड लिखना होगा.

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

1. डिज़ाइन टैब में, उस डेस्टिनेशन के दाईं ओर पॉइंटर को होल्ड करें जिससे उपयोगकर्ता नेविगेट करना चाहते हैं. डेस्टिनेशन की दाईं ओर एक सर्कल दिखता है, जैसा कि चौथी इमेज में दिखाया गया है.

   

2. कर्सर को उस डेस्टिनेशन पर खींचें और छोड़ें जिस पर उपयोगकर्ता नेविगेट करना चाहते हैं. दोनों डेस्टिनेशन के बीच दिखने वाली लाइन, ऐक्शन को दिखाती है. जैसा कि पांचवीं इमेज में दिखाया गया है.

   

3. ऐक्शन को हाइलाइट करने के लिए, ऐरो पर क्लिक करें. एट्रिब्यूट पैनल में ये एट्रिब्यूट दिखते हैं:

   • टाइप फ़ील्ड में "ऐक्शन" होता है.
   • आईडी फ़ील्ड में, ऐक्शन का आईडी होता है.
   • डेस्टिनेशन फ़ील्ड में, डेस्टिनेशन फ़्रैगमेंट या ऐक्टिविटी का आईडी होता है.

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

   xml <?xml version="1.0" encoding="utf-8"?> <navigation xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" app:startDestination="@id/blankFragment"> <fragment android:id="@+id/blankFragment" android:name="com.example.cashdog.cashdog.BlankFragment" android:label="@string/label_blank" tools:layout="@layout/fragment_blank" > <action android:id="@+id/action_blankFragment_to_blankFragment2" app:destination="@id/blankFragment2" /> </fragment> <fragment android:id="@+id/blankFragment2" android:name="com.example.cashdog.cashdog.BlankFragment2" android:label="@string/label_blank_2" tools:layout="@layout/fragment_blank_fragment2" /> </navigation>

आपके नेविगेशन ग्राफ़ में, ऐक्शन को <action> एलिमेंट के तौर पर दिखाया जाता है. किसी ऐक्शन में कम से कम उसका आईडी और उस डेस्टिनेशन का आईडी होता है जिस पर उपयोगकर्ता को ले जाना चाहिए.

प्लेसहोल्डर डेस्टिनेशन

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