Jetpack Compose UI 개발 입문 - 선언형 UI로 안드로이드 앱 만들기

안드로이드 앱 개발에서 UI를 만드는 방식이 크게 바뀌고 있습니다. 전통적인 XML 레이아웃 대신, 코드로 직접 UI를 선언하는 Jetpack Compose가 새로운 표준으로 자리잡았습니다. 2025년 8월 기준, Google Play Store 상위 1,000개 앱 중 60% 이상이 Compose를 사용하고 있습니다. 이 글에서는 Compose의 개념부터 실전 사용법까지 차근차근 안내합니다.

Jetpack Compose란 무엇인가

Jetpack Compose는 구글이 개발한 안드로이드 UI 툴킷입니다. 기존의 XML 방식과 달리, 코틀린 코드로 직접 UI를 작성하는 선언형 프로그래밍 방식을 사용합니다. 화면에 보여줄 내용을 함수로 선언하면, Compose가 알아서 UI를 그려주고 업데이트합니다.

선언형 UI의 핵심은 “현재 상태”만 신경쓰면 된다는 점입니다. 기존 XML 방식에서는 버튼을 누르면 직접 텍스트를 바꾸고, 색상을 변경하는 등의 작업을 일일이 코딩해야 했습니다. 하지만 Compose에서는 “지금 이 상태에서 UI는 이렇게 보여야 한다”고만 선언하면, Compose가 자동으로 화면을 업데이트합니다.

2025년 8월 기준 최신 안정화 버전은 1.9.0이며, Compose BOM(Bill of Materials) 2025.08.01이 출시되어 종속성 관리가 더욱 간편해졌습니다. Google I/O 2025에서는 Material Expressive, LookaheadScope 등 새로운 기능이 발표되어 복잡한 UI 애니메이션과 렌더링 성능이 크게 향상되었습니다.

Compose와 XML의 차이점

기존 XML 방식에서는 레이아웃 파일(.xml)에 UI를 정의하고, 자바나 코틀린 코드에서 findViewById()로 뷰를 찾아 조작했습니다. 화면이 복잡해질수록 XML 파일과 코드 파일을 오가며 작업해야 했고, UI 업데이트 로직도 복잡해졌습니다.

Compose는 모든 것을 코틀린 코드로 처리합니다. 레이아웃과 로직이 한 곳에 있어 코드를 이해하기 쉽고, UI 변경도 빠릅니다. 조사한 결과에 따르면, Compose를 사용하면 XML 대비 코드량이 약 40% 줄어들고, 개발 시간도 30% 단축된다고 합니다.

또한 Compose는 Kotlin의 강력한 기능을 그대로 활용할 수 있습니다. 람다, 고차 함수, 확장 함수 등을 사용해 재사용 가능한 UI 컴포넌트를 쉽게 만들 수 있습니다. 프리뷰 기능을 사용하면 Android Studio에서 실시간으로 UI 변경사항을 확인할 수 있어 개발 효율이 높아집니다.

개발 환경 설정 방법

Compose를 사용하려면 먼저 개발 환경을 설정해야 합니다. Android Studio 최신 버전을 설치하고, 프로젝트 설정 파일에 Compose 관련 옵션을 추가하면 됩니다.

필수 환경:

• Android Studio: 최신 버전 (Compose 지원 버전)
• Kotlin: 1.8 이상
• Gradle: 7.0 이상
• API 레벨: Android 5.0(API 21) 이상

프로젝트의 build.gradle 파일(앱 모듈)에 다음 설정을 추가합니다. buildFeatures에서 Compose를 활성화하고, composeOptions에서 컴파일러 확장 버전을 지정합니다. 2025년 8월 기준 Kotlin Compiler Extension 버전은 1.5.15입니다.

android {
    buildFeatures {
        compose = true
    }
    composeOptions {
        kotlinCompilerExtensionVersion = "1.5.15"
    }
    kotlinOptions {
        jvmTarget = "1.8"
    }
}

종속성 관리는 BOM(Bill of Materials)을 사용하는 것이 편리합니다. BOM 버전만 지정하면 모든 Compose 라이브러리의 버전이 자동으로 맞춰집니다. dependencies 블록에 다음과 같이 추가합니다.

dependencies {
    implementation platform('androidx.compose:compose-bom:2025.08.01')
    implementation 'androidx.compose.ui:ui'
    implementation 'androidx.compose.material3:material3'
    implementation 'androidx.compose.ui:ui-tooling-preview'
}

첫 번째 Compose UI 만들기

Compose에서는 함수에 @Composable 어노테이션을 붙여 UI를 정의합니다. 이 함수를 호출하면 화면에 UI가 그려집니다. 간단한 텍스트 화면부터 시작해보겠습니다.

@Composable
fun Greeting(name: String) {
    Text(text = "안녕하세요, $name!")
}

이 함수는 “안녕하세요, (이름)!” 형태의 텍스트를 화면에 표시합니다. Text는 Compose에서 제공하는 기본 컴포넌트로, XML의 TextView에 해당합니다. 여러 이름을 나열하고 싶다면 반복문을 사용할 수 있습니다.

@Composable
fun GreetingList(names: List<String>) {
    Column {
        for (name in names) {
            Text("안녕하세요, $name!")
        }
    }
}

Column은 세로 방향으로 요소를 배치하는 레이아웃입니다. 가로 방향은 Row, 겹쳐서 배치는 Box를 사용합니다. 이런 기본 레이아웃을 조합하면 복잡한 화면도 쉽게 구성할 수 있습니다.

프리뷰 기능을 사용하면 Android Studio에서 실시간으로 UI를 확인할 수 있습니다. @Preview 어노테이션을 붙인 함수를 작성하면 됩니다.

@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
    Greeting("Compose")
}

Compose의 주요 특징과 장점

Compose의 가장 큰 장점은 생산성 향상입니다. XML 파일과 코드를 오가지 않고 한 곳에서 UI를 작성하므로, 개발 속도가 빠릅니다. 또한 코틀린의 람다와 고차 함수를 활용해 재사용 가능한 컴포넌트를 쉽게 만들 수 있습니다.

성능 측면에서도 Compose는 우수합니다. UI 렌더링 속도가 빠르고, 메모리 사용량도 최적화되어 있습니다. Compose는 변경된 부분만 다시 그리는 리컴포지션(Recomposition) 방식을 사용해 불필요한 렌더링을 줄입니다.

Material Design 3를 기본으로 지원하여, 최신 디자인 가이드라인을 쉽게 적용할 수 있습니다. 2025년에는 Material Expressive가 도입되어 새로운 컴포넌트, 스타일, 모션 효과를 사용할 수 있게 되었습니다. LookaheadScope와 같은 새로운 API는 복잡한 UI 애니메이션 처리를 간편하게 만들어줍니다.

호환성도 뛰어납니다. 기존 XML 기반 뷰와 Compose를 함께 사용할 수 있어, 기존 프로젝트에 점진적으로 Compose를 도입할 수 있습니다. ComposeView를 사용하면 기존 XML 레이아웃 안에 Compose UI를 삽입할 수 있고, AndroidView를 사용하면 Compose 안에 기존 뷰를 삽입할 수 있습니다.

학습 로드맵과 시작 팁

Compose 학습은 단계적으로 접근하는 것이 좋습니다. 먼저 코틀린 기본 문법을 익히고, Compose의 기본 컴포넌트(Text, Button, Image 등)를 다루는 것부터 시작하세요. 그 다음 레이아웃(Column, Row, Box)을 학습하고, 상태 관리(State, remember, mutableStateOf)를 이해하면 됩니다.

학습 단계 추천:

1. 기초 단계: Kotlin 문법, 기본 컴포넌트, 레이아웃 (1-2주)
2. 중급 단계: 상태 관리, 리스트, 내비게이션 (2-3주)
3. 고급 단계: 애니메이션, 커스텀 컴포넌트, 성능 최적화 (3-4주)
4. 실전 단계: 실제 앱 프로젝트 개발 (4주 이상)

공식 문서와 코드랩(Codelab)을 적극 활용하세요. Android Developers 사이트에는 단계별 튜토리얼과 샘플 코드가 풍부합니다. GitHub에도 다양한 오픈소스 Compose 프로젝트가 있어 실전 코드를 참고할 수 있습니다.

신규 프로젝트라면 처음부터 Compose를 사용하는 것을 권장합니다. 기존 프로젝트는 새로운 화면부터 Compose로 작성하며 점진적으로 전환하는 방식이 효율적입니다. UI 복잡도가 높거나 유지보수 효율성이 중요한 앱일수록 Compose의 장점이 두드러집니다.

자주 묻는 질문 (FAQ)