शुरू करना

इस पेज पर, Grid के बुनियादी लेआउट लागू करने का तरीका बताया गया है.

प्रोजेक्ट सेट अप करना

  1. अपने प्रोजेक्ट के lib.versions.toml में androidx.compose.foundation.layout लाइब्रेरी जोड़ें.

    [versions]
    compose = "1.11.0-beta02"
    
    [libraries]
    androidx-compose-foundation-layout = { group = "androidx.compose.foundation", name = "foundation-layout", version.ref = "compose" }
    
  2. अपने ऐप्लिकेशन की build.gradle.kts में लाइब्रेरी डिपेंडेंसी जोड़ें.

    dependencies {
        implementation(libs.androidx.compose.foundation.layout)
    }
    

बेसिक ग्रिड बनाना

यहां दिए गए उदाहरण में, 2x3 की एक बेसिक ग्रिड बनाई गई है. इसमें कॉलम और लाइनों का साइज़ 100.dp पर सेट है.

Grid(
    config = {
        repeat(2) {
            column(100.dp)
        }
        repeat(3) {
            row(100.dp)
        }
    }
) {
    Card1(containerColor = PastelRed)
    Card2(containerColor = PastelGreen)
    Card3(containerColor = PastelBlue)
    Card4(containerColor = PastelPink)
    Card5(containerColor = PastelOrange)
    Card6(containerColor = PastelYellow)
}

बेसिक ग्रिड में, तय साइज़ वाली पंक्तियां और कॉलम होते हैं.
पहली इमेज. बेसिक ग्रिड में, तय साइज़ वाली पंक्तियां और कॉलम होते हैं.

ज़्यादा बेहतर ग्रिड लागू करने का तरीका जानने के लिए, कंटेनर प्रॉपर्टी सेट करना और आइटम प्रॉपर्टी सेट करना लेख पढ़ें.