<aside> ⏰ 3차 세미나에서 TimePicker 에 대해서 간략하게 설명을 들었는데, 이 TimePicker를 구현해야 하는 일이 생겨 겸사겸사 글을 써보게 되었습니다.

</aside>

Time pickers – Material Design 3

위 Matrial3 공식문서에서 보면 기본적으로 다이얼 형태와 사용자가 시간을 입력하는 두 가지 방법이 대표적으로 나와있습니다. 하지만 저런 형식으로 시간을 유저에게 요구하는 어플은 거의 없었습니다.(갤럭시 여러분 맞죠?) iOS 의 DatePicker 형식이 좀 더 유저 친화적이기에 안드로이드도 그에 따라 가는 것 같습니다.

위의 두 방식 보다는 아래의 방식이 좀 더 예쁘다는 생각이 듭니다.

위와 같은 이유로 TimePicker를 위와 같이 꾸밀 수 있는 방법을 찾아보던 중, Material 1,2 를 참고하였지만 전 버전들에서도 위와 비슷한 형식이였습니다. 구글링을 하던 도중 아주 쉬운 방법을 찾아서 기록해보기로 했습니다.

Spinner 타입의 TimePicker

<TimePicker
	android:id="@+id/timePicker"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:timePickerMode="spinner"
	app:layout_constraintTop_toBottomOf="@+id/textView"
	app:layout_constraintBottom_toBottomOf="parent"
	app:layout_constraintStart_toStartOf="parent"
	app:layout_constraintEnd_toEndOf="parent""/>

네 그렇습니다. android:timePickerMode를 **spinner**로 지정하면 다음과 같은 모습이 나옵니다.

개발자가 이와 같은 TimePicker를 만드는 이유를 값을 설정하거나 유저에게서 값을 얻어보기 위함이겠죠? 이제 값을 얻고 설정하는 법에 대해 마저 작성하겠습니다.

값 설정하기

val timePicker = binding.timePicker
timePicker.setIs24HourView(false) // 12시간 형식을 사용한다는 의미입니다.
timePicker.hour = 9
timePicker.minute = 0

위와 같이 viewBinding 을 사용해서 객체를 생성한 다음, 쉽게 값을 설정할 수 있습니다.