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