स्क्रोल किया जा सकने वाला ग्रिड बनाना

लेज़ी ग्रिड की मदद से, बड़े डेटासेट और डाइनैमिक कॉन्टेंट को मैनेज किया जा सकता है. इससे ऐप्लिकेशन की परफ़ॉर्मेंस बेहतर होती है. लेज़ी ग्रिड कॉम्पोज़ेबल की मदद से, आइटम को स्क्रोल किए जा सकने वाले ऐसे कंटेनर में दिखाया जा सकता है जो कई कॉलम या पंक्तियों में फैला हो.

वर्शन के साथ काम करना

इसे लागू करने के लिए, ज़रूरी है कि आपके प्रोजेक्ट का minSDK एपीआई लेवल 21 या उससे ज़्यादा पर सेट हो.

डिपेंडेंसी

ग्रिड का ओरिएंटेशन तय करना

LazyHorizontalGrid और LazyVerticalGrid कॉम्पोनेंट, आइटम को ग्रिड में दिखाने की सुविधा देते हैं. लेज़ी वर्टिकल ग्रिड, अपने आइटम को वर्टिकल तौर पर स्क्रोल किए जा सकने वाले कंटेनर में दिखाता है. यह कंटेनर कई कॉलम में फैला होता है. वहीं, लेज़ी हॉरिज़ॉन्टल ग्रिड, हॉरिज़ॉन्टल ऐक्सिस पर भी इसी तरह काम करते हैं.

स्क्रोल किया जा सकने वाला ग्रिड बनाना

नीचे दिया गया कोड, तीन कॉलम वाला हॉरिज़ॉन्टल स्क्रोलिंग ग्रिड बनाता है:

@Composable
fun ScrollingGrid() {
    val itemsList = (0..15).toList()

    val itemModifier = Modifier
        .border(1.dp, Color.Blue)
        .width(80.dp)
        .wrapContentSize()

    LazyHorizontalGrid(
        rows = GridCells.Fixed(3),
        horizontalArrangement = Arrangement.spacedBy(16.dp),
        verticalArrangement = Arrangement.spacedBy(16.dp)
    ) {
        items(itemsList) {
            Text("Item is $it", itemModifier)
        }

        item {
            Text("Single item", itemModifier)
        }
    }
}
LazyListSnippets.kt

कोड के बारे में अहम जानकारी

  • LazyHorizontalGrid कॉम्पोज़ेबल, ग्रिड के हॉरिज़ॉन्टल ओरिएंटेशन का पता लगाता है.
    • वर्टिकल ग्रिड बनाने के लिए, इसके बजाय LazyVerticalGrid का इस्तेमाल करें.
  • rows प्रॉपर्टी से यह तय होता है कि ग्रिड में कॉन्टेंट को कैसे व्यवस्थित किया जाए.
    • वर्टिकल ग्रिड के लिए, columns प्रॉपर्टी का इस्तेमाल करके, लाइन में लगाने का तरीका तय करें.
  • items(itemsList), LazyHorizontalGrid में itemsList जोड़ता है. यह लेम्ब्डा फ़ंक्शन, हर आइटम के लिए एक Text कॉम्पोज़ेबल रेंडर करता है और टेक्स्ट को आइटम के ब्यौरे पर सेट करता है.
  • item(), LazyHorizontalGrid में एक आइटम जोड़ता है, जबकि लैम्ब्डा फ़ंक्शन, items() की तरह ही एक Text कॉम्पोज़ेबल को रेंडर करता है.
  • GridCells.Fixed, पंक्तियों या कॉलम की संख्या तय करता है.

  • ज़्यादा से ज़्यादा लाइनों वाला ग्रिड बनाने के लिए, GridCells.Adaptive का इस्तेमाल करके लाइनों की संख्या सेट करें.

    नीचे दिए गए कोड में, 20.dp वैल्यू से पता चलता है कि हर कॉलम कम से कम 20.dp है और सभी कॉलम की चौड़ाई एक जैसी है. अगर स्क्रीन 88.dp चौड़ी है, तो इसमें चार कॉलम होंगे और हर कॉलम 22.dp चौड़ा होगा.

नतीजे

पहली इमेज. LazyHorizontalGrid का इस्तेमाल करके, हॉरिज़ॉन्टल तरीके से स्क्रोल किया जा सकने वाला ग्रिड.

ऐसे संग्रह जिनमें यह गाइड शामिल है

यह गाइड, चुने गए क्विक गाइड के कलेक्शन का हिस्सा है. इसमें Android डेवलपमेंट के बड़े लक्ष्यों के बारे में बताया गया है:

सूचियों और ग्रिड की मदद से, आपके ऐप्लिकेशन में संग्रहों को ऐसे दिखाया जा सकता है कि वे उपयोगकर्ताओं को देखने में अच्छे लगें और उन्हें आसानी से समझ आएं.
क्विक गाइड का कलेक्शन
जानें कि कॉम्पोज़ेबल फ़ंक्शन की मदद से, Material Design डिज़ाइन सिस्टम के आधार पर, आसानी से खूबसूरत यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट कैसे बनाए जा सकते हैं.
क्विक गाइड का कलेक्शन
इस वीडियो सीरीज़ में, Compose के अलग-अलग एपीआई के बारे में बताया गया है. इससे आपको यह जानने में मदद मिलेगी कि कौनसे एपीआई उपलब्ध हैं और उन्हें कैसे इस्तेमाल किया जा सकता है.
क्विक गाइड का कलेक्शन

क्या आपका कोई सवाल है या सुझाव/राय देनी है

अक्सर पूछे जाने वाले सवालों के पेज पर जाएं और क्विक गाइड के बारे में जानें. इसके अलावा, हमसे संपर्क करके अपने सुझाव/राय दें.
अक्सर पूछे जाने वाले सवालों पर जाएं सुझाव/राय दें या शिकायत सबमिट करें