एज-टू-एज डिसप्ले की सुविधा सेट अप करना

Edge-to-edge डिसप्ले की सुविधा की मदद से, आपका ऐप्लिकेशन अपने यूज़र इंटरफ़ेस (यूआई) को सिस्टम बार के पीछे ड्रॉ कर सकता है. जैसे, स्टेटस बार, कैप्शन बार, और नेविगेशन बार. इससे लोगों को ऐप्लिकेशन इस्तेमाल करने का बेहतर अनुभव मिलता है. अगर आपने Android 15 (एपीआई लेवल 35) या इसके बाद के वर्शन वाले डिवाइसों को टारगेट किया है, तो एज-टू-एज डिसप्ले की सुविधा डिफ़ॉल्ट रूप से लागू होती है.

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

Android से जुड़ी स्किल

GitHub पर देखें

Edge-to-Edge डिसप्ले की सुविधा जोड़ना

अपने Jetpack Compose ऐप्लिकेशन में अडैप्टिव एज-टू-एज सपोर्ट जोड़ने के लिए, Edge-to-Edge Android स्किल का इस्तेमाल करें.

Android सीएलआई से स्किल इंस्टॉल करने के लिए, यह कमांड चलाएं:

android skills add edge-to-edge

1. एज-टू-एज डिसप्ले की सेटिंग चालू करें

Android के पिछले वर्शन पर एज-टू-एज सुविधा चालू करने के लिए, अपने Activity.onCreate() तरीके में enableEdgeToEdge() को कॉल करें:

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    enableEdgeToEdge()
    // ...
}
EdgeToEdgeSnippets.kt

डिफ़ॉल्ट रूप से, enableEdgeToEdge() सिस्टम बार को पारदर्शी बनाता है. हालांकि, तीन बटन वाले नेविगेशन मोड में, यह नेविगेशन बार पर हल्का पारदर्शी स्क्रिम लागू करता है, ताकि कंट्रास्ट बेहतर हो. सिस्टम आइकॉन और स्क्रिम का रंग, सिस्टम की लाइट या डार्क थीम के हिसाब से बदलता है.

2. windowSoftInputMode को कॉन्फ़िगर करना

अपनी गतिविधि की AndroidManifest.xml एंट्री में android:windowSoftInputMode="adjustResize" सेट करें. इस सेटिंग की मदद से, आपका ऐप्लिकेशन आईएमई इनसेट पा सकता है. इससे, ऑन-स्‍क्रीन कीबोर्ड दिखने या गायब होने पर, पैडिंग के साथ लेआउट को अडजस्ट किया जा सकता है.

<!-- In your AndroidManifest.xml file: -->
<activity
  android:name=".ui.MainActivity"
  android:label="@string/app_name"
  android:windowSoftInputMode="adjustResize"
  android:theme="@style/Theme.MyApplication"
  android:exported="true">
  ...
</activity>

3. इनसेट का इस्तेमाल करके ओवरलैप मैनेज करना

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

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

• सिस्टम बार इंसर्ट: ये ऐसे एरिया होते हैं जहां सिस्टम बार दिखते हैं. इनका इस्तेमाल करके, यूज़र इंटरफ़ेस (यूआई) को सिस्टम बार से छिपाने से बचें.
• डिसप्ले कटआउट इंसर्ट: ये ऐसे एरिया होते हैं जहां डिवाइस की स्क्रीन पर फ़िज़िकल कटआउट (जैसे, कैमरा नॉच) मौजूद होता है.

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

ऐडवांस विषय

एज-टू-एज डिसप्ले की सुविधा को बेहतर तरीके से इस्तेमाल करने के लिए, यहां दी गई जानकारी देखें.

इमर्सिव मोड

कुछ कॉन्टेंट, जैसे कि वीडियो या मैप को फ़ुल इमर्सिव मोड में देखने से बेहतर अनुभव मिलता है. इस मोड में सिस्टम बार छिपे होते हैं. सिस्टम बार को इन तरीकों से छिपाया जा सकता है WindowInsetsControllerCompat:

val windowInsetsController = WindowCompat.getInsetsController(window, window.decorView)

// Hide the system bars.
windowInsetsController.hide(WindowInsetsCompat.Type.systemBars())

// Show the system bars.
windowInsetsController.show(WindowInsetsCompat.Type.systemBars())
EdgeToEdgeSnippets.kt

ध्यान दें: डेस्कटॉप विंडोइंग मोड में चल रहे सभी ऐप्लिकेशन में कैप्शन बार होता है. इमर्सिव मोड में भी यह बार दिखता है. गेम और अन्य इमर्सिव ऐप्लिकेशन के लिए, इसका मतलब है कि आपको WindowInsets.systemBars (इसमें कैप्शन बार शामिल है) या WindowInsets.captionBar का इस्तेमाल करना होगा, ताकि यह पक्का किया जा सके कि आपका यूज़र इंटरफ़ेस (यूआई) सिस्टम बार से ढका न हो.

सिस्टम बार के रंग और आइकॉन

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

स्टेटस बार के आइकॉन को हल्के या गहरे रंग में बदलने के लिए, WindowInsetsControllerCompat का इस्तेमाल करें:

// Set status bar icons to dark.
WindowCompat.getInsetsController(window, window.decorView)
    .isAppearanceLightStatusBars = true

// Set status bar icons to light.
WindowCompat.getInsetsController(window, window.decorView)
    .isAppearanceLightStatusBars = false
EdgeToEdgeSnippets.kt

सिस्टम बार की सुरक्षा

enableEdgeToEdge() में डिफ़ॉल्ट रूप से पारदर्शी या हल्के रंग वाले सिस्टम बार दिए जाते हैं. हालांकि, आपको इन्हें अपनी पसंद के मुताबिक बनाना पड़ सकता है. Android सिस्टम बार के डिज़ाइन से जुड़े दिशा-निर्देश और एंड-टू-एंड डिज़ाइन से जुड़े दिशा-निर्देश पढ़ें. इससे आपको यह तय करने में मदद मिलेगी कि पारदर्शी बार का इस्तेमाल कब करना है और हल्के पारदर्शी बार का इस्तेमाल कब करना है.

तीन बटन वाले नेविगेशन बार को हल्का पारदर्शी बनाने के बजाय पूरी तरह से पारदर्शी बनाने के लिए, कंट्रास्ट लागू करने की सुविधा बंद की जा सकती है:

window.isNavigationBarContrastEnforced = false
EdgeToEdgeSnippets.kt

ज़्यादा जानकारी के लिए, सिस्टम बार की सुरक्षा के बारे में जानकारी लेख पढ़ें.