Android (83) 썸네일형 리스트형 3D 모델링으로 앱에 입체감 불어넣기 (feat.SceneView) 안드로이드에서의 그래픽 렌더링 원리와는 거리가 먼, 3D 렌더링 작업에 대한 제 나름의 이해를 거침없이 써내려간 포스트입니다. SceneView 에 대한 설명 및 코드는 포스트 후반부에 있으니, 해당 키워드를 통해 접근하신 분께서는 과감하게 스크롤을 내려주셔도 좋습니다.동기재직 중인 회사에서 전자 지갑 서비스를 구축하게 되었습니다. 관련하여 다양한 기술적 시도들이 진행되고 있는데, 모바일 팀 회의에서는 3D 모델을 앱 내에 탑재하여 트렌디함을 갖추자는 의견이 주요 목표로 설정되어, 이번 기회에 늘 생각만 해왔던 3D 모델링에 도전할 수 있게 되었습니다. 접근어떤 방식을 통해 3D 모델을 구현해야 할지 결정해야 했습니다. 가장 먼저 떠오른 것은 OpenGL 이었습니다. OpenGL 은 2D 및 3D 그래픽.. [Jetpack Compose] 동적 스켈레톤 적용기 동기여름에 시작했던 사이드 프로젝트가 끝을 향해 달려가고 있습니다. 비록 1차 개발 마무리이긴 하지만요. 아무튼, 이후로는 추가 기능 구현과 유지보수만 하면 돼서, 투입해야 하는 시간이 많이 줄어들 것 같아 다행입니다. 얼마 전, 대부분의 기능 구현이 끝나고 정리만 하던 시점에, 갑작스런 스켈레톤 추가 논의가 이루어졌습니다. 로딩과 관련된 다양한 UI 가 있는데, 화면 전체를 감싸는 형식의 UI 들이 대부분이라 사용자 입장에서 피로도가 있다는 것이 주된 근거였습니다. 이후 추가 구현이 확정되었고, 이에 대해 구현하여야 했습니다. 나이브 어프로치로서 if-else 구문 사용을 고려했으나, 기존 코드에 if-else 구문을 적용해야 하다 보니, 코드 깊이도 깊어지고 새로운 UI 코드도 작성해야 해서, 코드 .. [Jetpack Compose] SubcomposeLayout 으로 UI 배치 문제 해결하기 동기확실히 사이드 프로젝트를 하니, 다양한 문제에 부딪히고 이를 해결할 수 있는 기회가 자꾸 생겨서 좋습니다. 이번에 맞닥뜨린 문제 역시 진행 중인 사이드 프로젝트에서 발생했고, 별 고민 없이 해결할 수 있을 줄 알았으나, 또 다른 기술에 대한 이해가 있어야 우아하게 해결할 수 있는 문제였습니다. HorizontalPager 가 하나 있고, 각 페이지는 텍스트와 이미지가 포함된 Column 이 존재합니다. HorizontalPager 의 바로 아래에는 HorizontalPager 의 Indicator 가 있고요. 각 페이지에서 보여져야 하는 이미지는 비율이 각기 다르고, 그 위에 표시되는 텍스트가 차지하는 영역도 모두 다릅니다. 단순 고정 크기 Column 에 이미지의 weight() 를 설정하여 해결.. [Jetpack Compose] 커스텀 TooltipState 로 UX 개선하기 동기Jetpack Compose 에서는 툴팁을 사용해본 적이 없었는데요. 진행 중인 사이드 프로젝트에서 구현할 일이 생겨 사용해보게 되었습니다. UX 요구 사항은 해당 툴팁이 자연히 사라져서도 안 되고, 툴팁이 떠 있다고 해서 다른 컴포넌트와 상호 작용이 불가해서도 안 됩니다. 모바일 환경에는 Hover 기능이 없다보니, 대부분 버튼을 짧게 터치하거나 길게 터치했을 때 툴팁이 표시 되었다가 이후 다시 툴팁을 터치하거나 손을 떼었을 때 사라지게 되는 형태가 대부분인데요. 제가 구현해야 했던 것은 특정 상황에서 자동으로 표시되어야 했습니다. 사라지는 것도 해당 툴팁 내의 버튼을 터치했을 때에만 사라져야 하고요. 이와 같이, 보통의 툴팁과는 조금 다른 방식으로의 구현이 필요해 보였습니다.Jetpack Comp.. [Jetpack Compose] NestedScroll 로 UX 개선하기 동기새롭게 진행하게 된 사이드 프로젝트의 Figma 를 살펴보던 도중, 재미있는 UX 요구 사항이 있었습니다.메인 화면 하단에 약간 축소된 BottomSheet 가 있고, 그 내부에 Scrollable Column 이 있는 형태인데, 화면을 아래에서 위로 스크롤하면 BottomSheet 가 먼저 정해진 위치까지 확장되고, 그 뒤에 내부 Column 이 스크롤 되어야 한다는 것이었습니다. 반대로는 내부 Column 이 아래로 스크롤 된 이후 BottomSheet 가 축소되어야 하고요. Android View 시스템을 이용해서 이러한 사항을 구현하는 것은 그다지 어렵지 않았던 것으로 기억합니다. (CoordinatorLayout, NestedScrollView 를 적절히 조합해서 구현했던 것 같습니다) Je.. [Jetpack Compose] onGloballyPositioned 를 onLayoutRectChanged 로 대체하기 동기Google I/O '25 내용 중 가장 관심이 갔던 파트는 바로 Jetpack Compose 의 Visibility 파트입니다.Composable 이 화면에 표시되는 과정 전반에 걸쳐 적용할 수 있는 다양한 API 들이 소개되었습니다. 이 중 onLayoutRectChanged() 메서드는 기존에 존재하던 onGloballyPositioned() 메서드의 성능을 개선한 메서드로 소개가 되었는데요. onGloballyPositioned() 메서드를 종종 사용했던 기억이 나, 어떠한 원리로 이를 대체할 수 있는지에 대해 알아보았습니다.왜 onLayoutRectChanged() 는 효율적인가?Android 공식 문서를 살펴보면, onGloballyPositioned() 메서드보다 onLayoutRectC.. Appium + UiAutomator2 로 Android-Web 통합 테스트 자동화하기 동기재직 중인 회사에서 운영하는 대시민 서비스의 안드로이드 애플리케이션 일일 테스트를 맡게 되었습니다. 매일 아침, 앱 내의 모든 기능을 물리 디바이스에서 테스트하고, 그 결과를 엑셀 폼에 입력한 뒤 메신저로 공유하는 작업입니다. 처음에는 '아침에 정신도 차릴 겸 손으로 테스트해야겠다'고 생각했는데, 막상 해보니 한 시간 가까이 걸리는, 매일 아침마다 하기에는 매우 헤비한 작업이었습니다. 그도 그럴 것이, 전자 증명서 발급이나 QR 코드 스캔 등 테스트하기 복잡한 수많은 기능이 존재하기 때문입니다. 이틀 정도 진행하고 도무지 안되겠다 싶어, 자동화에 대한 허락을 구한 뒤, 이를 Appium 으로 자동화하였습니다. 오늘은 그 과정에 대해 기록하고자 합니다.Appium + UiAutomator2최초에는 안드.. [Jetpack Compose] Stability Configuration File 은 어떻게 동작하는가 동기Jetpack Compose 를 활용한 개발 도중, StableMarker 를 잘 작성해왔음에도 불구하고 화면 렌더링 시의 Janky Frame 이 발생하는 것을 확인했습니다. Jetpack Compose 외부 라이브러리가 그 원인이었는데, 내부 데이터 클래스에 StableMarker 가 작성되어 있지 않았기 때문입니다. 이를 해결하기 위해 Stability Configuration File 을 정의 및 적용 하였고, 이에 대한 문제를 해결할 수 있었습니다. 동작 과정에 의문이 생겼고, 이에 대해 학습했습니다. [Jetpack Compose] 불필요한 Recomposition 을 줄여 앱 퍼포먼스 개선하기동기 Jetpack Compose 를 활용하여 개발 중인 앱 에는 드래그 앤 드랍과 같은 유저.. 이전 1 2 3 4 ··· 11 다음
