Material 3 Adaptive 1.2.0 अब उपलब्ध है

हमें यह बताते हुए खुशी हो रही है कि Material 3 Adaptive 1.2.0 अब उपलब्ध है!

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

Material 3 Adaptive 1.2.0 में नया क्या है

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

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

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

currentWindowAdaptiveInfo(supportLargeAndXLargeWidth = true)

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

अनुकूल बनाने की नई रणनीतियां: रीफ़्लो और लेविटेट

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

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

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

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

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

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

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

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