[Kotlin][Android] Jetpack Compose 개념, 프로젝트 시작하기

park_sujeong·2022년 7월 26일
0

Jetpack Compose

목록 보기
1/1
post-thumbnail

Jetpack Compose는 구글에서 개발한 모던한 안드로이드 개발을 위한 UI Toolkit이다. Jetpack Compose는 2021년 8월에 1.0.0 스테이블 버전이 정식 출시되었으며, 공식적으로 프로덕션에 적용 가능하게 되었다.
안드로이드는 xml 기반의 레이아웃 구성을 기반으로 UI를 구축해왔다. 이 xml 기반의 레이아웃 구성을 이제 Jetpack Compose로 할 수 있게 되었다.



Compose 특징

1. Jetpack Compose는 Kotlin만 사용이 가능하다.

Compose는 Java에서는 사용할 수 없다. Compose는 Coroutine이나 @Composable 어노테이션이 오직 코틀린 컴파일러에 의해서만 해석되고 동작하기 때문이다.


2. Jetpack Compose는 최소 환경을 요구한다.

Compose는 아래의 환경을 최소로 요구한다.

항목조건
Min SDK VersionAndroid 5.0 (API 21)
Android Studio VersionAndroid Studio Arctic Fox(2020.3.1)

3. 기존에 사용되던 라이브러리와 사용 가능하다.

Compose는 통합을 염두에 두고 제작되었기 때문에 모든 Jetpack 라이브러리와 함께 사용이 가능하다. 또한, 안드로이드 개발에 자주 사용되는 주요 라이브러리들 또한 컴포즈와 함께 사용할 수 있다.

  • 이미지 라이브러리 : Glide 등
  • 의존성 주입 : Dagger, Hilt 등
  • 비동기 처리 : Coroutines, Flow 등
  • 네트워크 : Retrofit 등
  • 애니메이션 : Lottie 등




Compose로 프로젝트 시작하기

  1. 프로젝트를 만든 후 Empty Compose Activity를 선택한다.

  1. 프로젝트를 만들고 난 후 프로젝트 구조를 보면 아래 사진과 같다.

    xml 파일은 존재하지 않고, ui.theme라는 폴더안에 4가지 파일을 확인할 수 있다.

    각 파일은 파일이름처럼 색상(Color.kt), 모양(Shape.kt), 테마(Theme.kt), 타입(Type.kt)을 지정해주는 파일이다.


  1. 생성된 MainActivity를 확인하면 아래 사진과 같다.

    우리가 매일 보던 MainActivity가 아니라 낯설것이다.

    아래 표는 MainActivity 내부 함수 설명이다.

    코드용도
    @Composable
    fun Greeting(name: String) {
    Text(text = "Hello $name!")}
    - TextView의 역할
    - name이라는 값으로 Android라는 String을 넣으면 화면에는 Hello Android라고 출력한다.
    @Preview(showBackground = true)
    @Composable
    fun DefaultPreview() {
    ComposeTheme {
    Greeting("Android")}}
    - @Preview가 명시되어있으면 아래 사진처럼 split이나 Design으로 했을때 미리보기가 가능하다
    - Preview를 사용할때는 변수를 다 지정해주어야 한다.




마치며...

Compose를 사용하며 느낀 점은 확실히 편리하다는 점이다.
원래라면 2개의 파일(xml, kt)로 표현될 화면이 한 개의 파일로 설정하면 된다는 점이 흥미롭다.

profile
Android Developer

0개의 댓글