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.

Screenshot of the Health app's cycle tracking screen on iPhone, highlighted to focus on a picker that lists values for cycle length. A translucent gray bar appears horizontally across the center of the picker, indicating the currently selected value of 28 days.

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.

Screenshot of a reminder's details screen in edit mode. Below the current selected date of Friday, July 10, 2020, the expanded date picker displays this date in a month view, which also contains controls that let people choose a different month or year.

An inline date picker in date mode

Screenshot of a reminder's details screen in edit mode. Below the current selected time of 2:00 PM, the expanded time picker displays a numeric key pad.

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.

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.