一、键盘类型键盘在用户的交互过程中起到了非常重要的作用,尤其在多个输入框的场景下。合理地切换”键盘类型”和“按键命令类型”可以提高用户填写表单的效率,同时也可以让表单填写过程更加顺畅,降低页面的流失率。
iOS 中提供了12种键盘可以选择,我们可以根据用户当前的需要,提供不同类型键盘。
在交互稿中,需要对要调用的键盘进行标注,对于同一个界面中有不同类型输入框的情况,需要标注出键盘切换的说明。
虽然12种键盘类型已经很多,但它们仍然不能覆盖所有场景,这时我们需要自定义键盘。
二、按键命令类型除了选用不同类型的键盘,部分键盘中还有多种“按键命令”(下图中的蓝色按钮)可以选择,如“完成”、“搜索”、“发送”等。
iOS中提供了11种类型的命令,交互稿中可将所需要的命令用文字描述/截图的形式标注。
iOS的键盘具有上一项和下一项的功能( < > ,如上图左上方),对于表单的交互设计起到了非常重要的作用,交互稿中需加以说明。
1. 上一项 下一项与键盘tab键功能一致,跳转至上一个/下一个标签序列,同时保证不会清空已填入的内容。
应用场景:表单输入框标签超出2项,唤起键盘时,在键盘上面显示“上一项”“下一项”操作按钮。
限制:
区分按钮的可点击状态、不可点击状态。
当第一项时,“上一项”按钮置灰,不可点击;当最后一项时,“下一项”按钮置灰,不可点击。好处:
- 手机屏幕有限,如果唤起的键盘挡住了下一项输入框,可以通过点击下一项按钮来输入下一项,无需收起键盘,方便用户操作。有多项表单填写时,通过连续的点击下一项按钮,快捷完成输入。
点击“完成”按钮,从上往下收起键盘。
三、键盘使用实例1. 常规键盘1)常规键盘-文本输入
应用场景:账户姓名、地址等文本输入
2)常规键盘-字符输入
应用场景:登录密码
仅支持字符和数字、符号,不可切换输入法,给用户明确的指示性,减少犯错误的机会。
3)常规键盘-纯数字输入
应用场景:
只支持限制了归属地的手机号码、数字邮编、短信验证码、纯数字支付密码、银行卡号、信用卡安全码。
仅支持输入0-9的数字,增大有效点击区域,给用户明确的提示,减少输入错误。
4)常规键盘-电话键盘
应用场景:
手机号码,不限定国内外。
在填写手机号码时,如没有对手机号归属地进行单独限制,则调用包含“+”“*”“#”的电话键盘。
5)常规键盘——带“.”的数字键盘
应用场景:输入带小数点的金额。
6)常规键盘——带@的电子邮件键盘
应用场景:邮箱地址
2. 自定义键盘1)定制键盘——带X的数字键盘
应用场景:国内18位身份证号码
2)定制键盘——随机密码键盘
应用场景:各类银行app登录密码/支付密码
招行掌上银行:
密码为数字、字符、字母随机组合密码。键盘上文本:暗示用户有安全保障的键盘,消除用户疑虑,增加安全性。键盘内数字位置随机显示,防止密码被泄露(如图一)键盘内数字按顺序显示(如图二)(图一)