Compose यूज़र इंटरफ़ेस (यूआई) को डीबग करने के लिए टूल, Android Studio में उपलब्ध हैं.
लेआउट इंस्पेक्टर
लेआउट इंस्पेक्टर की मदद से, एम्युलेटर या फ़िज़िकल डिवाइस में चल रहे ऐप्लिकेशन में Compose लेआउट की जांच की जा सकती है. लेआउट इंस्पेक्टर का इस्तेमाल करके, यह देखा जा सकता है कि कंपोज़ेबल को कितनी बार फिर से कंपोज़ किया गया या स्किप किया गया. इससे आपको अपने ऐप्लिकेशन से जुड़ी समस्याओं का पता लगाने में मदद मिल सकती है. उदाहरण के लिए, कोडिंग की कुछ गड़बड़ियों की वजह से, आपके यूज़र इंटरफ़ेस (यूआई) को बार-बार फिर से कंपोज़ करना पड़ सकता है. इससे परफ़ॉर्मेंस खराब हो सकती है. कोडिंग की कुछ गड़बड़ियां, आपके यूज़र इंटरफ़ेस (यूआई) को फिर से कॉम्पोज़ होने से रोक सकती हैं. इस वजह से, यूज़र इंटरफ़ेस (यूआई) में किए गए बदलाव स्क्रीन पर नहीं दिखते. अगर लेआउट इंस्पेक्टर आपके लिए नया है, तो इसे चलाने के तरीके के बारे में दिशा-निर्देश देखें.
रीकंपोज़िशन की संख्या देखना
Compose लेआउट को डीबग करते समय, यह जानना ज़रूरी है कि कंपोज़ेबल को कब फिर से कंपोज़ किया जाता है. इससे यह समझने में मदद मिलती है कि आपका यूज़र इंटरफ़ेस (यूआई) सही तरीके से लागू किया गया है या नहीं. उदाहरण के लिए, अगर यह बार-बार रीकंपोज़ हो रहा है, तो हो सकता है कि आपका ऐप्लिकेशन ज़रूरत से ज़्यादा काम कर रहा हो. दूसरी ओर, ऐसे कॉम्पोनेंट जो आपकी उम्मीद के मुताबिक फिर से कंपोज़ नहीं होते हैं, वे अनचाहे व्यवहार का कारण बन सकते हैं.
लेआउट इंस्पेक्टर से आपको पता चलता है कि ऐप्लिकेशन के साथ इंटरैक्ट करने पर, लेआउट की हैरारकी में मौजूद अलग-अलग कंपोज़ेबल को फिर से कंपोज़ किया गया है या नहीं. Android Studio में, फिर से कंपोज़ किए गए कंपोज़ेबल हाइलाइट किए जाते हैं. इससे आपको यह पता लगाने में मदद मिलती है कि यूज़र इंटरफ़ेस (यूआई) में आपके कंपोज़ेबल कहां फिर से कंपोज़ किए जा रहे हैं.
पहली इमेज. लेआउट इंस्पेक्टर में, रीकंपोज़िशन को हाइलाइट किया जाता है.
हाइलाइट किया गया हिस्सा, लेआउट इंस्पेक्टर के इमेज सेक्शन में कंपोज़ेबल का ग्रेडिएंट ओवरले दिखाता है. साथ ही, यह धीरे-धीरे गायब हो जाता है, ताकि आपको यह पता चल सके कि यूज़र इंटरफ़ेस (यूआई) में सबसे ज़्यादा रीकंपोज़िशन वाला कंपोज़ेबल कहां मिल सकता है. अगर कोई कंपोज़ेबल, दूसरे कंपोज़ेबल की तुलना में ज़्यादा तेज़ी से फिर से कंपोज़ हो रहा है, तो पहले कंपोज़ेबल को ज़्यादा गहरा ग्रेडिएंट ओवरले रंग मिलता है. अगर लेआउट इंस्पेक्टर में किसी कंपोज़ेबल पर दो बार क्लिक किया जाता है, तो आपको विश्लेषण के लिए उससे जुड़े कोड पर ले जाया जाता है.
लेआउट इंस्पेक्टर विंडो खोलें और अपने ऐप्लिकेशन की प्रोसेस से कनेक्ट करें. कॉम्पोनेंट ट्री में, लेआउट की हैरारकी के बगल में दो कॉलम दिखते हैं. पहले कॉलम में हर नोड के लिए कंपोज़िशन की संख्या दिखती है. वहीं, दूसरे कॉलम में हर नोड के लिए स्किप की संख्या दिखती है. किसी कंपोज़ेबल नोड को चुनने पर, कंपोज़ेबल के डाइमेंशन और पैरामीटर दिखते हैं. हालांकि, अगर वह इनलाइन फ़ंक्शन है, तो पैरामीटर नहीं दिखाए जा सकते. कॉम्पोनेंट ट्री या लेआउट डिसप्ले से कंपोज़ेबल चुनने पर, आपको एट्रिब्यूट पैनल में भी ऐसी ही जानकारी दिख सकती है.
गिनती को रीसेट करने से, आपको अपने ऐप्लिकेशन के साथ किसी खास इंटरैक्शन के दौरान, फिर से कॉम्पोज़ किए गए या स्किप किए गए कॉम्पोनेंट को समझने में मदद मिल सकती है. अगर आपको गिनती को रीसेट करना है, तो कॉम्पोनेंट ट्री पैनल के सबसे ऊपर मौजूद, रीसेट करें पर क्लिक करें.
तीसरी इमेज. लेआउट इंस्पेक्टर में कंपोज़िशन और स्किप काउंटर की सुविधा चालू करें.
Compose सिमैंटिक्स
Compose में, सिमैंटिक आपके यूज़र इंटरफ़ेस (यूआई) के बारे में इस तरह से जानकारी देते हैं कि सुलभता सेवाओं और टेस्टिंग फ़्रेमवर्क को आसानी से समझ आ सके. लेआउट इंस्पेक्टर का इस्तेमाल करके, Compose लेआउट में सिमैंटिक जानकारी की जांच की जा सकती है.
Compose नोड चुनते समय, एट्रिब्यूट पैनल का इस्तेमाल करके देखें कि वह सीधे तौर पर सिमैंटिक जानकारी का एलान करता है या नहीं. इसके अलावा, यह भी देखें कि वह अपने चाइल्ड नोड से सिमैंटिक जानकारी को मर्ज करता है या नहीं. इसके अलावा, यह भी देखें कि वह दोनों काम करता है या नहीं. यह तुरंत पता लगाने के लिए कि किन नोड में सिमैंटिक शामिल हैं, चाहे वे डिक्लेयर किए गए हों या मर्ज किए गए हों, कॉम्पोनेंट ट्री पैनल में व्यू के विकल्प ड्रॉप-डाउन को चुनें. इसके बाद, सिमैंटिक लेयर हाइलाइट करें को चुनें. यह ट्री में सिर्फ़ उन नोड को हाइलाइट करता है जिनमें सिमैंटिक शामिल होते हैं. साथ ही, कीबोर्ड का इस्तेमाल करके उनके बीच तेज़ी से नेविगेट किया जा सकता है.
Compose यूज़र इंटरफ़ेस की जांच करें
Jetpack Compose में ज़्यादा अडैप्टिव और सुलभ यूज़र इंटरफ़ेस (यूआई) बनाने में आपकी मदद करने के लिए, Android Studio में Compose की झलक देखने की सुविधा में यूज़र इंटरफ़ेस (यूआई) की जांच करने वाला मोड उपलब्ध है. यह सुविधा, व्यू के लिए Accessibility Scanner की तरह है.
Compose की झलक पर Compose यूज़र इंटरफ़ेस (यूआई) की जांच करने वाला मोड चालू करने पर, Android Studio आपके Compose यूज़र इंटरफ़ेस (यूआई) की जांच अपने-आप करता है. साथ ही, आपके यूज़र इंटरफ़ेस (यूआई) को ज़्यादा सुलभ और अडैप्टिव बनाने के लिए, सुधार के सुझाव देता है. Android Studio यह जांच करता है कि आपका यूज़र इंटरफ़ेस (यूआई), अलग-अलग साइज़ की स्क्रीन पर काम करता है या नहीं. समस्याएं पैनल में, टूल उन समस्याओं को दिखाता है जिनका पता चलता है. जैसे, बड़ी स्क्रीन पर टेक्स्ट का खिंचना या कम कलर कंट्रास्ट.
इस सुविधा को ऐक्सेस करने के लिए, Compose की झलक पर यूज़र इंटरफ़ेस (यूआई) की जांच करें आइकॉन पर क्लिक करें:
यूज़र इंटरफ़ेस (यूआई) की जांच करने की सुविधा, अलग-अलग कॉन्फ़िगरेशन में आपके यूज़र इंटरफ़ेस (यूआई) की झलक अपने-आप दिखाती है. साथ ही, अलग-अलग कॉन्फ़िगरेशन में मिली समस्याओं को हाइलाइट करती है. समस्याएं पैनल में, किसी समस्या पर क्लिक करने पर, आपको उसकी जानकारी, उसे ठीक करने के सुझाव, और रेंडरिंग दिखती हैं. रेंडरिंग से, समस्या वाले हिस्से को हाइलाइट किया जाता है.
एआई की मदद से ठीक करें
यूज़र इंटरफ़ेस (यूआई) की जांच वाले मोड में मिली समस्याओं के लिए, एआई एजेंट का इस्तेमाल करके कोड में सुधार करने के सुझाव पाए जा सकते हैं और उन्हें लागू किया जा सकता है. समस्याएं पैनल में मौजूद किसी समस्या पर, एआई की मदद से ठीक करें बटन पर क्लिक करें. एजेंट, समस्या और आपके कोड का विश्लेषण करता है, ताकि सुलभता या अडैप्टिव लेआउट से जुड़ी समस्या को हल करने के लिए बदलावों का सुझाव दे सके.
