Android (76) 썸네일형 리스트형 [Jetpack Compose] MinimumInteractiveComponentSize 동기디자인 파트와의 협업을 진행하다 보면, 툴팁 표시 등의 기능을 위한 UI 가 다소 작게 구성되어 있는 경우가 왕왕 있습니다. 이러한 경우, Jetpack Compose 는 자동으로 터치 영역을 확장하여 UX 를 개선하도록 구현되어 있습니다. 어떠한 방식으로 이러한 개선이 이루어지는지, 별도로 활용할 수 있는지, 이를 해제하고 싶다면 어떻게 하면 좋을지 등을 학습하고, 정리하고 싶어 포스트를 작성합니다.개요머티리얼 디자인 시스템의 규칙을 따라, 위젯은 최소 48dp 의 터치 영역을 확보하는 편이 좋은데요. Android View System 에는 이에 대한 자체 처리가 안 되어 있어, 마켓에 앱을 올리면 이에 대한 경고를 주기도 합니다. Jetpack Compose 에는 이를 간편히 만족시킬 수 있도록.. [Jetpack Compose] UI 테스트 작성하기 동기최근, 성장이 더딘 느낌을 받고 있습니다. 지식을 습득하고 쌓는 일은 소홀히 하지 않고 있지만, '내가 개발한 애플리케이션이 과연 훌륭한 애플리케이션인가' 라는 의문을 지울 수 없습니다.좋은 애플리케이션은 견고한 구조, 그 이상의 추상적인 의의가 필요하다고 생각합니다. 저는 그것이 '좋은 유지보수성' 과 '테스트 용이성' 이라고 생각합니다. 이를 위해서는 테스트 코드가 필수적이라고 할 수 있습니다. 유닛 테스트를 작성하는 것에는 업무를 통해 꽤나 익숙해졌지만, 여전히 UI 테스트에 대한 두려움이 남아 있었고, 이제는 이에 도전하여 한 걸음 더 성장하는 것이 필요한 시점이라고 느꼈습니다. 오늘은 사내에서 개발한 라이브러리가 적용된 샘플 애플리케이션을 개발하며 UI 테스트에 도전해보고, 이에 관한 내용을.. UiEffect 를 위한 Channel<T> 사용법 동기저는 안드로이드 관련 지식을 Medium 에서 주로 얻곤 하는데요. MVI Architecture 적용 시 UiEffect 의 구현을 위해 SharedFlow 대신 Channel 을 사용하는 방식에 관한 컬럼을 보게 되었습니다. 사실, ViewModel 과 Screen-Level-Composable 은 1:1 대응 되는 경우가 많은데, 왜 굳이 SharedFlow 를 사용해야 하는지에 대한 의문이 항상 남아 있었습니다. 오늘은 해당 컬럼에서 얻은 지식에 관해 정리하고자 합니다. UiEffectMVI Architecture 를 안드로이드 프로젝트에 처음 적용하려고 하면 마주하는 문제가 있습니다. 바로 UiState 를 변경하지 않고, 애플리케이션에 특정한 액션을 취해주어야 하는 상황에 대한 처리인데요... 안드로이드의 MVI 와 Reducer 동기신규 프로젝트에 단독 투입되어 안드로이드 앱 개발을 수행하게 되었습니다. Jetpack Compose 와 MVI Architecture 로 앱을 구현했고, 이후 사수분께서 코드에 대한 설명을 요청하셨습니다. Screen-Level-Composable 에서 받은 UiEvent 를 ViewModel 로 전달하는 코드의 구현에 대한 설명을 드렸고, 참고 하시라고 Reducer 관련 컬럼을 몇 개 전달했는데, 저에게도 많은 도움이 되어 이에 대해 정리하고자 합니다. ReducerReducer 는 React 애플리케이션의 상태 관리 프로세스로 잘 알려져 있습니다. Reducer 는 현재 상태와 액션을 결합하여 새로운 애플리케이션의 상태를 반환하는 순수 함수를 일컫습니다. 즉, 함수형 프로그래밍이 가능한 언어에.. [Jetpack Compose] composed {} 와 Modifier.Node 로 Modifier Chain 최적화하기 동기Jetpack Compose 를 사용해서 UI 를 개발하다 보면, Modifier 의 확장 함수를 구현하여야 하는 경우가 더러 있습니다. 불필요하게 길어지는 Modifier Chaining 을 방지하기 위해서나, 자주 사용하게 되는 Modifier Chaining 을 함수화 하여 사용하기 위해서 입니다. 별도의 지식 없이 Modifier 확장 함수를 구현하면 IDE 에서 이런 저런 주의를 주며 자동 코드 편집을 지원해 주는데요. 별 생각 없이 기능을 이용하고 코드를 그대로 두기 보다, 자세히 학습하여 사용하는 편이 추후에 발생할 가능성이 있는 문제를 해결하는 데에 큰 도움이 되리라 생각하여 학습하게 되었습니다. Modifier 와 확장 함수Jetpack Compose 로 UI 를 구현할 때에 가장 중.. LazyList 과 RecyclerView 의 메커니즘 알아보기 동기'RecyclerView 와 LazyColumn 의 공통점과 차이점에 대해서 얘기해 주세요'현재 재직 중인 기업의 면접 질문이었습니다. 당시에는 '다량의 데이터 셋을 효율적으로 표현하기 위한 컴포넌트이며, Android View System 과 Jetpack Compose 각각 나름의 최적화가 이루어져있어 비교적 적은 리소스를 소모한다는 공통점이 있습니다. 차이점은 잘 모르겠습니다.' 라고 대답했던 기억이 있습니다.당시에 힌트를 주셨는데, 최적화 부분에 있어서 사소한 차이점이 있다고 하셨습니다. 결국 대답은 못했고요.입사한지 한 달 정도 지난 시점에서, 이 질문에 대한 답변을 생각해보게 되었습니다.RecyclerViewRecyclerView 는 Anndroid View System 기반의 UI 구현 .. [Jetpack Compose] CompositionLocal 로 이벤트 처리하기 동기 Jetpack Compose 를 활용하여 UI 를 개발하다 보면, Composable 의 테스트 용이성과 재사용성을 높이기 위해 StateHoisting 을 적용하곤 합니다. 제 경우, StateHoisting 을 엄격하게 적용하려다 보니 수많은 람다 파라미터로 인해 Composable 메서드를 호출하는 부분이 과도하게 길어지고, 드릴링이 발생하는 문제가 있었습니다. 저는 이를 CompositionLocal 을 통해 해결하였고, 오늘은 이에 대해 간략하게 작성해보려 합니다. Stability 불필요한 Recomposition 의 발생을 최대한 줄이기 위해 이벤트 처리와 관련된 로직을 Stable 하게 만들어야 합니다. 이에 관한 내용은 아래에서 확인하실 수 있습니다. [Jetpack Compose].. [Jetpack Compose] 불필요한 Recomposition 을 줄여 앱 퍼포먼스 개선하기 동기 Jetpack Compose 를 활용하여 개발 중인 앱 에는 드래그 앤 드랍과 같은 유저 인터랙션이 존재합니다. 다만 문제가 좀 있었습니다. 드래그 앤 드랍 시 화면이 버벅거린다는 점이었고, 이는 매우 치명적인 문제였습니다. 이를 해결하기 위해 다양한 솔루션들을 시도해보았고, 끝내 효과적인 방법 두 가지를 알게 되었습니다. Jetpack Compose 로 UI 를 구현하였지만 앱의 퍼포먼스 저하를 경험하고 계신 분들께서는 지금부터 기술할 방법들을 적용해보시면 좋을 것 같습니다. 권장사항 권장사항 준수 | Jetpack Compose | Android Developers 권장사항 준수 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. 발생할 수 있는 일반적인 Compose.. 이전 1 2 3 4 ··· 10 다음
