# Time Picker

3개의 포스트

Android timepicker 분(minute)부분 움직였을 때 시(hour)부분 고정하기

블로그 전 게시물에서 timepicker 버전에 따른 오류를 작성한 바 있다. 그에 이어서 분을 움직여서 60이 넘어가면 시간이 1씩 증가하게 설계되어있는데 이를 막는 것을 소개하고자 한다. Time Interval을 설정하기 위해 해당코드를 작성하였는데 여기에 단순히 setOnValueChangedListener(null)코드만 추가해주면 분을 아무리 움직여도 시간부분이 변하지 않는다. > 참고 : https://velog.io/@wjdwns/custom-timepicker에서-timeinterval을-사용하는-과정에서-최신기기에서는-사용되지-않는-코드-수정

2022년 7월 4일
·
0개의 댓글
·
post-thumbnail

[React-Native] Scrollable Time Picker 만들기 [2]

Snap(포커싱) 동작 구현하기 스크롤이 멈추는 시점의 offset.y 를 이용하여, 버튼의 정확한 위치를 구하고 scrollTo 를 이용해 포커싱 동작을 구현합니다. > #### Snap(포커싱) 동작 구현 code example 스크롤이 멈추는 순간 우리는 버튼의 위치를 알아낸 뒤, 현재 위치의 좌표를 이동시킬 정확한 좌표로 변환하고 해당 위치로 scrollTo 를 사용해서 이동시킬 수 있습니다. 우리는 버튼의 높이를 고정값으로 주었기 때문에, 정확한 좌표로 변환 하는것은 어렵지 않습니다. 시간 스크롤뷰를 기준으로 설명을 간단하게 해보겠습니다. 스크롤뷰의 초기 offset.y 는 0 입니다. ![]

2022년 6월 5일
·
0개의 댓글
·
post-thumbnail

[React-Native] Scrollable Time Picker 만들기 [1]

react-native-wheely 사용을 추천합니다. 스크롤이 가능한 타임 피커를 만듭니다. scrollTo 를 이용한, Snap 기능 Interpolate 를 이용한, 포커싱 애니메이션 컴포넌트 구상하기 큰 단위로 세분화를 한다고 생각하면, 아래처럼 구상할 수 있습니다. > 1. 각 단위를 스크롤할 수 있는 스크롤 뷰 단위의 값을 선택할 수 있는 버튼 선택됨을 시각적으로 보여주기 위한 영역 picker-parts 일차적인 UI 구현하기 애니메이션 및 기능을 제외한 UI 를 구현합니다. > #### Scroll View & Buttons 구현 [co

2021년 1월 11일
·
5개의 댓글
·