Compose 공식문서정리(2) - Set up Compose for an existing app(컴포즈 사용하기)

컴포즈 gradle 설정

Compose를 사용하려면 먼저 프로젝트에 몇 가지 빌드 구성을 추가해야 합니다. 앱의 build.gradle 파일에 다음 정의를 추가합니다

 

android {
    buildFeatures {
        compose = true
    }

    composeOptions {
        kotlinCompilerExtensionVersion = "1.5.13"
    }
}

 

 

몇 가지 주의해야 할 사항

1. Android BuildFeatures 블록 내에서 compose 플래그를 true로 설정하면 컴파일 기능이 활성화됩니다.2. ComposeOptions 블록에 정의된 Kotlin 컴파일러 확장 버전 관리는 Kotlin 버전 관리와 연동됩니다. 호환성 맵을 참조하여 프로젝트의 Kotlin 버전과 일치하는 라이브러리 버전을 선택해야 합니다.

 

 

아래 블록에서 필요한 Compose BOM 및 Compose 라이브러리 종속성의 하위 집합을 종속성에 추가합니다

dependencies {

    val composeBom = platform("androidx.compose:compose-bom:2024.05.00")
    implementation(composeBom)
    androidTestImplementation(composeBom)

    // Choose one of the following:
    // Material Design 3
    implementation("androidx.compose.material3:material3")
    // or Material Design 2
    implementation("androidx.compose.material:material")
    // or skip Material Design and build directly on top of foundational components
    implementation("androidx.compose.foundation:foundation")
    // or only import the main APIs for the underlying toolkit systems,
    // such as input and measurement/layout
    implementation("androidx.compose.ui:ui")

    // Android Studio Preview support
    implementation("androidx.compose.ui:ui-tooling-preview")
    debugImplementation("androidx.compose.ui:ui-tooling")

    // UI Tests
    androidTestImplementation("androidx.compose.ui:ui-test-junit4")
    debugImplementation("androidx.compose.ui:ui-test-manifest")

    // Optional - Included automatically by material, only add when you need
    // the icons but not the material library (e.g. when using Material3 or a
    // custom design system based on Foundation)
    implementation("androidx.compose.material:material-icons-core")
    // Optional - Add full set of material icons
    implementation("androidx.compose.material:material-icons-extended")
    // Optional - Add window size utils
    implementation("androidx.compose.material3:material3-window-size-class")

    // Optional - Integration with activities
    implementation("androidx.activity:activity-compose:1.9.0")
    // Optional - Integration with ViewModels
    implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.6.1")
    // Optional - Integration with LiveData
    implementation("androidx.compose.runtime:runtime-livedata")
    // Optional - Integration with RxJava
    implementation("androidx.compose.runtime:runtime-rxjava2")

}

 

 

참고: Jetpack Compose는 모든 라이브러리 그룹의 버전을 동기화하기 위해 BOM(Bill of Materials)을 사용하여 제공됩니다. 자세한 내용은 부품 명세서 페이지에서 확인하세요.

 

 

컴파일 그래들 플러그인 작성

 

Gradle 사용자의 경우 Compose 컴파일러 Gradle 플러그인을 사용하면 Compose를 더 쉽게 설정하고 구성할 수 있습니다.

 

참고: Compose 컴파일러 그래들 플러그인은 Kotlin 2.0 이상에서만 사용할 수 있습니다. 마이그레이션 지침은 "Jetpack Compose 컴파일러를 Kotlin 리포지토리로 이동하기"를 참조하세요. 마이그레이션 예제는 샘플 작성에서 샘플 작성 PR을 참조하세요.

 

 

Gradle 버전 카탈로그로 설정

1. libs.versions.toml 파일에서 Compose 컴파일러에 대한 참조를 제거합니다.

2. 플러그인 섹션에서 다음과 같은 새 종속성을 추가합니다.

 

[versions]
kotlin = "2.0.0"

[plugins]
org-jetbrains-kotlin-android = { id = "org.jetbrains.kotlin.android", version.ref = "kotlin" }

// Add this line
compose-compiler = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }

 

 

프로젝트 루트 build.gradle.kts 파일에서 플러그인 섹션에 다음을 추가합니다:

plugins {
   // Existing plugins
   alias(libs.plugins.compose.compiler) apply false
}

 

 

작성 기능을 사용하는 각 모듈에서 플러그인을 적용합니다:

plugins {
   // Existing plugins
   alias(libs.plugins.compose.compiler)
}

 

이제 기본 설정을 사용하는 경우 앱이 빌드 및 컴파일됩니다. 컴파일 컴파일러에서 사용자 지정 옵션을 구성한 경우 다음 섹션을 참조하세요.

 

 

Gradle 버전 카탈로그 없이 설정

 

버전 카탈로그 없이 컴파일러 Gradle 플러그인을 설정하려면 컴파일을 사용하는 모듈과 연결된 build.gradle.kts 파일에 다음 플러그인을 추가하세요:

plugins {
    id("org.jetbrains.kotlin.plugin.compose") version "2.0.0" // this version matches your Kotlin version
}

 

컴파일러 작성 그래들 플러그인을 사용한 구성 옵션

Gradle 플러그인을 사용하여 Compose 컴파일러를 구성하려면 모듈의 build.gradle.kts 파일 최상위 레벨에 composeCompiler 블록을 추가합니다.

 

android { … }

composeCompiler {
    enableStrongSkippingMode = true

    reportsDestination = layout.buildDirectory.dir("compose_compiler")
    stabilityConfigurationFile = rootProject.layout.projectDirectory.file("stability_config.conf")
}

 

 

참고 : https://developer.android.com/develop/ui/compose/compiler