关于表单的交互

手机键盘

根据输入内容类型选择不同的键盘，如输入手机号，输入框获取焦点后，数字键盘自动弹出。

联动键盘。简单来说，是将同类型字段整合输入，减少用户点击，使用联动式组件。

正在输入中，键盘可显示提示文字。

自动切换大小写。英文输入中适用。

提供缺省值

从系统中获取信息，减少用户输入，如地点、时间等。

提供以前输入过的内容。

提供大部分用户会使用的选项或内容。

提供热门内容。

提示标签

① 顶部对齐。适用于水平空间有限的情况。

优点：和输入框联系非常紧密，从上至下的视觉路径清晰流畅，填写效率很高。

缺点：大量占用垂直空间，不适用于输入框较多的表单。

② 右对齐。适用于垂直空间有限的情况并且需要用户快速填写的情况。

优点：和输入框联系较为紧密，并且减少占用垂直空间。

缺点：标签可读性不强，降低快速浏览完表单的效率。

③ 左对齐。适用于垂直空间有限并且需要用户谨慎填写的情况。

优点：标签可读性强，并且减少占用垂直空间。

缺点：和输入框联系不紧密，增加用户填写表单的时间。

④ 输入框内对齐。适用于水平和垂直空间有限的情况。

优点：与输入框联系紧密，并且减少占用水平和垂直空间。

缺点：标签随输入内容而消失，复核表单信息较困难。

⑤ 悬浮标签。结合了顶部对齐和输入框内对齐的情况。

优点：和输入框联系最紧密，填写效率最高，并且减少占用水平和垂直空间。

缺点：稍微占用了垂直空间，标签字号太小容易造成可读性问题，不过缺点不是很明显。

说明需要填什么内容。

自动补全，关联词，

如自动补全邮箱后缀。

关联词，如搜索“设计”，提供”交互”“UE”等选项。

输入验证

及时反馈

颜色指示

如果用户在处于已验证正确的字段（即先前输入的数据是有效的）中输入数据，则在数据输入后验证。

如果用户在处于已验证错误的字段（即以前输入的数据无效）中输入数据，则在数据输入过程中进行验证。

字符限制

当用户输入超过限制的字符时，还应该红色标记用户输入的字符数和限制字符数

输入内容显示格式

如电话号码，xxx xxxx xxxx的格式更容易阅读。

不要强制用户按一定的格式填写内容，如日期2018.3.3，或2018-03-03。程序应该可以辨别并保存为统一格式。

状态

默认，悬停，焦点，错误，成功和禁用

上一个输入完成，可自动跳转到下一个输入框。

区分选填项和必填项。

“必填”，*（有说明）

使用选择框代替输入。如日期、地区输入。

输入掩码

对话式表单

分步骤

动效