हमें यह बताते हुए खुशी हो रही है कि Material 3 अडैप्टिव 1.2.0 अब इस्तेमाल किया जा सकता है!

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

Material 3 अडैप्टिव 1.2.0 में नया क्या है

इस रिलीज़ को WindowManager 1.5.0 के आधार पर बनाया गया है. इसमें बड़े और बहुत बड़े ब्रेकपॉइंट के लिए सहायता दी गई है. साथ ही, ListDetailPaneScaffold और SupportingPaneScaffold के लिए, नई रीफ़्लो और लेविटेट रणनीतियां जोड़ी गई हैं. 

विंडो के साइज़ की नई क्लास: बड़ी और बहुत बड़ी

WindowManager 1.5.0 में, चौड़ाई के हिसाब से विंडो के साइज़ की क्लास के लिए दो नए ब्रेकपॉइंट जोड़े गए हैं. इनकी मदद से, एक्सपैंडेड विंडो के साइज़ की क्लास से भी बड़ी विंडो को सपोर्ट किया जा सकता है. अपने कोडबेस में, currentWindowAdaptiveInfo() कॉल में यह पैरामीटर जोड़कर, बड़े (L) और बहुत बड़े (XL) ब्रेकपॉइंट चालू किए जा सकते हैं:

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

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

अडैप्टिव की नई रणनीतियां: रीफ़्लो और लेविटेट

किसी विंडो में कॉन्टेंट और डिसप्ले पैन को व्यवस्थित करना एक मुश्किल काम है. इसके लिए, विंडो के साइज़ से लेकर कई बातों का ध्यान रखना पड़ता है. Material 3 अडैप्टिव लाइब्रेरी की नई टेक्नोलॉजी की मदद से, कम मेहनत में अडैप्टिव लेआउट बनाया जा सकता है.

रीफ़्लो की मदद से, विंडो का साइज़ या आसपेक्ट रेशियो बदलने पर, पैन को फिर से व्यवस्थित किया जाता है. जब विंडो की चौड़ाई ज़्यादा होती है, तो दूसरा पैन पहले पैन के बगल में रखा जाता है. वहीं, जब विंडो की ऊंचाई ज़्यादा होती है, तो दूसरा पैन पहले पैन के नीचे रखा जाता है. जब विंडो का साइज़ छोटा होता है, तब भी यह तकनीक लागू होती है. ऐसे में, कॉन्टेंट नीचे की ओर रीफ़्लो होता है.

विंडो के साइज़ के हिसाब से, पैन को रीफ़्लो करना

कई मामलों में रीफ़्लो एक बेहतरीन विकल्प है. हालांकि, कुछ स्थितियों में कॉन्टेंट को विंडो के किसी किनारे पर डॉक करना पड़ सकता है या उसके ऊपर लेविटेट करना पड़ सकता है. लेविटेट रणनीति की मदद से, कॉन्टेंट को डॉक करने के साथ-साथ, ड्रैग करने, साइज़ बदलने, और बैकग्राउंड स्क्रिम जैसी सुविधाओं को भी पसंद के मुताबिक बनाया जा सकता है.

आसपेक्ट रेशियो के हिसाब से, पैन को किनारे से बीच में लेविटेट करना

फ़्लो और लेविटेट, दोनों रणनीतियों को Navigator कंस्ट्रक्टर में, adaptStrategies पैरामीटर का इस्तेमाल करके बताया जा सकता है. साथ ही, दोनों रणनीतियों को लिस्ट-डिटेल और सपोर्टिंग पैन scaffolds पर लागू किया जा सकता है:

val navigator = rememberListDetailPaneScaffoldNavigator<Nothing>(
        adaptStrategies = ListDetailPaneScaffoldDefaults.adaptStrategies(
            detailPaneAdaptStrategy = AdaptStrategy.Reflow(
                reflowUnder = ListDetailPaneScaffoldRole.List
            ),
            extraPaneAdaptStrategy = AdaptStrategy.Levitate(
                alignment = Alignment.Center
            )
        )
    )

अडैप्टिव की इन नई रणनीतियों का फ़ायदा उठाने के बारे में ज़्यादा जानने के लिए, Material की वेबसाइट और GitHub पर पूरा सैंपल कोड देखें.