Grid, Jetpack Compose API है. इसकी मदद से, दो डाइमेंशन वाला लेआउट आसानी से लागू किया जा सकता है.
इस एपीआई की मदद से, आइटम को कई कॉलम या कई लाइनों वाले लेआउट में दिखाया जा सकता है. ये लेआउट, उपलब्ध कंटेनर के साइज़ के हिसाब से अपने-आप अडजस्ट हो जाते हैं.
Grid के साथ दो डाइमेंशन वाला अडैप्टिव और फ़्लेक्सिबल लेआउट.
Grid, मिलते-जुलते कंपोज़ेबल से कैसे अलग है?
Compose में पहले से ही मिलते-जुलते कॉम्पोनेंट उपलब्ध हैं, जैसे कि LazyVerticalGrid.
इन कॉम्पोनेंट का इस्तेमाल मुख्य रूप से, बड़े और एक जैसे डेटा सेट को विज़ुअलाइज़ करने के लिए किया जाता है. उदाहरण के लिए, वीडियो स्ट्रीमिंग ऐप्लिकेशन में कॉन्टेंट कैटलॉग दिखाना. इन कॉम्पोनेंट को स्क्रीन या जटिल कॉम्पोनेंट के स्ट्रक्चरल लेआउट के लिए डिज़ाइन नहीं किया गया है.
कई Row और Column कंपोज़ेबल को मिलाकर, दो डाइमेंशन वाला लेआउट भी लागू किया जा सकता है.
हालांकि, इस तरीके की कुछ कमियां हैं. जैसे, डीप हैरारकी और अडैप्टेबिलिटी में समस्याएं.
यहां दी गई टेबल में, इस बारे में खास जानकारी दी गई है कि हर एपीआई के लिए कौनसा लेआउट सही है:
| कॉम्पोनेंट | मकसद |
|---|---|
LazyVerticalGrid, LazyStaggeredGrid, LazyHorizontalGrid |
बड़े और एक जैसे डेटा सेट को विज़ुअलाइज़ करना. इसके लिए, लेज़ी लोडिंग की ज़रूरत होती है. |
Row, Column, FlexBox |
एक डाइमेंशन वाला लेआउट |
Grid |
टू-डाइमेंशनल लेआउट |
शब्दावली
Grid के काम करने का तरीका समझने के लिए, यहां दी गई शब्दावली के बारे में जानें.
ग्रिड लाइन
ग्रिड, हॉरिज़ॉन्टल और वर्टिकल लाइनों से मिलकर बना होता है. अगर आपकी ग्रिड में तीन लाइनें हैं, तो इसमें चार हॉरिज़ॉन्टल लाइनें होंगी. इनमें आखिरी लाइन के बाद वाली लाइन भी शामिल है. यहां दी गई इमेज में, हर डॉटेड लाइन एक ग्रिड लाइन को दिखाती है:
ग्रिड ट्रैक
ग्रिड ट्रैक, दो ग्रिड लाइनों के बीच का स्पेस होता है. रो ट्रैक, दो हॉरिज़ॉन्टल लाइनों के बीच होता है. वहीं, कॉलम ट्रैक दो वर्टिकल लाइनों के बीच होता है. इन ट्रैक का साइज़ तय करने के लिए, ग्रिड बनाते समय इन्हें साइज़ असाइन करें.
ग्रिड सेल
ग्रिड सेल, लाइन और कॉलम ट्रैक का इंटरसेक्शन होता है.
ग्रिड एरिया
ग्रिड एरिया में कई ग्रिड सेल होती हैं. किसी आइटम को कई ट्रैक में फैलाकर, ग्रिड एरिया तय किया जा सकता है.
ग्रिड के बीच का अंतर
ग्रिड गैप, ग्रिड ट्रैक के बीच का गटर होता है. किसी यूज़र इंटरफ़ेस (यूआई) एलिमेंट को गैप में नहीं रखा जा सकता. हालांकि, यूज़र इंटरफ़ेस (यूआई) एलिमेंट को गैप में फैलाया जा सकता है.
