[Jetpack Compose] 너는 뭐냐

지금까지 UI 를 개발할 땐 계속 틀딱처럼 xml 만을 이용해 왔었다.

그런데 이번에 새 프로젝트에 들어가기 전, 조금 여유 시간이 생겨 Jetpack Compose 를 공부해 다음 프로젝트에 적용해보고자 한다.

 

그래서 Jetpack Compose 가 뭔데

Jetpack Compose 를 한 줄로 설명하면 Android 개발을 위한 선언형 UI Kit 이라고 한다.

 

선언형 UI 가 뭔데 원래도 뭐 선언같은거 했었잖아

기존의 xml 을 이용한 명령형 UI 개발 시에는 화면의 상태가 변경되면 상태가 저장되어 있던 변수의 값을 변경하고, 변경된 값을 뷰에 반영하도록 뷰 객체를 가져와 setText() 등의 함수를 호출하는 작업이 필요했다.

username = "재빈" // 값 바뀜
textView.setText(username); // 바뀐 값 뷰에 반영해라

////// xml code
<TextView
 android: id = "@+id/textView"
 android: width = "max_width"
 android: height = "20dp"
 android: text = "이름"/>

이러한 명령형 UI 개발 방식을 사용하면 위 샘플 코드에서 2번째 줄에 해당하는 setText() 등 뷰 객체에 현재 상태를 반영하는 작업을 빠뜨리면 아무리 상태가 변경되어도 뷰에는 반영되지 않는 등의 로직 오류가 나는 경우가 있었다.

 

하지만 선언형 UI 개발 방식 (Jetpack Compose) 를 사용한다면 위 샘플 코드는 아래와 같이 작성할 수 있다.

username = "재빈"
Text(text = $username)

이 코드에서는 username 변수의 값이 변경되면 자동으로 TextView 가 다시 그려진다.

애초에 코드를 이용해 뷰를 선언하면서 동시에 값을 지정할 수 있어 뷰 객체를 가져와 해당 뷰 객체에 현재 상태를 반영하도록 명령을 따로 날릴 필요가 없어진 것이다.

 

좀 좋아보이긴 하네

아무래도 몇년간 명령형 UI 개발에만 익숙해져 있다보니 프로젝트 구조를 만드는 것 부터 좀 신경써야하고, 아직 나온지 얼마 안 된 신생아 기술이라 레퍼런스도 많지 않은 것은 사실이다.

그래도 UI 개발 시간의 절약, UI 로직 오류의 감소, 전체 코드량 감소 등 익숙해졌을 때의 이점이 훨씬 많아 보여 시간을 투자할 가치는 있을 것 같다.