Window Size Class — यह क्या है, आकार वर्ग और विकास

Window Size Class क्या है?

Window Size Class एक Android प्लेटफ़ॉर्म API है जो Jetpack WindowManager लाइब्रेरी में शामिल है और एप्लिकेशन विंडो के उपलब्ध स्थान को तीन श्रेणियों में वर्गीकृत करता है। संसाधन क्वालिफ़ायर (small/large/xlarge) के पारंपरिक दृष्टिकोण के विपरीत, Window Size Class मानों का एक अलग सेट प्रदान करता है जिस पर डेवलपर इंटरफ़ेस डिज़ाइन करते समय भरोसा कर सकता है।

API Android 7.0 Nougat में मल्टी-विंडो मोड समर्थन के भाग के रूप में दिखाई दिया, लेकिन सक्रिय रूप से अपनाना Jetpack WindowManager 1.1 (2022) के साथ शुरू हुआ। Google Display.getSize() के माध्यम से स्क्रीन चौड़ाई की जाँच करने के बजाय अनुकूली लेआउट बनाने के लिए Window Size Class को मुख्य उपकरण के रूप में अनुशंसित करता है।

वर्गीकरण dp में विंडो की चौड़ाई पर आधारित है, न कि भौतिक आकार या पिक्सेल घनत्व पर। इसका मतलब है कि अलग-अलग रिज़ॉल्यूशन लेकिन dp में समान चौड़ाई वाले दो डिवाइसों को एक ही वर्ग मिलेगा — इंटरफ़ेस पूर्वानुमानित रूप से समान होगा।

Android के तीन विंडो आकार वर्ग

Compact — 600 dp तक चौड़ी विंडो के लिए वर्ग। पोर्ट्रेट मोड में फ़ोन, मुड़ी हुई अवस्था में अधिकांश फोल्डेबल (Galaxy Z Flip)। इंटरफ़ेस एक कॉलम में बनाया गया है, Bottom Navigation के माध्यम से नेविगेशन।

Medium — 600–840 dp चौड़ी विंडो के लिए वर्ग। पोर्ट्रेट में टैबलेट, लैंडस्केप में फ़ोन, आधी खुली अवस्था में फोल्डेबल डिवाइस। इंटरफ़ेस दो कॉलम का उपयोग करता है — उदाहरण के लिए, बाईं ओर सूची और दाईं ओर विवरण। Navigation Rail Bottom Navigation को बदल देता है।

Expanded — 840 dp से चौड़ी विंडो के लिए वर्ग। लैंडस्केप में टैबलेट, डेस्कटॉप विंडो, खुली हुई अवस्था में फोल्डेबल डिवाइस। इंटरफ़ेस तीन या अधिक पैनल, Permanent Navigation Drawer, टूल पैनल का उपयोग कर सकता है।

Material Design 3 में प्रत्येक वर्ग के लिए अनुकूली घटक परिभाषित किए गए हैं: Medium के लिए Navigation Rail, Expanded के लिए Navigation Drawer, Compact के लिए Bottom Navigation। डेवलपर को breakpoints चुनने की आवश्यकता नहीं है — वे पहले से ही API द्वारा परिभाषित हैं।

Window Size Class कैसे काम करता है

Window Size Class की गणना dp में एप्लिकेशन विंडो की वर्तमान चौड़ाई के आधार पर की जाती है, जिसमें सिस्टम तत्वों — स्टेटस बार, नेविगेशन बार, Split Screen में स्क्रीन विभाजन — को ध्यान में रखा जाता है। API विंडो कॉन्फ़िगरेशन बदलने पर ट्रिगर होता है: डिवाइस रोटेशन, मल्टी-विंडो मोड में प्रवेश, फोल्डेबल डिवाइस को खोलना।

वर्ग प्राप्त करने के लिए androidx.window लाइब्रेरी से WindowSizeClass क्लास का उपयोग किया जाता है। डेवलपर एक Flow (Kotlin) या LiveData (Java) की सदस्यता लेता है जो विंडो आकार में प्रत्येक परिवर्तन पर स्वचालित रूप से वर्ग को अपडेट करता है — बिना मैन्युअल onConfigurationChanged हैंडलिंग के।

वर्गीकरण तीन चरणों में होता है। पहला — पिक्सेल में वर्तमान विंडो चौड़ाई को मापना। दूसरा — DisplayMetrics.density के माध्यम से dp में रूपांतरण। तीसरा — प्राप्त मान की तुलना सीमाओं से करना: 600 dp से कम — Compact, 600–840 — Medium, 840 से — Expanded।

val windowSizeClass = currentWindowAdaptiveInfo().windowSizeClass()

when (windowSizeClass.windowWidthSizeClass) {
    WindowWidthSizeClass.COMPACT -> // compact width
    WindowWidthSizeClass.MEDIUM  -> // medium width
    WindowWidthSizeClass.EXPANDED -> // expanded width
}

चौड़ाई (windowWidthSizeClass) के अलावा, API विंडो ऊंचाई (windowHeightSizeClass) के लिए एक वर्ग प्रदान करता है — लैंडस्केप ओरिएंटेशन और डेस्कटॉप विंडो के लिए उपयोगी।

Jetpack Compose में Window Size Class

Jetpack Compose में, Window Size Class का उपयोग currentWindowAdaptiveInfo() फ़ंक्शन के माध्यम से किया जाता है, जो चौड़ाई और ऊंचाई वर्गों के साथ WindowAdaptiveInfo लौटाता है। यह फ़ंक्शन न केवल विंडो आकार बल्कि इनपुट प्रकार (कीबोर्ड, माउस, टच) को भी ध्यान में रखता है — WindowPosture और WindowLayoutInfo के माध्यम से।

एक विशिष्ट परिदृश्य वर्ग के अनुसार लेआउट के बीच स्विच करना है। उदाहरण के लिए, Compact पर चयन के साथ BottomSheet दिखाया जाता है, Medium पर — एक साइड पैनल, Expanded पर — एक स्थायी Navigation Drawer।

@Composable
fun AdaptiveNavigation(windowSizeClass: WindowWidthSizeClass) {
    when (windowSizeClass) {
        WindowWidthSizeClass.COMPACT -> BottomNavigation()
        WindowWidthSizeClass.MEDIUM  -> NavigationRail()
        WindowWidthSizeClass.EXPANDED -> NavigationDrawer()
    }
}

Material Design 3 में, NavigationSuiteScaffold घटक स्वचालित रूप से Window Size Class के अनुकूल हो जाते हैं — डेवलपर को सशर्त तर्क लिखने की आवश्यकता नहीं है।

Window Size Class और Material Design 3

Material Design 3 (Material You) पूरी तरह से Window Size Class के साथ एकीकृत है। Material 3 में अनुकूली लेआउट सिस्टम निर्धारित करता है कि प्रत्येक वर्ग के लिए किस नेविगेशन घटक का उपयोग करना है: Compact के लिए BottomNavigation, Medium के लिए NavigationRail, Expanded के लिए NavigationDrawer।

यह एकीकरण Adaptive API स्तर पर काम करता है, जो Window Size Class को अन्य संकेतों — FoldState (फोल्डेबल डिवाइस) और WindowPosture (स्क्रीन स्थिति) — के साथ जोड़ता है। Adaptive API material3-adaptive लाइब्रेरी के माध्यम से उपलब्ध है।

Material 3 चार अनुकूली उच्च-स्तरीय घटक प्रदान करता है: ListDetailPaneScaffold, SupportingPaneScaffold, NavigationSuiteScaffold और AdaptiveSheet। उनमें से प्रत्येक अतिरिक्त कॉन्फ़िगरेशन के बिना Window Size Class के अनुसार अपना व्यवहार बदलता है।

अनुकूली लेआउट के लाभ

Window Size Class का उपयोग मोबाइल डेवलपमेंट में तीन प्रमुख लाभ प्रदान करता है। पहला — पूर्वानुमानशीलता: स्क्रीन आकारों के सैकड़ों संयोजनों के बजाय, डेवलपर तीन वर्गों के साथ काम करता है। यह परीक्षण परिदृश्यों की संख्या और लेआउट से संबंधित बगों को मौलिक रूप से कम करता है।

दूसरा — मल्टी-विंडो मोड के लिए स्वचालित अनुकूलन। जब उपयोगकर्ता Split Screen में प्रवेश करता है, तो विंडो की चौड़ाई बदल जाती है — Window Size Class तुरंत पुनर्गणना करता है, और इंटरफ़ेस अनुकूलित हो जाता है। इस API के बिना, विभाजित स्क्रीन में एप्लिकेशन फ़ोन इंटरफ़ेस का एक छोटा संस्करण दिखाता है।

तीसरा — Material Design 3 के साथ संगति। Google ने Window Size Class को अनुकूली घटक प्रणाली में शामिल किया है, इसलिए Material 3 पर बने इंटरफ़ेस बिना अतिरिक्त काम के स्वचालित रूप से बड़ी स्क्रीन डिज़ाइन के लिए Google की सिफारिशों का पालन करते हैं।