Compose में कटआउट की सुविधा

डिसप्ले का कटा हुआ हिस्सा, कुछ डिवाइसों पर डिसप्ले के हिस्से में होता है. इससे डिवाइस के सामने वाले हिस्से पर, एज-टू-एज डिसप्ले का अनुभव मिलता है. साथ ही, ज़रूरी सेंसर के लिए भी जगह मिलती है.

पहली इमेज. पोर्ट्रेट मोड में कटआउट का उदाहरण

दूसरी इमेज. लैंडस्केप मोड में काट-छांट करने का उदाहरण

Android, डिसप्ले में मौजूद कटिंग आउट की सुविधा के साथ काम करता है. यह सुविधा, Android 9 (एपीआई लेवल 28) और इसके बाद के वर्शन वाले डिवाइसों पर काम करती है. हालांकि, डिवाइस बनाने वाली कंपनियां भी, डिसप्ले कटआउट की सुविधा Android 8.1 या इससे पहले के वर्शन वाले डिवाइसों पर.

इस पेज में बताया गया है कि लिखें, जिसमें कटआउट एरिया— यानी एक से दूसरे किनारे तक पहुंचने पर भी काम करने का तरीका शामिल है डिसप्ले सरफ़ेस पर रेक्टैंगल, जिसमें कटआउट मौजूद है.

डिफ़ॉल्ट केस

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

उदाहरण के लिए, अगर आपने हाल ही में Modifier.windowInsetsPadding(WindowInsets.safeContent) या Modifier.windowInsetsPadding(WindowInsets.safeDrawing), आपका ऐप्लिकेशन जो कटआउट वाले हिस्से में अपने-आप नहीं बनेंगे. WindowInsets.safeContent और WindowInsets.safeDrawing दोनों में डिसप्ले कटआउट की जानकारी होती है. साथ ही, डिवाइस कटआउट की जगह नहीं ड्रॉ होगी है.

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

    WindowCompat.setDecorFitsSystemWindows(window, false)

    setContent {
        Box(Modifier.windowInsetsPadding(WindowInsets.safeContent)) {
            // Any composable inside here will avoid drawing behind cutouts
        }
    }
}
CutoutSnippets.kt

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

कटआउट की जानकारी को मैन्युअल तरीके से मैनेज करना

कटआउट को इनमें से किसी भी तरीके से हैंडल किया जा सकता है:

• WindowInsets.displayCutout का इस्तेमाल किया जा रहा है

• android:windowLayoutInDisplayCutoutMode के साथ थीम मेनिफ़ेस्ट में सेटिंग

• window.attributes.layoutInDisplayCutoutMode के साथ Window पर विकल्प को प्रोग्रैम्ड तरीके से सेट करना

• LocalView.current.rootWindowInsets.displayCutout का इस्तेमाल करके, काटा गया Path ऑब्जेक्ट ऐक्सेस करना

लिखने के लिए, windowLayoutInDisplayCutoutMode को इस पर सेट करने का सुझाव दिया जाता है अपनी कुल थीम में default डालें. इसके बाद, WindowInsets.displayCutout का फ़ायदा पाएं अपने कंपोज़ेबल में इनसेट को मैनेज करने के लिए:

Canvas(modifier = Modifier.fillMaxSize().windowInsetsPadding(WindowInsets.displayCutout)) {
    drawRect(Color.Red, style = Stroke(2.dp.toPx()))
}
CutoutSnippets.kt

इस तरीके से, ज़रूरत पड़ने पर displayCutout पैडिंग का इस्तेमाल किया जा सकता है या ज़रूरत न होने पर इसे अनदेखा किया जा सकता है.

इसके अलावा, वही सेटिंग लागू की जा सकती है जो व्यू कटआउट के लिए दिखती है दस्तावेज़ सेटिंग के हिसाब से बताता है गतिविधि वाली थीम android:windowLayoutInDisplayCutoutMode को विकल्प या विंडो एट्रिब्यूट को सेट करने का तरीका window.attributes.layoutInDisplayCutoutMode = LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT. हालांकि, इसके बाद कटआउट मोड पूरी गतिविधि पर लागू हो जाता है. साथ ही, हर कॉम्पोज़ेबल के हिसाब से इसे कंट्रोल नहीं किया जा सकता.

कुछ कंपोज़ेबल में डिसप्ले कटआउट के हिसाब से बदलाव करें. हालांकि, अन्य कंपोज़ेबल में ऐसा न करें. इसके लिए, WindowInset.displayCutout. इस एपीआई की मदद से, कटआउट को ऐक्सेस किया जा सकता है जानकारी दें.

सबसे सही तरीके

डिसप्ले कटआउट के साथ काम करते समय, इन बातों का ध्यान रखें:

• यूज़र इंटरफ़ेस (यूआई) के अहम एलिमेंट के प्लेसमेंट को ध्यान में रखें. काट-छांट की गई जगह पर, कोई भी अहम टेक्स्ट, कंट्रोल या अन्य जानकारी न छिपाएं.
• कटआउट वाले हिस्से में ऐसे इंटरैक्टिव एलिमेंट न रखें या न बढ़ाएं जिनके लिए फ़ाइन-टच की पहचान की ज़रूरत होती है. हो सकता है कि काट-छांट वाले हिस्से में टच सेंसिटिविटी कम हो.
• किनारे से किनारे तक के निर्देशों का पालन करते समय, कटआउट की जानकारी safeDrawing / safeContent इनसेट में शामिल की जाती है.
• जहां भी हो सके, Modifier.windowInsetsPadding(WindowInsets.safeDrawing) का इस्तेमाल करें ताकि आपके कॉन्टेंट पर लागू करने के लिए सही पैडिंग (जगह) तय की जा सके. बंद करें स्टेटस बार की ऊंचाई की हार्डकोडिंग न करें, क्योंकि इससे ओवरलैप या कट-ऑफ़ हो सकता है कॉन्टेंट.

यह जांचना कि आपका कॉन्टेंट, कटआउट के साथ कैसे रेंडर होता है

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

1. डेवलपर के लिए सेटिंग और टूल चालू करें.
2. डेवलपर के लिए सेटिंग और टूल की स्क्रीन पर, नीचे की ओर स्क्रोल करके ड्रॉइंग सेक्शन पर जाएं और कटआउट वाले डिसप्ले को सिम्युलेट करें को चुनें.
3. काट-छांट का टाइप चुनें.

   

   तीसरी इमेज. डेवलपर के विकल्प का इस्तेमाल करके, यह जांचें कि आपका कॉन्टेंट कैसे रेंडर होता है.