Material Design 设计语言(十一)日期选择器
2019-08-01 本文已影响32人
宛苏
日期选择器(Pickers)
日期选择器允许用户选择日期或日期范围。
原则
1、关联
日期选择器可以显示过去、现在或将来的日期 - 与任务相关。
2、明确
清楚地指出重要日期,例如当前和选定日期。
3、直观
为确保选择一天或时间是直观的,请使用常见的选择器模式,例如日历。
类型
1、日历日期选择器
日历选择器可用于选择近期或过去的日期,此时以日历的格式按月查看日期非常有用。它们以对话框的形式显示。
比如:
· 预订餐厅
· 安排会议
它们不适合选择久远的过去或未来很久的的日期,例如输入出生日期或到期日期。(在这些情况下,改用输入选择器 或文本字段。)
日历选择器可以选择单个日期和年份。左右滑动可查看月份,点按年份附近的向下箭头,可垂直滚动选择年份。
2、日期范围选择器
日期范围选择器允许选择一系列日期。它会覆盖整个屏幕。
比如:
· 预订航班
· 预订酒店
点按日历上的开始日期和结束日期即可选择日期范围。上下垂直滚动则可查看月份。
3、日期输入选择器
日期输入选择器允许使用键盘上的数字手动输入日期。用户可以在对话框中输入日期或日期范围。
可以通过编辑图标从日期选择器访问输入选择器。如下: