| sitelink1 | https://aroundck.tistory.com/7344 |
|---|---|
| sitelink2 | |
| sitelink3 |
Android Jetpack Compose 가 뭐야?
기존에는 Android UI Toolkit 전체가 View class 위에 build 되어 있었다.
이는 android 가 생성될 때부터 있었던 일이다.
그래서 View 를 개선하고 싶은 욕구가 있어도 처음부터 새로 만들기가 어려웠다.
클라이언트단에서 요구사항들이 많이 있어서 구글은 UI 에 대한 것을 처음부터 다시 구현하기로 했다.
그것이 Android Jetpack Compose lib 이다.
그리고 이것은 React, Litho, Vue, Flutter 등에서 컨셉을 차용했다.
1. Android Platform Release 와 함께 release 되는 것이 아니다.
기존 UI system 은 platform 에 종속적이다.
material design 이 처음 나올 때 Android 5 이상에서만 적용 가능했다.
오래된 버전은 support lib 을 사용해야 했다.
하지만 Compose lib 은 Jetpack component 로 들어가면서 platform 에 의존적이지 않게 된다.
2. All Kotlin API
기존에는 xml, Java/Kotlin 등을 이용해서 UI 를 만들고 control 했고, style, animation 등이 xml 형태로 UI 에 녹아들었다.
Kotlin 의 도입으로 xml 대신 선언적인 UI 를 정의하는 것이 가능해졌다.
3. Composable : 상속이 아닌 composition
기존에 custom UI 를 만드는 것은 쉽지 않았다.
View 를 상속해야 했고, 제대로 동작하기 위해서 많은 것들을 care 해야 했다.
TextView 의 경우 30k 라인의 코드를 가지고 있다.
그래서 내부 로직을 신경 많이 써야 한다.
하지만 Composable lib 은 compose 를 사용하기 때문에 이에 대한 고려가 많이 필요가 없어졌다.
4. 한 방향의 data flow
기존의 CheckBox 는 click 되면 checked = true 로 변경된다.
스스로 update 하고 listener 를 통해 이 변화를 notify 해준다.
그래서 앱 로직에서는, 예를 들면 ViewModel 에서는, state variable 을 두고 이 변화를 기록해두어야 했다.
이렇게 함으로써 checked state 에 대해서 2개의 복사본이 생긴다. 이는 에러를 양산해내기 쉽다.
ViewModel 의 state var 의 변화가 CheckBox 를 update 해야했고, 이는 무한 루프를 예견하기도 한다.
Compose lib 을 통해서라면 이는 쉽게 해결할 수 있다.
차이(변경)는 Compose framework 에 의해 다뤄지고, data model 은 Compose component 에 주입된다.
게다가 compose component 는 스스로 state 를 바꾸지도 않는다. 대신 listener 를 통해 노출만 한다.
state 에 대한 update role 은 app 이 가져간다.
5. 더 좋은 debugging
Kotlin 코드를 사용하도록 되어 있기 때문에, debugger 와 breakpoint 가 잘 작동한다.
* 추가 정보
Jatpack Compose 는 open source 이며 2개의 주된 컴포넌트를 가지고 있다.
하나는 Compose UI lib 이다.
이 녀석은 layout, input, text, animation, style, widget, graphics 등의 내용을 담은 UI toolkit core 이다.
둘째는 Compose compiler 로, custom Kotlin compiler plugin 이며, composable function 을 취해서 자동으로 UI hierarchy 를 update 하는 녀석이다.
composable function 을 만들기 위해서는 function 에 @Composable annotation 을 쓰면 된다.
참고 링크
https://bloggie.io/@_junrong/first-taste-of-android-jetpack-compose
