timepicker时间选择器
视频及原型文件下载:https://study.163.com/course/courseMain.htm?courseId=1209770824&share=2&shareId=400000000540015
定义:
用于用户具体选择时间点时。
交互原则:
1、应该有一个合适的默认值,并不是所有的控件默认值都是今天或当前时间的。
2、控制可选/录入的字段范围,为了减少用户出错,保证产品数据的正常显示,日期/时间控件应当要控制可选的范围。
3、清晰明确的提交或确定按钮,我见过很多非常糟糕的日期控件,在你选择或切换选项后,还需要点击输入框或者空白处,才能填入/显示已选择的项目。
4、减少点击次数
5、标识出特定日期,用户并非总是“记忆”在选择器中显示或标注例如当天、已选默认值、周末、节假日等特殊的日期,可以帮助用户更好、更快地做出选择。
6、特殊的操作按钮,对于一些通过填入日期或时间来筛选数据的选择器,有必要在选择器中加上如“清空”的按钮,允许用户快速清除已选项,回到数据的初始状态。
交互说明:
1、【默认文案】:默认的提示文案内容,例如:开始时间;
2、【默认的日期】:为了方便用户,减少用户输入可以使用默认的时间,默认的时间尽量与当前业务需要有关,例如:默认显示当前时间后30分钟的时间;
3、【时间样式】:需要注明需要的日期控件的样式和刻度,例如:小时、分钟、秒、毫秒
使用场景:
1、当用户需要选择具体时/分
2、点击选择框,出现时间选择浮层。
例如微信公众后台定时群发时,可选择具体时间发送,点击出现下拉选项。