본문 바로가기

Android App/Jetpack

[Compose/Course] Compose Overview

Compose란?

새로운 안드로이드 UI 툴킷, 선언적 독립형 툴킷
직관적이고 강력하면서도 개발을 가속화하도록 설계, 빠르고 쉬움
최신 아키텍처를 기반으로하고 Kotlin을 활용하는 현대적인 툴킷

UI를 빠르고 쉽게 구축할 수 있는 이유

Declarative(선언적인)

기존 Views 시스템
데이터 및 상태가 바뀌면 View를 조회하고 속성을 설정해야 함
사용자 상호작용이 끝나면 새로운 정보를 UI를 업데이트하여 데이터 동기화 해야 함
각 뷰마다 상태가 다르고 각각 업데이트 해야하므로 과정이 복잡하고 버그가 발생할 수 있음

Compose는 상태를 UI로 변환
앱 상태가 바뀌면 새로운 상태를 새로운 표현으로 변환, 특정 상태에 맞추어 UI 자체를 새로 생성 -> 동기화 문제 해결
코드는 특정 상황에 대한 UI 형태를 설명할 뿐, 생성 방법을 지정하지 않음

Compose에서 UI 구성 요소는 @Composable 어노테이션이 달린 함수 -> 빠르고 쉽게 UI 구성 가능
재사용 가능한 요소로 구성된 라이브러리로 UI를 나누는 것이 좋음
함수는 값을 반환하는 대신 UI를 전달

Composable은 데이터를 함수 매개변수로 받아서 UI를 전달함 -> UI가 동기화 상태를 벗어나지 않음
입력 데이터나 상태가 바뀌었을 때 자동으로 함수를 호출하여 새로운 UI 생성 -> Recomposition (재구성)

요소는 전달되는 매개변수가 완전히 통제함, 동기화 할 상태를 없앰  -> Single Source Truth

다시 실행하거나 재구성을 호출하더라도 유지하고 싶은 데이터가 있다면 remember 함수를 사용해 이전 실행에서 얻은 값을 기억할 수 있음

특정 상태에서 UI 형태를 완전히 설명하고 상태가 바뀌면 프레임워크에서 UI 업데이트 처리

Compose는 단방향 데이터 플로우를 따르는 아키텍쳐와 잘 맞음 (ViewModel과 LiveData)

UI Toolkit

Composable은 다양한 UI 구성요소 툴킷 제공
- Material Design 구성요소와 테마 시스템 제공
- 애플리케이션을 구성하는 다양한 요소 제공 (Button, Card, FAB 등)
- 원하는 색, 도형, 서체 스타일 맞춤 지정 가능
- 새로운 레이아웃 시스템: 행과 열 기반
- 새로운 애니메이션 시스템: 효과적이고 간단하게 애니메이션 적용 가능
- 테스트와 접근성 용이
- 강력하고 직관적인 API
- 코루틴을 사용하면 간단한 비동기식 API 작성 가능

기존 View 시스템과 호환

Compose를 필요에 따라 점진적으로 도입 가능
Views에 Compose를 포함하거나, Compose에 View를 포함할 수 있음