Material Design 设计语言(十一)日期选择器

日期选择器(Pickers)

日期选择器允许用户选择日期或日期范围。

原则

1、关联

日期选择器可以显示过去、现在或将来的日期 - 与任务相关。

2、明确

清楚地指出重要日期,例如当前和选定日期。

3、直观

为确保选择一天或时间是直观的,请使用常见的选择器模式,例如日历。

类型

1、日历日期选择器

日历选择器可用于选择近期或过去的日期,此时以日历的格式按月查看日期非常有用。它们以对话框的形式显示。

比如:

· 预订餐厅

· 安排会议

它们不适合选择久远的过去或未来很久的的日期,例如输入出生日期或到期日期。(在这些情况下,改用输入选择器 或文本字段。)

日历选择器可以选择单个日期和年份。左右滑动可查看月份,点按年份附近的向下箭头,可垂直滚动选择年份。

2、日期范围选择器

日期范围选择器允许选择一系列日期。它会覆盖整个屏幕。

比如:

· 预订航班

· 预订酒店

点按日历上的开始日期和结束日期即可选择日期范围。上下垂直滚动则可查看月份。

3、日期输入选择器

日期输入选择器允许使用键盘上的数字手动输入日期。用户可以在对话框中输入日期或日期范围。

可以通过编辑图标从日期选择器访问输入选择器。如下:

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • ORA-00001: 违反唯一约束条件 (.) 错误说明:当在唯一索引所对应的列上键入重复值时,会触发此异常。 O...
    我想起个好名字阅读 5,482评论 0 9
  • 日期选择器的设计很容易被我们忽视,因为我们潜意识都觉得日期选择器很简单。其实的确也很简单:一个输入框,一个日历图标...
    王M争阅读 1,731评论 1 15
  • 今天是日期选择日!在为不同的项目创建了很多这样的项目后,我仍然在寻找完美的项目。让我们试着找出使日期选择器好用或痛...
    设计师Liya阅读 1,793评论 0 3
  • 专业考题类型管理运行工作负责人一般作业考题内容选项A选项B选项C选项D选项E选项F正确答案 变电单选GYSZ本规程...
    小白兔去钓鱼阅读 9,074评论 0 13
  • 昨天路过一中时候,无意中发现了大片的紫色毛茸茸的野花,小时候我们都叫它刺苋花,不仅停下了脚步,拍了起来,也就有了想...
    陕县1433卫秋丽阅读 250评论 0 0