البدء

توضّح هذه الصفحة كيفية تنفيذ تنسيقات Grid الأساسية.

إعداد المشروع

  1. أضِف مكتبة androidx.compose.foundation.layout إلى lib.versions.toml في مشروعك.

    [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)
}

تتألف الشبكة الأساسية من صفوف وأعمدة ذات حجم ثابت.
الشكل 1. تتألف الشبكة الأساسية من صفوف وأعمدة ذات حجم ثابت.

لمعرفة كيفية تنفيذ شبكات أكثر تقدّمًا، اطّلِع على ضبط خصائص الحاوية وضبط خصائص العنصر.