iOS12界面设计指南之视图(Controls)–筛选框(Pickers)

引自《iOS12界面交互设计规范(iOS 12 Human Interface Guidelines)》

 

一个筛选框包含一个或多个可滚动的含有不同值的列表,其中每一列均具有一个唯一选中的值以深色的文字出现呈现。一个筛选框通常在用户编辑某一个字段或点击某个菜单时在屏幕的底部显示或弹出。筛选框也可以以内部互相关联的形式出现,比如在编辑日历中的日期时。筛选框的高度大致等于列表值的五行高度。筛选框的宽度可以是屏幕的宽度,也可以是封闭的视图,这取决于设备和上下文。

使用可预测的和合理有序的值(Use predictable and logically ordered values.)很多值在一个滚动的筛选框中可能是会隐藏的。所以列表中值的排序最好是可以被用户预测的,比如按字母顺序排序的国家,这样用户便可以根据列表中的值快速的滑动。

避免切换屏幕来显示筛选框(Avoid switching screens to show a picker.)筛选框在上下文中、或在被编辑的字段的下方或附近时,才更为合适。

对于大量数量列表尽可能使用表格来代替筛选器(Use a table instead of a picker for large value lists.)太长的列表可能会使筛选器过于乏味。而表格既可以自适应高度还可以进行索引,其能够使用户更快的进行滑动。

日期筛选框

日期筛选框是一种可以用来选择特定日期、时间或二者兼顾的交互方式。同时其还提供了一个显示倒计时的交互接口。

日期筛选框共有四种模式,每种模式都显示不同的可选值集。

日期(Date.)显示月、一个月中的某一天,和年。
时间(Time.)显示小时、分钟和(可选)上午/下午的设置。
日期和时间(Date and time.)显示日期、小时、分钟和(可选)上午/下午的设置。
倒计时定时器(Countdown timer)显示时间和分钟,最高可达23小时59分钟。

日期筛选框中显示的精确值和它们的顺序取决于用户设备的区域设置。

在指定分钟时考虑提供较少的刻度(Consider providing less granularity when specifying minutes.)默认情况下,一分钟的名单包括60个值(0到59)。你可以随意增加分钟间隔,只要它可以平均分成60个。例如,您可能需要四分之一小时的间隔(0, 15, 30和45)。