Android प्लैटफ़ॉर्म, सिस्टम यूज़र इंटरफ़ेस (यूआई) को ड्रॉ करने के लिए ज़िम्मेदार होता है. जैसे, स्टेटस बार और नेविगेशन बार. यह सिस्टम यूआई तब भी दिखता है, जब उपयोगकर्ता किसी ऐप्लिकेशन का इस्तेमाल कर रहा हो.
WindowInsets, सिस्टम यूज़र इंटरफ़ेस (यूआई) के बारे में जानकारी देता है. इससे यह पक्का किया जा सकता है कि आपका ऐप्लिकेशन सही जगह पर दिखे और सिस्टम यूज़र इंटरफ़ेस (यूआई) की वजह से आपका यूज़र इंटरफ़ेस (यूआई) छिप न जाए.
Android 14 (एपीआई लेवल 34) और इससे पहले के वर्शन पर, आपके ऐप्लिकेशन का यूज़र इंटरफ़ेस (यूआई) डिफ़ॉल्ट रूप से सिस्टम बार और डिसप्ले कटआउट के नीचे नहीं दिखता.
Android 15 (एपीआई लेवल 35) और इसके बाद के वर्शन पर, आपका ऐप्लिकेशन एसडीके 35 को टारगेट करने के बाद, सिस्टम बार और डिसप्ले कटआउट के नीचे दिखता है. इससे उपयोगकर्ताओं को बेहतर अनुभव मिलता है. साथ ही, आपका ऐप्लिकेशन उपलब्ध विंडो स्पेस का पूरा फ़ायदा ले पाता है.
सिस्टम यूआई के पीछे कॉन्टेंट दिखाने को एज-टू-एज जाना कहा जाता है. इस पेज पर, अलग-अलग तरह के इनसेट के बारे में बताया गया है. साथ ही, ऐप्लिकेशन को एज-टू-एज मोड में चलाने और इनसेट एपीआई इस्तेमाल करने का तरीका बताया गया है. इनसेट एपीआई की मदद से, यूज़र इंटरफ़ेस (यूआई) को ऐनिमेट किया जा सकता है. इससे यह पक्का किया जा सकता है कि आपके ऐप्लिकेशन का कॉन्टेंट, सिस्टम के यूज़र इंटरफ़ेस (यूआई) एलिमेंट से न छिपे.
इनसेट से जुड़ी बुनियादी बातें
जब कोई ऐप्लिकेशन एज-टू-एज मोड में जाता है, तो आपको यह पक्का करना होगा कि ज़रूरी कॉन्टेंट और इंटरैक्शन, सिस्टम यूआई से छिप न जाएं. उदाहरण के लिए, अगर कोई बटन नेविगेशन बार के पीछे मौजूद है, तो हो सकता है कि उपयोगकर्ता उस पर क्लिक न कर पाए.
सिस्टम यूज़र इंटरफ़ेस (यूआई) के साइज़ और उसकी जगह की जानकारी, इनसेट का इस्तेमाल करके दी जाती है.
सिस्टम यूज़र इंटरफ़ेस (यूआई) के हर हिस्से में, इनसेट का एक टाइप होता है. इससे उसके साइज़ और जगह की जानकारी मिलती है. उदाहरण के लिए, स्टेटस बार के इनसेट, स्टेटस बार का साइज़ और पोज़िशन बताते हैं. वहीं, नेविगेशन बार के इनसेट, नेविगेशन बार का साइज़ और पोज़िशन बताते हैं. हर तरह के इनसेट में चार पिक्सल डाइमेंशन होते हैं: सबसे ऊपर, बाईं ओर, दाईं ओर, और सबसे नीचे. इन डाइमेंशन से पता चलता है कि सिस्टम यूज़र इंटरफ़ेस (यूआई), ऐप्लिकेशन की विंडो के किनारों से कितनी दूर तक फैला हुआ है. इस तरह के सिस्टम यूज़र इंटरफ़ेस (यूआई) के साथ ओवरलैप होने से बचने के लिए, ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) को उसी हिसाब से इनसेट किया जाना चाहिए.
Android के ये इनसेट टाइप, WindowInsets की मदद से उपलब्ध हैं:
स्टेटस बार के बारे में जानकारी देने वाले इनसेट. ये सबसे ऊपर मौजूद सिस्टम यूज़र इंटरफ़ेस (यूआई) बार होते हैं. इनमें सूचना आइकॉन और अन्य इंडिकेटर होते हैं. |
|
स्टेटस बार दिखने पर, उसके इनसेट. अगर स्टेटस बार छिपे हुए हैं (इमर्सिव फ़ुल स्क्रीन मोड में जाने की वजह से), तो मुख्य स्टेटस बार के इनसेट खाली होंगे. हालांकि, ये इनसेट खाली नहीं होंगे. |
|
नेविगेशन बार के बारे में जानकारी देने वाले इनसेट. ये डिवाइस के बाईं, दाईं या सबसे नीचे मौजूद सिस्टम यूज़र इंटरफ़ेस (यूआई) बार होते हैं. इनमें टास्कबार या नेविगेशन आइकॉन की जानकारी होती है. ये रनटाइम के दौरान बदल सकते हैं. यह उपयोगकर्ता के पसंदीदा नेविगेशन तरीके और टास्कबार के साथ इंटरैक्ट करने के तरीके पर निर्भर करता है. |
|
नेविगेशन बार के दिखने पर, उसके इनसेट. अगर नेविगेशन बार छिपे हुए हैं (इमर्सिव फ़ुल स्क्रीन मोड में जाने की वजह से), तो मुख्य नेविगेशन बार के इनसेट खाली होंगे. हालांकि, ये इनसेट खाली नहीं होंगे. |
|
अगर सिस्टम यूआई विंडो को फ़्रीफ़ॉर्म विंडो में सजाया गया है, तो इनसेट में इसकी जानकारी दी जाती है. जैसे, सबसे ऊपर मौजूद टाइटल बार. |
|
कैप्शन दिखने पर, कैप्शन बार के इनसेट. अगर कैप्शन बार छिपे हुए हैं, तो मुख्य कैप्शन बार के इनसेट खाली होंगे. हालांकि, ये इनसेट खाली नहीं होंगे. |
|
सिस्टम बार के इनसेट का यूनियन, जिसमें स्टेटस बार, नेविगेशन बार, और कैप्शन बार शामिल हैं. |
|
सिस्टम बार के दिखने पर, उसके इनसेट. अगर सिस्टम बार छिपे हुए हैं (इमर्सिव फ़ुल स्क्रीन मोड में जाने की वजह से), तो मुख्य सिस्टम बार के इनसेट खाली होंगे. हालांकि, ये इनसेट खाली नहीं होंगे. |
|
इनसेट, सॉफ़्टवेयर कीबोर्ड से स्क्रीन के निचले हिस्से में इस्तेमाल की जाने वाली जगह की जानकारी देते हैं. |
|
इनसेट से पता चलता है कि मौजूदा कीबोर्ड ऐनिमेशन से पहले, सॉफ़्टवेयर कीबोर्ड ने कितनी जगह ली थी. |
|
इनसेट से पता चलता है कि मौजूदा कीबोर्ड ऐनिमेशन के बाद, सॉफ़्टवेयर कीबोर्ड कितनी जगह लेगा. |
|
यह एक तरह का इनसेट है, जो नेविगेशन यूज़र इंटरफ़ेस (यूआई) के बारे में ज़्यादा जानकारी देता है. इससे यह पता चलता है कि "टैप" को सिस्टम मैनेज करेगा, न कि ऐप्लिकेशन. जेस्चर वाले नेविगेशन के साथ पारदर्शी नेविगेशन बार के लिए, ऐप्लिकेशन के कुछ एलिमेंट को सिस्टम नेविगेशन यूज़र इंटरफ़ेस (यूआई) के ज़रिए टैप किया जा सकता है. |
|
टैप किए जा सकने वाले एलिमेंट के इनसेट, जो उनके दिखने पर लागू होते हैं. अगर टैप किए जा सकने वाले एलिमेंट छिपे हुए हैं (इमर्सिव फ़ुल स्क्रीन मोड में जाने की वजह से), तो टैप किए जा सकने वाले मुख्य एलिमेंट के इनसेट खाली होंगे. हालांकि, ये इनसेट खाली नहीं होंगे. |
|
इनसेट की संख्या दिखाने वाले इनसेट, जहां सिस्टम नेविगेशन के लिए जेस्चर को इंटरसेप्ट करेगा. ऐप्लिकेशन, |
|
सिस्टम जेस्चर का एक सबसेट, जिसे सिस्टम हमेशा मैनेज करेगा. साथ ही, |
|
इनसेट, डिसप्ले कटआउट (नॉच या पिनहोल) के साथ ओवरलैप होने से बचने के लिए ज़रूरी स्पेस की जानकारी देते हैं. |
|
वॉटरफ़ॉल डिसप्ले के कर्व वाले हिस्सों को दिखाने वाले इनसेट. वॉटरफ़ॉल डिसप्ले में, स्क्रीन के किनारों पर घुमावदार हिस्से होते हैं. ये हिस्से, डिवाइस के किनारों पर स्क्रीन को रैप करते हैं. |
इन टाइप को तीन "सुरक्षित" इनसेट टाइप में बांटा गया है. इनसे यह पक्का किया जाता है कि कॉन्टेंट साफ़ तौर पर दिखे:
ये "सुरक्षित" इनसेट टाइप, कॉन्टेंट को अलग-अलग तरीकों से सुरक्षित रखते हैं. यह इस बात पर निर्भर करता है कि मौजूदा प्लैटफ़ॉर्म के इनसेट क्या हैं:
WindowInsets.safeDrawingका इस्तेमाल करके, उस कॉन्टेंट को सुरक्षित करें जिसे किसी सिस्टम यूज़र इंटरफ़ेस (यूआई) के नीचे नहीं दिखाया जाना चाहिए. इनसेट का सबसे आम इस्तेमाल यह है: सिस्टम यूज़र इंटरफ़ेस (यूआई) से छिपने वाले कॉन्टेंट को ड्रॉ होने से रोकना (चाहे वह पूरी तरह से छिपा हो या कुछ हद तक).- हाथ के जेस्चर से कॉन्टेंट को सुरक्षित रखने के लिए,
WindowInsets.safeGesturesका इस्तेमाल करें. इससे सिस्टम जेस्चर, ऐप्लिकेशन के जेस्चर से नहीं टकराते. जैसे, बॉटम शीट, कैरसेल या गेम के लिए जेस्चर. WindowInsets.safeContentकोWindowInsets.safeDrawingऔरWindowInsets.safeGesturesके कॉम्बिनेशन के तौर पर इस्तेमाल करें. इससे यह पक्का किया जा सकेगा कि कॉन्टेंट में कोई विज़ुअल ओवरलैप और जेस्चर ओवरलैप न हो.
आपके लिए सुझाव
- ध्यान दें: JavaScript बंद होने पर, लिंक टेक्स्ट दिखता है
- मटीरियल कॉम्पोनेंट और लेआउट
CoordinatorLayoutको Compose पर माइग्रेट करना- ध्यान देने वाली अन्य बातें