Bắt đầu

Trang này mô tả cách triển khai bố cục Grid cơ bản.

Thiết lập dự án

1. Thêm thư viện androidx.compose.foundation.layout vào tệp lib.versions.toml của dự án.

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

2. Thêm phần phụ thuộc thư viện vào tệp build.gradle.kts của ứng dụng.

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

Tạo lưới cơ bản

Ví dụ sau đây tạo một lưới 2x3 cơ bản, với các cột và hàng có kích thước cố định là 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

Hình 1. Một lưới cơ bản bao gồm các hàng và cột có kích thước cố định.

Để tìm hiểu cách triển khai các lưới nâng cao hơn, hãy xem bài viết Đặt thuộc tính vùng chứa và Đặt thuộc tính mục.