توضّح هذه الصفحة كيفية تنفيذ تنسيقات Grid الأساسية.
إعداد المشروع
أضِف مكتبة
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" }أضِف تبعية المكتبة إلى ملف
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) }
لمعرفة كيفية تنفيذ شبكات أكثر تقدّمًا، اطّلِع على ضبط خصائص الحاوية وضبط خصائص العنصر.