안드로이드/레이아웃 구현과 활용 (8) 썸네일형 리스트형 [Android] Slider를 활용한 가격 설정 적용기 근무중인 커머스 서비스에 가격 필터를 개선하게 됐습니다. 기존에는 가격대별 버튼 + Edittext 로 가격을 설정 했었고 개선되는 버전엔 Slider + Edittext 로 가격을 설정하도록 변경 됐습니다 정말 개선 되었는가 ? 평소 설계서를 공유 받는 자리에서 제 경험을 토대로 유저 입장에서 솔직하게 피드백 하는데 슬라이더를 사용해 가격 조정 하도록 개발해본적도 없고 실제 서비스에서도 접해본적 없다보니 별다른 피드백을 할 수 없었고 그대로 개발에 착수하게 됐습니다. 어떤 슬라이더를 선택할 것인가? 2가지 전제조건이 있었습니다. 상품 리스트 조건마다 최저 금액과 최대 금액이 다름 최저, 최대 금액에 따라 금액을 조절할 수 있는 간격이 다름 위 전제조건이 까다롭지 않다고 생각하여 기본 RangeSlide.. [Android] 룰렛 구현하기 최근에 [점메추] 앱에서 메뉴를 추천하기 위한 방식중 하나로 개발을 했는데 아쉽게 실 버전엔 포함되지 못했습니다. 결과 화면 개발 방식 라이브러리도 있지만 커스텀하기 용이한 점과 개발 해보고 싶었던 마음이 있어 캔버스에 직접 그리는 방식으로 했습니다. Roulette.kt 룰렛을 한 화면에서만 사용하지만 관리가 용이해 커스텀 뷰로 만들었습니다. @SuppressLint("DrawAllocation") override fun onDraw(canvas: Canvas?) { super.onDraw(canvas) if (canvas == null) return val rectLeft = left + paddingLeft + Constant.DEFAULT_PADDING val rectRight = right - .. [AOS] 토스 하단 버튼 애니메이션 구현하기 앱 개발을 하다보면 '00처럼 해주세요'를 많이 듣게 됩니다. 같은 부류의 후발주자가 아닌데도 그런 얘기를 많이 듣는 이유는 많은 사람들이 그 앱을 사용하고 있고 그로 인해 좋은 경험을 했기 때문이 아닌가 생각합니다. 저는 개발자로서 디자이너가 요청한 UI는 최대한 수용해주고자 하는데 제가 봐도 이해되지 않는 UI가 아닌 이상 디자이너의 생각을 실현해주는게 개발자의 역할중 하나라고 생각하기 때문입니다. 참고 화면 제가 구현하는 화면은 토스처럼 정보수정 화면 아니였지만 하단에 버튼이 있고 스크롤이 가능하고 입력폼이 있는 화면이였습니다. 그리고 사용자 경험이 많이 발생하는 화면은 아니였지만 간단한 화면이라도 사용자에게 좋은 경험을 줄수 있다면..시간을 투자해야죠! 분석 어려운 애니메이션은 아니지만 명확하게 .. [AOS] TextView에 Auto size 적용하기 textview에 auto size를 적용시 한정된 영역에 글자를 모두 담지 못할 경우 사이즈가 줄어 드는 원리기 때문에 원칙적은 width / height를 고정 해줘야합니다. ( 구글은 wrap_content 비권장 ) 하지만 height를 고정하면서 글자가 짤리지 않고 불필요한 여백을 갖지 않게 하는건 번거롭기 때문에 wrap_content를 사용하고 maxLines를 1로 지정해주면 됩니다. - autoSizeTextType : uniform으로 지정 - autoSizeMinTextSize : 작아질 최소 사이즈를 지정합니다. - autoSizeStepGranularity : 영역에 넘칠 경우 크기를 줄일 단위를 지정합니다. ( 위 코드는 1dp씩 줄어듬, 클수록 부자연스러움 ) - autoSiz.. [AOS] 무한 롤링 배너 구현 일정 아이템들이 무한으로 흐르는 배너를 구현하게 됐습니다. 위 앱은 솔드아웃 앱으로 상단 프로모션 밑에 각종 상품들이 유저 액션 없이도 흐르는걸 볼수 있는데 이와 같은 UI를 Recyclerview를 이용하여 구현 했습니다. | ListApdater.kt 다른 무한 스크롤과 동일하게 실제로 무한은 아니지만 무한처럼 보이게 하기 위해 ItemCount를 'Int_MAX_VALUE'로 설정합니다. 'position % items.size' 로 매 아이템이 반복됩니다. class ListAdapter: RecyclerView.Adapter() { private val items = listOf() inner class ItemViewHolder(private val binding: ItemBinding): R.. [And] 달력 만들기 - recyclerview 활용 달력을 5번정도 구현했는데, 그때마다 '어떻게 하면 조금 더 효율적일까'를 고민했고 최근에 식물일기에 달력 기능을 추가할때도 고민했습니다. 혹시 다음에 또 구현하게 된다면 보다 빠른 의사결정을 위해 포스팅합니다. 본 포스팅은 달력을 구현하는데 있어서 방향성을 잡는데 도움이 되도록 작성했습니다. ( Gridelayout으로 만든 시간표 포스팅도 구경하고 가세요 ! ) | 달력 레이아웃 구현 달력에는 매번 스와이프 기능을 넣었기 때문에 viewpager는 기본으로 하고, 세부 UI 구현은 크게 3가지로 나눠볼 수 있습니다. 1. Recyclerview로 만듬 2. textview로 하나씩 모두 그림 2-1. customView로 만들어서 사용 ( 또는 달력 전용 fragment ) 2-2. 구현하는 엑티비티.. [AOS] TextView가 2개 붙어 있을때 앞에 ellipsize 옵션 적용하기 작성 일지 - 초안 작성 : 20.3.4 - 내용 추가 : 21.11.25 ( 텍스트뷰가 둘다 가변 적일때 ) 요즘 ConstraintLayout을 기본적으로 사용하다보니 크고 작은 이슈들이 자주 발생합니다. '아 이게 안되나?' 싶어서 찾아보고 정리합니다. 먼저 ConstraintLayout에 대한 포스팅은 다음 글을 참고해주세요 ( 초기 작성시 간단하게 작성하여 추가 코멘트를 남겨야하는데..언제하나 ) [안드로이드/Android] Constraint Layout Constraint(제약) Layout은 다른 요소와 관련지어 위치와 크기를 조절할 수 있도록 개발되었으며 Relativelayout보다 더 유연하게 뷰그룹을 만들 수 있습니다. 기존에는 LinearLayout과 RelativeLayout 2.. [안드로이드/Android] Brunch 메인 UX 구현하기 안녕하세요 이번 포스팅은 '브런치 메인 UX 구현하기' 입니다. 이번 포스팅을 계기로 주기적으로 현재 서비스중인 앱들을 분석해 구현해보는 포스팅을 종종 올릴 예정입니다! 혹시 댓글로 신청 해주시면 다음 포스팅은 신청받은 앱으로 진행하겠습니다! 브런치 앱 다운받기 - >링크 브런치(Brunch)란? 브런치는 2017년 구글이 선정한 올해를 빛낸앱 소셜부문 최우수상을 수상한 앱으로 좋은 글을 구독할 수 있는 앱입니다. 다음 카카오에서 서비스중인 앱입니다. 분석하기 분석이라는 단어가 과분하긴 하지만, 구현할 메인 UX 부분을 살펴볼 필요는 있습니다. ( 직접 작성하신 글이라서 모자이크 처리 했습니다. ) 앱을 다운받아서 보신분들이나 기존에 사용중이신 분들은 아시겠지만, 메인의 글 목록을 살펴보는 UX로 Ver.. 이전 1 다음
