एज-टू-एज डिसप्ले की सुविधा की मदद से, आपका ऐप्लिकेशन सिस्टम बार—स्टेटस बार, कैप्शन बार, और नेविगेशन बार—के पीछे अपना यूज़र इंटरफ़ेस (यूआई) बना सकता है. इससे लोगों को ऐप्लिकेशन इस्तेमाल करने का बेहतर अनुभव मिलता है. अगर आपने Android 15 (एपीआई लेवल 35) या इसके बाद के वर्शन वाले डिवाइसों को टारगेट किया है, तो एज-टू-एज डिसप्ले डिफ़ॉल्ट रूप से लागू होता है.
Android के सभी वर्शन पर, कॉन्टेंट को एज-टू-एज सही तरीके से दिखाने के लिए, सेटअप करने का यह तरीका अपनाएं. इन चरणों को पूरा किए बिना, हो सकता है कि आपका ऐप्लिकेशन सिस्टम बार के पीछे सॉलिड रंग दिखाए या स्क्रीन पर मौजूद कीबोर्ड (आईएमई) ट्रांज़िशन के साथ, अपने कॉन्टेंट को एक साथ ऐनिमेट न करे.
1. एज-टू-एज डिसप्ले की सेटिंग चालू करें
Android के पिछले वर्शन पर एज-टू-एज सुविधा चालू करने के लिए, अपने Activity.onCreate() तरीके में enableEdgeToEdge() को कॉल करें:
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
...
}
डिफ़ॉल्ट रूप से, enableEdgeToEdge() सिस्टम बार को पारदर्शी बनाता है. हालांकि, तीन बटन वाले नेविगेशन मोड में, यह नेविगेशन बार पर हल्का पारदर्शी स्क्रिम लागू करता है, ताकि कंट्रास्ट बेहतर हो. सिस्टम आइकॉन और स्क्रिम का रंग, सिस्टम की लाइट या डार्क थीम के हिसाब से बदलता है.
2. windowSoftInputMode को कॉन्फ़िगर करना
अपनी गतिविधि की AndroidManifest.xml एंट्री में android:windowSoftInputMode="adjustResize" सेट करें. इस सेटिंग की मदद से, आपका ऐप्लिकेशन IME इनसेट पा सकता है. इससे, स्क्रीन पर कीबोर्ड दिखने या गायब होने पर, पैडिंग के साथ लेआउट को अडजस्ट किया जा सकता है.
<!-- 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) }
}
...
}