시작하기

이 페이지에서는 기본 Grid 레이아웃을 구현하는 방법을 설명합니다.

프로젝트 설정

  1. 프로젝트의 lib.versions.tomlandroidx.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)
    }
    

기본 그리드 만들기

다음 예시에서는 열과 행의 크기가 100.dp로 고정된 기본 2x3 그리드를 만듭니다.

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. 기본 그리드는 크기가 고정된 행과 열로 구성됩니다.

더 고급 그리드를 구현하는 방법을 알아보려면, 컨테이너 속성 설정항목 속성 설정을 참고하세요.