애플 휴먼 인터페이스 가이드라인(59) Controls -7 Pickers

Pickers

A picker can display one or more scrollable lists of distinct values from which people can choose. In iOS 14 and later, a date picker supports additional ways to choose values, like selecting a day in a calendar view or entering dates and times using a numeric keypad (for guidance, see Date Pickers). Both types of pickers make it easy for people to enter information by choosing single or multipart values.

피커는 하나 이상의 스크롤 가능한 값들의 리스트들을 보여주며, 이 값들은 사용자가 선택할 수 있습니다. iOS 14 포함 이후 버전에서 날짜 피커는 달력 뷰에서 날짜를 선택하거나 숫자 패드를 사용해 날짜와 시간을 입력하는 새로운 방법도 추가로 지원합니다. 두 방식 모두 하나나 여러개의 값을 고르게 하면서, 사용자들이 정보를 입력하기 쉽게 합니다.

 

 

Consider using a picker to offer medium-to-long lists of items. If you need to display a fairly short list of choices, consider using a pull-down menu instead of a picker. Although a picker makes it easy to scroll quickly through many items, it may add too much visual weight to a short list of items. On the other hand, if you need to present a very large set of items, consider using a list or table. Lists and tables can adjust in height, and tables can include an index, which makes it much faster to target a section of the list. For guidance, see Tables.

중간~긴 정도의 아이템 리스트를 보여줄 때 피커를 사용해보세요. 적은 수의 선택 리스트를 보여줄 땐 피커 대신 풀다운 메뉴를 사용하세요. 피커가 아이템들을 빨리 스크롤 하기엔 좋지만, 짧은 리스트일 땐 시각적 부담이 될 수 있습니다. 반대로, 아주 많은 수의 아이템 리스트를 보여줘야 한다면, 리스트나 테이블을 사용하세요. 이들은 높이를 조정할 수 있고, 테이블은 인덱스도 포함할 수 있어서 원하는 섹션을 더 빠르게 찾을 수 있습니다. 가이드는 테이블에서 확인하세요.

 

Use predictable and logically ordered values. Many values in a picker may be hidden when the scrollable lists are stationary. It's best when people can predict what the hidden values are, such as with an alphabetized list of countries, so they can move through the items quickly.

예측 가능하고, 논리적으로 배열된 값을 사용하세요. 피커의 많은 값은 리스트가 고정되어있을 때 가려져있습니다. 값이 알파벳 순서로 써있는 등, 사용자가 숨겨진 값이 무엇인지 예측할 수 있을 때, 아이템 리스트를 빠르게 움직일 수 있습니다.

 

Avoid switching screens to show a picker. A picker works well when displayed in context, below or in proximity to the field being edited. A picker typically appears at the bottom of the screen or in a popover.

For developer guidance, see UIPickerView.

피커를 보여주기 위해 화면을 바꾸지 마세요. 피커는 현재 맥락, 편집중인 필드 아래나 근처에 표시될 때 잘 작동합니다. 피커는 일반적으로 화면의 아래나 팝오버에 나타납니다.

Date Pickers
날짜 피커

A date picker is an efficient interface for selecting a specific date, time, or both, using touch, a keyboard, or a pointing device. You can display a date picker in one of the following styles:

• Inline — An editable field that fits in a small space, like a list or table row, and expands to display an editing view
• Compact — A label that expands to display an editing view in a modal context
• Wheels — The traditional set of scrolling wheels

You can also choose the automatic style to let the system use the current platform and date picker mode to determine an appropriate display style.

 

날짜 피커는 특정 날짜, 시간, 혹은 둘 다를 터치나 키보드, 포인팅 디바이스로 선택할 때 효율적인 인터페이스입니다. 날짜 피커는 아래의 스타일 중 하나를 선택해 보여줄 수 있습니다:

• 인라인 — 리스트나 테이블 열같이 작은 화면에 알맞고, 수정 가능며 수정 시 확장되는 필드
• 컴팩트 — 모달 콘텍스트에서 수정 모드일 때 확장되는 라벨
• 휠 — 전통적인 스크롤 휠

 

An inline date picker in date mode (좌) An inline date picker in time mode (우) 

 

A date picker has four modes, each of which presents a different set of selectable values.

• Date. Displays months, days of the month, and years.
• Time. Displays hours, minutes, and (optionally) an AM/PM designation.
• Date and time. Displays dates, hours, minutes, and (optionally) an AM/PM designation.
• Countdown timer. Displays hours and minutes, up to a maximum of 23 hours and 59 minutes. This mode isn't available in the compact style.

The exact values shown in a date picker, and their order, depend on the user’s locale.

 

날짜 피커는 네가지 모드가 있는데, 각각 선택 가능한 값의 다른 묶음을 뜻합니다.

• 날짜. 월, 일, 년도를 표시합니다.
• 시간. 시, 분, (옵션으로) AM/PM 지정을 표시합니다.
• 날짜와 시간. 일, 시, 분, (옵션으로) AM/PM 지정을 표시합니다.
• 카운트다운 타이머. 시, 분을 모여주며 지정 가능한 최대시간은 23시간 59분입니다. 이 모드는 컴팩트 스타일에선 사용불가능합니다.

Use a compact date picker when space is constrained. When collapsed, the compact style displays a button that shows the current value in your app's accent color. When people tap the button, the date picker expands into a modal view, providing access to a familiar calendar-style editor and time picker. Within the modal view, people can make multiple edits to dates and times before tapping outside the view to confirm their choices.

화면영역이 제한될 땐 컴팩트 날짜 피커를 사용하세요. 컴팩트 스타일은 앱의 강조 색상 (프라이머리 컬러)로 현재 값을 나타내는 버튼을 보여줍니다. 사용자들이 버튼을 탭하면, 날짜 피커는 모달 뷰로 확장되어 익숙한 달력 스타일의 에디터와 시간 피커로 접근할 수 있게 됩니다. 사용자들은 모달 뷰 안에서 날짜와 시간을 여러번 수정할 수 있습니다. 뷰의 바깥 영역을 탭해 수정을 확정할 수 있습니다.

 

Consider providing less granularity when specifying minutes. By default, a minute list includes 60 values (0 to 59). You can optionally increase the minute interval as long as it divides evenly into 60. For example, you might want quarter-hour intervals (0, 15, 30, and 45).

For developer guidance, see UIDatePicker.

'분'을 설정할 땐 덜 세분화하는 방법을 고려해보세요. 기본적으로 분 리스트는 60개의 값을 가지고 있습니다 (0부터 59까지). 기본 간격인 1이 아니어도, 간격을 더 늘릴 수 있습니다. 이 간격이 60의 약수라면요 (간격이 60을 나머지 없이 나눌 수 있다면). 예를 들어, 1/4시간씩 간격을 두어 0분, 15분, 30분, 45분만 선택하게 할 수 있습니다.