본문 바로가기

UI/UX

(2)
[Android/UI-UX] 텍스트의 일부에 스타일 및 터치 이벤트 설정하기 안드로이드 TextView에 적용하는 Text의 일부의 스타일을 바꾸고, 터치 이벤트도 주고 싶다면 어떻게 해야 할까? Spannable Text로 이를 해결할 수 있다. 1. 적용하고자 하는 string을 toSpannable()을 사용해 Spannable로 만든다. 2. setSpan으로 적용할 Span을 필요한 만큼 설정한다. 클릭 이벤트를 주고 싶다면 ClickableSpan을, 텍스트 스타일을 변경하려면 TextApperanceSpan을 사용한다. 3. 설정이 완료된 Spannable을 적용하고자 하는 TextView의 text에 설정하면 된다. val textView: TextView val sampleString = "Clickable and styleable" val clickableSpa..
[안드로이드] ConstraintLayout + CollapsingToolbarLayout 활용해 접히는 TabBar 구현하기 뱅크샐러드 및 야놀자 등 상단 탭영역이 접히는 UI/UX를 프로젝트에 적용하고자 했다. 구현을 위해 고르게 된 layout은 CollapsingToolbarLayout으로, 이름은 Toolbar로 딸려있지만 컴포넌트들을 추가해 툴바 이상의 요소들을 보여줄 수 있는 걸 확인할 수 있었다. 처음에는 레이아웃 코드 적용 후에도 동작이 되지 않거나, 스와이프 중 뷰가 제대로 접히지 않고 따로 논다던지 등의 이슈가 있었는데, 이하 문제들을 해결하면서 적용한 요소들을 정리를 해두고자 한다. 이번 구현에 있어 공식문서 외에 실구현 사례들을 레퍼런스로 삼아 차이점이 존재할 수 있으니, material.io에 나와있는 공식문서를 참조하는 것도 좋을 것 같다. Collapsing Toolbars - Material Com..