본문 바로가기
반응형

JetpackCompose6

Nested Navigation 구현 및 총정리 # 중첩 Route Jetpack Compose 실제 앱을 만들다보면, Navigation Graph가 복잡해 지게 됩니다. 중첩된, 즉 nested navigation이 필요하기 때문인데요. 오늘은 Jetpack Compose 에서 Nested Navigation 을 구현하는 방법에 대해서 정리해 보겠습니다. 이 글을 이해하기 위해서는 Jetpack Compose Navigation 구현방법에 대해서 알고 있어야 하는데요. 이에 관해서는 아래 글을 참조해 주세요. >> Navigation 구현 방법 총정리 # Route Jetpack Compose 1. 라이브러리 Implementation 이 글에 나오는 코드를 구현하기 위해서, 아래 라이브러리들이 app레벨의 build.gradle에 implement 되어야 합니다. dependencies { d.. 2023. 5. 26.
BackHandler 에 대한 정리 # 유저가 Back 버튼 누를 때 Jetpack Compose 오늘은 Jetpack Compose 에서 유저가 백버튼을 누를 때, 구현해야 하는 코드를 넣는 부분인 BackHandler 에 대해서 정리해 보겠습니다. 1. BackHandler BackHandler는 Compose의 탑레벨 Composable 함수인데요. 유저가 시스템의 back button을 눌렀을 때, 이벤트를 핸들링 할 수 있는 곳 입니다. 코드로 보도록 하겠습니다. 보다시피 람다블록에 코드만 넣어주기만 하면 되기 때문에 정말 쉬워보입니다. @Composable fun MyScreen() { BackHandler(onBack = { println("Back button pressed") }) } 2023. 5. 11.
mutableStateOf 와 MutableStateFlow 비교 총정리 # collectAsState Jetpack Compose UI의 중심에 있는 Concept가 State 인데요. mutableStateOf 와 MutableStateFlow를 이용하면, mutable (가변)의 State 값을, 관찰해서 값의 변화에 따라 UI 나 혹은 다른 로직의 변형을 줄 수 있습니다. 오늘은 이 둘의 차이에 관해서 정리해 보겠습니다. 1. mutableStateOf mutableStateOf에 관해서는 공식문서에 자세히 설명이 되어있는데요. 관찰될 수 있는 MutableState를 생성해주는데, 이 타입으로 된 값이 변경될 때마다, 컴포저블이 다시 recompose 되도록 한다고 되어있습니다. 즉, 값에 따라서 Composable UI의 변경을 주어야 할 때 사용하기에 적합합니다. 사용방법은 아래와 같은데요. .. 2023. 4. 23.
collectAsState 로 Flow 타입 데이터 받기 구현 방법 # Jetpack Compose 오늘은 collectAsState 로 Flow 타입 데이터를 받는 것을 구현하는 방법에 대해서 정리해 보도록 하겠습니다. 1. CollectAsState 구현 collectAsState 을 사용하게 되는 시나리오에 대해서 정리해 보겠습니다. RoomDB등을 이용한 Repository에서 Flow타입의 데이터가 흘러나온다고 가정해 보겠습니다. 이 때 viewModel에서 해당 데이터를 받습니다. 그리고 Jetpack Compose UI 에서 그 데이터를 collectAsState형태로 받게 됩니다. 하나씩 보도록 하겠습니다. 1-1. Repository 에서 흘러나오는 데이터 관찰 먼저 roomDB에서 아래와 같은 Repository가 있다고 가정해 보겠습니다. flow는 비동기적으로 데이터의 강을 obs.. 2023. 4. 10.
Jetpack Compose 에서 자간 줄이는 방법 # letterSpacing 오늘은 Jetpack Compose 에서 자간을 줄이는 방법을 정리해 보도록 하겠습니다. 1. 자간 조절하기 Jetpack Compose 에서는 자간을 줄이기 위해서, letterSpacing 값을 수정해 주어야 하는데요. 이때 사용하는 타입이 TextUnit 입니다. 이 TextUnit 은 아래와 같이, sp나 em 단위를 사용하여 생성할 수 있습니다. 저희가 fontSize를 지정할 때 쓰는 단위와 같이 사용하시면 된다는 것이지요. 2. 자간 줄이기 이제 자간을 줄여보도록 하겠습니다. 여기서는 -1.sp 만큼의 자간을 줄여서 글자간격이 서로 달라붙도록 할 텐데요. 참고로 마이너스 값을 사용하기 위해서 앞뒤에 괄호를 붙여서 사용하였습니다. 2023. 3. 21.
Time Picker 와 Date Picker Compose 로 구현하기 # Android Jetpack Picker 오늘은 Jetpack Compose로 Time Picker 와 Date Picker 를 구현하는 방법에 대해서 정리해 보도록 하겠습니다. 이 글에서 사용하는 API는 특별히 Jetpack Compose 만의 API는 아니구요. 예전부터 사용되던 API인데, ComposeUI에서 가져다가 State에 저장해서 사용하는 방법입니다. 언젠가는 구글에서 JetpackCompose만의 API가 나올지도 모르겠지만, 아직은 기존의 API를 가져다가 사용해야 합니다. 1. TimePicker 1-1. TimePickerDialog API TimePicker Dialog는 API1부터 존재해오던 API입니다. 이 클래스의 생성자를 보면, 다음과 같이 OnTimeSetListener 콜백을 넣어주어야 한다는 것을 알 수.. 2022. 10. 31.