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

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

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

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

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

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

डिफ़ॉल्ट रूप से, 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()) For example, use either `Scaffold`,

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

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

स्टेटस बार के आइकॉन को हल्के या गहरे रंग में बदलने के लिए, 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

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

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

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

window.isNavigationBarContrastEnforced = false

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

डायलॉग

डायलॉग को एज-टू-एज फ़ुल-स्क्रीन पर दिखाने के लिए, डायलॉग के onStart() तरीके में WindowCompat.enableEdgeToEdge को कॉल करें:

class MyAlertDialogFragment : DialogFragment() {
    override fun onStart(){
        super.onStart()
        dialog?.window?.let { WindowCompat.enableEdgeToEdge(it) }
    }
    ...
}