Compose UI 개요

Compose UI 개요

1. Compose UI란?

Compose UI는 Android의 최신 UI 툴킷으로, 선언형 방식으로 UI를 구축할 수 있도록 설계되었습니다. 기존 View 기반 UI 시스템과 비교하여 더 직관적이고, 유연하며, 코드의 양을 줄일 수 있는 장점이 있습니다.

2. 기존 View 시스템과의 차이점

View 시스템

• XML을 사용하여 UI를 정의하고, Activity/Fragment에서 해당 레이아웃을 관리함
• UI 변경 시 findViewById()나 ViewBinding을 활용해야 함
• 상태 관리가 복잡하고 코드가 길어지는 경향이 있음

Compose UI

• Kotlin 코드로 UI 작성: XML 없이 UI를 선언형 방식으로 정의할 수 있음
• Recomposition 기반: 상태(State)의 변화에 따라 UI가 자동으로 업데이트됨
• 더 쉬운 상태 관리: remember, mutableStateOf, ViewModel 등을 활용하여 코드가 간결해짐
• 코드 재사용성 증가: Composable 함수로 작은 UI 요소를 만들고 재사용 가능

3. Compose UI의 핵심 개념

1) Composable 함수

@Composable 어노테이션을 사용하여 UI를 구성하는 함수를 정의합니다.

@Composable
fun Greeting(name: String) {
    Text(text = "Hello, $name!")
}

2) 상태 관리 (State)

Compose는 UI 상태를 자동으로 감지하고 변경 사항을 반영합니다.

@Composable
fun Counter() {
    var count by remember { mutableStateOf(0) }
    Column {
        Text("Count: $count")
        Button(onClick = { count++ }) {
            Text("Increase")
        }
    }
}

3) Recomposition

• UI는 상태(State)의 변경에 따라 자동으로 다시 그려집니다.
• 불필요한 Recomposition을 방지하는 것이 성능 최적화의 핵심입니다.

4. Compose UI의 장점

• 선언형 UI: 코드가 직관적이고 유지보수가 쉬움
• XML 불필요: 모든 UI를 Kotlin 코드로 작성 가능
• 더 간결한 코드: 중복 코드 감소, UI와 상태 관리 코드가 명확하게 분리됨
• 성능 개선: View 계층이 단순화되어 불필요한 연산이 줄어듦

5. 다음 글에서 다룰 내용

다음 글에서는 Compose UI의 기본 컴포넌트 (Text, Button, Image, Row, Column 등)를 다루고, 실전에서 어떻게 활용하는지 설명하겠습니다.