SlotTable이란?Jetpack Compose의 UI 트리를 저장하기 위한 자료구조처음 이 정의를 접하면 두 가지 의문이 생긴다. UI 트리가 무엇인지? 그리고 왜 이걸 별도로 저장해야 하는지다. 이에 관해 하나씩 알아보자 Compose 코드를 작성하면 `Compose Compiler`는 이 코드를 해석해 결과적으로 다음과 같은 계층 구조를 만들어낸다.Column { Text("안녕") Row { Text("페토") }}// UI TreeColumn├── Text("안녕")└── Row └── Text("페토")Compose는 상태가 바뀌면 해당 컴포저블을 다시 실행해 화면을 업데이트하며 이것을 리컴포지션(Recomposition)이라 한다. var count by ..

Jetpack Compose를 사용해 UI를 그릴 때 우린 당연한 것처럼 @Composable을 사용해 왔다. 하지만 @Composable 어노테이션이 정확히 어떤 원리로 화면을 그리며, 일반 함수와는 어떤 차이가 있는지 알지 못한다. 이 글에선 @Composable 어노테이션이 함수에 어떤 특성을 부여하는지, Compose Runtime이 이 특성을 어떻게 활용하는지를 하나씩 살펴볼 것이다.Composable 함수의 의미Composable 함수는 실행 시 자신의 정보를 메모리 속 트리에 노드로 기록하는데 이를 Compose 관용어로 "방출(emit)"이라고 한다. @Composablefun Greeting(name: String) { Text(text = "Hello, $name!")}위 함수가 ..

서론처음 설치한 앱은 실행하면서 코드를 그때그때 컴파일하기 때문에 처음 몇 번은 느리고 쓸수록 빨라진다. Baseline Profile을 사용하면 중요한 코드를 첫 실행 전에 미리 번역해 두므로 설치 직후부터 빠른 성능을 낼 수 있는데, Baseline Profile의 원리를 이해하기 위해 기초적인 개념부터 시작해 하나씩 이해해 보겠다.안드로이드 앱이 실행되기까지의 과정컴파일이란?컴파일이란 사람이 이해하는 고수준 언어(e.g kotlin, java...)를 컴퓨터가 이해할 수 있는 0과 1로 이루어진 저수준 언어(기계어)로 번역하는 과정을 말한다. 코틀린으로 작성한 코드가 스마트폰에서 실행되려면 총 3단계를 거친다.1단계 : Kotlinc Compile개발자가 작성한 코틀린 코드(.kt) 파일은 컴퓨터가..

픽셀픽셀(Pixel)은 Picture Element의 줄임말로, 디지털 이미지를 구성하는 최소 단위다. 각 픽셀은 빨강(R), 초록(G), 파랑(B), 투명도(A, Alpha) 네 가지 채널로 표현되며 각 채널은 0~255 범위의 값을 1byte로 저장한다. 따라서 ARGB_8888 포맷 기준으로 픽셀 하나는 4byte를 차지한다. ARGB_8888이 포맷에 대해서는 추후 자세히 다루겠다.색상RedGreenBlueAlpha빨강색25500255파란색00255255흰색255255255255투명0000비트맵비트맵(Bitmap)은 이 픽셀들이 압축 없이 메모리에 펼쳐진 형태다. JPEG, PNG 같은 이미지 파일은 압축된 상태로 저장되지만 화면에 렌더링 하기 위해서는 반드시 Bitmap으로 디코딩해야 한다. 때..

현재 개발 중인 앱에서 사진을 촬영하고 서버에 업로드하는 과정에서 사진이 회전되는 문제가 발생했다. 함께 개발 중인 페어께서 이 문제를 발견하셨고 "회전 메타 데이터 활용해서 사진 안 돌아가게 수정해 주세요"라는 요구 사항을 전달받았다. 이와 관련된 내용을 조사하던 중 Exif 태그라는 것의 존재를 알게 되었고 이를 활용해 문제를 해결한 방법을 소개하고자 한다.기존 코드촬영된 이미지를 서버에 업로드하기 위해 Uri 형태의 이미지를 ByteArray로 변환하는 방식을 사용했다. UI Layer에서 사용의 편의를 위해 Context의 확장함수로 선언했으며 이 함수는 Android 시스템이 제공하는 Uri를 실제 이미지 데이터로 읽어 들인 뒤 ByteArray로 압축 변환하여 반환한다. 동작 과정은 다음과 같..

서론디자이너와 협업 시 가장 중요한 것은 디자이너가 의도한 디자인을 정확하게 구현하는 것이다. 특정 텍스트가 어떤 폰트를 사용해야 하는지, 글자 크기는 얼마인지, 자간과 행간은 어떻게 적용되어야 하는지까지 세세하게 정해져 있다. 같은 스타일의 텍스트를 구현하면서도 매번 폰트나 크기, 행간이나 자간을 다시 설정해야 하고 화면이 많아질수록 이러한 작업은 반복되어 개발 생산성이 점점 저해된다. 이러한 불편함을 줄이기 위해 디자이너가 설계한 디자인을 기준으로 재사용할 수 있는 시스템을 만드는 것이 바로 디자인 시스템이다. 디자인 시스템을 도입하면 디자이너의 요구사항을 일관된 방식으로 반영할 수 있고 이미 정의된 시스템을 활용해 보다 안정적으로 화면을 구현할 수 있다. 오늘은 실제 프로젝트에서 사용한 디자인 ..

갑자기 새로운 버전을 배포한 앱이 크래시 되는 일이 발생했습니다. Firebase Crashlytics를 확인한 결과 다음과 같은 에러가 발생하고 있었습니다. 원인은 단순했습니다. ViewModel에 @HiltViewModel을 Activity에 @AndroidEntryPoint를 추가하지 않았기 때문이었죠. 하지만 여기서 의문이 생겼습니다. "Hilt는 컴파일 타임에 의존성 주입 코드를 생성해서 런타임 에러를 방지한다고 알고 있는데 왜 컴파일은 성공하고 런타임에 크래시가 발생한 걸까?" 이 의문을 해결하기 위해 ViewModel의 기본 작동 원리부터 Hilt가 어떻게 ViewModel을 주입하는지 차근차근 알아보겠습니다.Hilt 의존성 주입"Hilt는 컴파일 타임에 의존성 관계를 분석하여 의존성 주입..

Activity의 생명주기, Fragment의 생명주기, ViewModel의 생명주기까지 안드로이드를 조금이라도 공부해 본 사람들이라면 이 내용에 대해 당연히 들어봤고 한 번쯤은 공부해 봤을 것입니다. 하지만 View의 생명주기는 어떨까요? 필자는 다른 컴포넌트들의 생명주기에 비해 유독 View의 생명주기가 어렵게 느껴졌기 때문에 이를 조금이라도 쉽게 풀어 소개해보고자 합니다. 먼저 View의 생명주기에 대해 알아보겠습니다. View가 화면에 보이기까지는 크게 4단계를 거칩니다onAttachedToWindow() : 화면 준비 완료 !onMeasure() : 내 크기는 얼마나 필요해 ?onLayout() : 내 자리는 어디야 ?onDraw() : 이제 그린다 !onAttachedToWindow( ) 뷰가..