February 9, 2015 - Comments Off on iOS – Picker vs. List

iOS – Picker vs. List

We've been working on a new iOS app for PBS for awhile now and we're having some discussions around if/when to use a picker versus when/if to use a list.

Let's go through some examples…

Apple's own Calendar app provides quite a few for discussion.

Date Picker
Cal_Date Picker_collapsedCal_Date Picker_expanded

The date picker uses a picker UI. And even though there's no prompt for the user to understand the date is clickable, this has been the standard UI for Apple's app for a long time now.

Use a date picker to let users pick—instead of type—a date or time value that consists of multiple parts, such as the day, month, and year.

Why is this UI pattern used versus a simple list? Well, one reason is because this UI module connects the date being edited directly to what the user tapped on. It expands in place and the user gets very direct feedback. But probably the main reason is because there are so many different combinations a user could want, a list isn't a viable option.

You can also see this when selecting a language in iOS. Even though there aren't multiple parts, the user has a reasonable expectation around what options are available.

 

Language picker

 


 

Calendars

Cal_Date Picker_collapsedCal_Calendar List

Here we have the list of calendars a user can pick from. This is a list, not a picker because there are a limited number of options to choose from, but also because the user may not understand all the available options and a list presents those options more clearly than a picker.

 


 

Repeat Options

Cal_Date Picker_collapsedCal_Repeat Options

And even in the Repeat options, Apple uses a list to display results, even while also allowing a sub-list to exist under Custom.

 


 

Conclusion

If the user needs to be presented with multiple combinations of options or options they already understand, the picker with it's single or multi-column spinner works great.

In general, use a picker when users are familiar with the entire set of values. Because many of the values are hidden when the wheel is stationary, it’s best when users can predict what the values are. If you need to provide a large set of choices that aren’t well known to your users, a picker might not be the appropriate control.

But don't use a picker when a simple list will do.

Published by: ItsWilder in Article
Tags: , ,

Comments are closed.