전체 글 (150) 썸네일형 리스트형 [Compose] Parents View의 크기를 구해 자식뷰에 적용하기. Compose를 사용하여 UI를 그리다 보면, 생각보다 유동적인 뷰를 갖고 있는 UI를 그리는 경우가 많다. 기본적으로 Column, Row를 사용하는 경우에는 유동적인 View라고 하더라도 쉽게 구현이 가능하지만, Box를 사용하게 되면 생각보다 까다로운 점들이 많이 생긴다. 필자는 업무를 진행하다보니 Box Layout 내부에 있으면서 유동적인 데이터에 따라서 별도의 뷰를 또 그려야 하는 상황을 자주 마주쳤다. 이때, 어떻게 꼼수를 써가면서 구현을 하다가 막히는 케이스가 발견되어 다른 방법을 찾아보다 부모의 뷰의 크기를 구하여 적용하는 방법을 찾아내어 적용하였다. 해당 방법을 사용하기 위해서는 fun Modifier.onSizeChanged 해당 Modifier 함수 하나만 사용하면 된다. 해당 함수.. [WebView] Compose 환경에서 WebView로 Youtube를 넣어보자. 필자가 Compose 환경에서 WebView를 통해 Youtube를 넣는 작업을 하면서 만났던 이슈와 해결 방법을 기술해보고자 한다. WebView를 보여줄 때 생각지도 못한 부분에서 이슈가 생겼었고, 생각보다 UX 면에서 크리티컬 하다고 느꼈던 이슈들이기 때문에 추후에도 도움이 될 것이라고 생각이 된다. 우선, Compose 환경에서 Webview를 사용하기 위해서는 Gradle에 다음과 같은 라이브러리를 포함시켜줘야 한다. implementation "com.google.accompanist:accompanist-webview:$version" Compose 환경에서 Webview를 사용할 때, 기본적으로 세팅해야하는 부분은 Compose가 아닌 케이스에서 Webview를 사용하는 것과 일치한다. 2.. [Compose] Flexbox Layout를 구현해보자. 필자가 실무를 경험하면서 유용하게 사용했던 UI Component 중 Flexbox Layout이라는 것이 있다. FlexBox Layout은 UI에서 아이템의 개수, 크기가 다를 때 디바이스 크기에 맞춰 한 라인에 보여줄 아이템의 개수를 정해주고 라인을 바꾸어 아이템을 보여주는 것이다. 이러한 특성을 띄고 있기 때문에 주로 해시태그 와 같은 UI를 그려줄 때 많이 사용한다. 이런식으로 말이다. 해시태그라고 하여 텍스트만 생각할 수 있지만 이미지 같은 것들도 많이 사용하곤 한다. 위와 같이 그려주기 위해서는 어떻게 해야 할까? 코드는 생각하지 않고, 단순하게 생각해 보면 다음과 같다. 추가할 아이템의 크기 (width, height)를 구한다. 아이템을 추가했을 때 그려줄 영역을 초과하는지 계산한다. 초.. [Compose] Modifier Extension - 클릭 이벤트 효과 방지, 다중 클릭 이벤트 방지 필자가 Compose를 실무에서 사용하면서, 가장 자주 사용하는 두 가지 Click Event 유틸을 소개하고자 한다. 첫 번째로는 클릭 이벤트 효과를 없애주는 것, 두 번째로는 다중 클릭 이벤트를 방지해 주는 것이다. 이 두가지 유틸은 한번 작성해 두면 수정 없이 사용이 가능할 뿐 아니라, 항상 사용하기 때문에 Compose로 개발을 하는데 큰 도움이 되지 않을까 생각한다. 기본적으로 버튼과 같은 경우 클릭 이벤트 효과. RippleEffect가 존재하기 때문에 원하지 않아도 클릭되었다는 것을 명시적으로 보게 된다. 하지만, 실무에서 서비스를 만들다보면 클릭 이벤트 효과가 있는 것이 더 어색하고 이상한 케이스가 많기 때문에 클릭 이벤트에는 늘 해당 유틸을 적용시켰다. 따라서, Modifier에서 적용할.. [Compose] Keyboard Issue in LazyColumn TextField 필자가 Compose를 사용하던 도중 만났던 문제 중 하나로, LazyColumn 안에 TextField Component가 존재할 때 Keyboard가 정상적으로 보이지 않았던 문제가 있다. 처음 해당 문제를 발견했을 때는 단순히 LazyColumn에서 Focus를 잘못 잡는다던지, 아니면 Recomposable이 일어나는 과정에서 Keyboard에 들어갔던 Focus를 잃어버렸기 때문에 발생한 문제라고 파악을 했었다. 문제가 발생하는 경우는 아래의 영상과 같다. 결과부터, 해결책부터 말하자면, Compose에서 자체적으로 갖고 있던 문제였고 1.4.0-alpha04 버전 이후로 해결이 되었으며 해당 버전 이후의 버전으로 사용하면 위와 같은 이슈는 발생하지 않는다. 이번 글에서는 Compose 1.3... [Android] Compose Sample Project에서 겪은 Version 문제 해결 방법과 순서 오랜만에 블로그 글을 작성하기 앞서, 기존에 작성했던 프로젝트들을 한번 둘러보았다. 둘러보던 도중, Compose Sample Project가 정상적으로 Build 되지 않았고, 해당 문제는 다양한 Version이 낮아 발생하는 이슈로 빌드가 되지 않았다. 따라서, 해당 프로젝트가 정상적으로 빌드되기까지 진행했던 작업들에 대해 기록해두고자 한다. Compose의 버전을 올림으로서 발생하는 Compose syntax Error를 제외하고, 일반적으로 IDE 환경에서 발생할 수 있는 이슈들이라고 생각이 되었고, 필자와 마찬가지로 낮은 버전에서 버전을 올릴 경우 최소 아래 기술한 내용들을 모두 체크하고 작업해야 하므로 이후 작업에도 도움이 될 것이라고 판단하였다. Sample Project를 가져와서 다시 빌.. [Android] SDK31 외부 Library Export 설정 변경하기 올해 11월부터 TargetSDK를 31로 올리지 않으면 업데이트를 할 수 없다는 공지가 나왔고, 11월로 명시되어 있지만 유예 기간으로 한 달을 준 것 인지 필자는 12월 업데이트부터 해당 항목이 적용되어 TargetSDK 버전을 올리는 작업을 진행하게 되었다. 기존 회사에서 사용하던 레거시 라이브러리를 건들지 못하고 방치하고 있었는데, 이번에 버전을 올리면서 관련한 이슈가 발생하여 해결하는 방법을 짧게나마 남겨두려고 한다. TargetSDK 버전을 31로 지정함에 따라 가장 많이 수정되는 부분이 Export 설정과 PendingIntent에 대한 Flag 설정인 것 같다. 여기서 PendingIntent의 경우 관련된 코드에 Flag를 추가/수정해주며, PendingIntent를 사용 중인 라이브러리.. [Android] RecyclerView Drag and Drop 회사에서 개발 업무를 진행하다, 요구사항에 맞춰서 아이템의 순서를 Drag & Drop으로 변경할 수 있도록 개발해야 했다. iOS의 경우에는 이런 이벤트를 쉽게 moveRow라는 것을 통해서 구현할 수 있다고 하는데, 안드로이드에서는 이벤트를 직접 구현하여 적용시켜야 했다. 구글링을 통해 방법을 찾아서 기능 구현을 진행했고, 그 방법에 대하여 작성해보고자 한다. 구현의 순서는 다음과 같다. 1. ItemMoveEvent Class를 만든다. 2. Activity에서 적용할 RecyclerView에 Event를 적용시킨다. 3. Adapter에서 아이템이 이동될 때의 처리를 해준다. 아주 간단하게 Drag & Drop에 대한 이벤트를 구현할 수 있어 보이지만, 관련된 정보를 찾는 것에 시간이 생각보다 오.. 이전 1 2 3 4 5 6 ··· 19 다음
