Comenzar

En esta página, se describe cómo implementar diseños básicos de Grid.

Cómo configurar un proyecto

1. Agrega la biblioteca androidx.compose.foundation.layout al lib.versions.toml de tu proyecto.

   [versions]
   compose = "1.11.0-beta02"
   
   [libraries]
   androidx-compose-foundation-layout = { group = "androidx.compose.foundation", name = "foundation-layout", version.ref = "compose" }
   

2. Agrega la dependencia de la biblioteca al archivo build.gradle.kts de tu app.

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

Crea una cuadrícula básica

En el siguiente ejemplo, se crea una cuadrícula básica de 2 x 3, en la que las columnas y las filas tienen un tamaño fijo de 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)
}
DefineGrid.kt

Figura 1: Una cuadrícula básica consta de filas y columnas con un tamaño fijo.

Para obtener información sobre cómo implementar cuadrículas más avanzadas, consulta Cómo establecer propiedades del contenedor y Cómo establecer propiedades del elemento.