Jetpack Compose 마이그레이션 한 이유

• XML을 사용하지 않고 Kotlin Code만으로 UI 개발이 가능하다
• 복잡한 RecyclerView 및 Adapter를 더 이상 사용하지 않아도 된다

Jetpack Compose 마이그레이션 전략

작은 컴포넌트부터 시작하기

• TopAppBar, Image, Button 등 작은 컴포넌트를 우선으로 먼저 Compose로 변환 시킨다

XML과 Compose 공존하기

• XML에서 ComposeView를 사용하여 Compose로 작성된 컴포넌트를 사용하여 기존 XML 뷰 시스템과 같이 사용할 수 있도록 한다

작은 것부터 시작해서 점차적으로 Compose로 변환 시키기

• View -> ViewGroup -> RootView로 점차적으로 Compose로 변환 시켜 전체적으로 Compose로 사용할 수 있게 한다.

Compose 환경

Gradle 설정하기

android {
	buildFeatures {
    	compose = true
    }

    composeOptions {
        kotlinCompilerExtensionVersion = "1.5.7"
    }
}

build.gradle.kts 파일에서 buildFeatures를 통해 compose를 활성화 시키고

composeOptions에서 kotlinCompilerExtensionVersion 옵션을 설정하여 Compose와 함께 사용할 Kotlin 컴파일러 플러그인의 버전을 지정한다.

dependencies {
	    // compose
    val composePlatform = platform("androidx.compose:compose-bom:2023.10.01")
    implementation(composePlatform)
}

Bill of Materials(BOM) 방식으로 Compose 관련 의존성들을 관리한다. 여기서 "androidx.compose:compose-bom:2023.10.01"는 Compose 관련 모든 라이브러리들이 2023.10.01 버전과 호환되도록 한다

dependencies {
    implementation("androidx.compose.material3:material3")
    implementation("androidx.compose.ui:ui")
    implementation("androidx.compose.ui:ui-graphics")
    implementation("androidx.compose.ui:ui-tooling-preview")
    debugImplementation("androidx.compose.ui:ui-tooling")
}

Material Design 3 UI 컴포넌트의 사용을 위한 설정과 함께, 기본적인 UI 기능, 그래픽 처리 기능을 제공하는 라이브러리를 포함하였다. 또한, UI 미리보기를 지원하는 도구와 개발 및 디버깅 과정에서 필요한 Jetpack Compose 관련 도구들을 프로젝트에 추가하였다.

dependencies {
    implementation("androidx.activity:activity-compose:1.8.2")
    implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.6.2")
    implementation("androidx.lifecycle:lifecycle-runtime-compose:2.6.2")
    implementation("androidx.navigation:navigation-compose:2.7.6")
    implementation("androidx.constraintlayout:constraintlayout-compose:1.0.1")

}