3种常见形式(状态反馈放在输入框下面还是后面,视排版空间而定;一般情况下,弹窗中表单输入框错误状态反馈放下面,新页面表单输入框错误状态反馈放后面)
输入框状态
输入框类型及使用场景 ? 单文本框(当输入的字符长度超过文本框固定的宽度时,须保证最后输入的字符显示出来) 普通文本输入框:例如,昵称、名称等填写。用户按照规则要求输入即可,输入错误时出现错误状态反馈提示;输入正确给出正确状态反馈提示。 密码输入框:为了安全性起见,用户输入密码时,默认隐藏处理(同时提供显示密码功能)。同时需遵循密码的规则要求,状态反馈提示同普通文本输入框。 数字输入框:建议给出输入框的同时,可以让用户对数字进行微调的功能。对于类似固定电话填写,建议将区号与主体号码分开填写,中间用“—”隔开。 多文本框 当用户需要输入或编辑长字符串时,请使用多行输入框。例如,备注、描述以及意见建议等的填写。 使文本控件的高度足够大,以便容纳典型的输入。 不要让文本输入控件在用户键入时增加高度;如果输入内容超过控件高度时,建议在框内出现滚动条。
对话框&气泡确认框&气泡提示&通知 对话框(消息对话框) 定义:用来临时显示与用户当前正在执行的操作相关信息的控件,通常与黑色背景遮罩搭配使用。 组成:一般由标题(可有可无依照具体场景而使用)、内容、操作按钮以及“×” 组成。 使用场景: 1.操作后发生某些严重错误或者警告用户接下来操作可能出现的风险时使用。 2.操作不可进行时;某些操作无法让用户进行时,应弹出警告消息对话框。 3.操作不可逆时;例如删除命令,执行后再也不能复原,就应该在执行前使用对话框进行再次确定。
对话框(任务对话框) 定义:用来临时显示与用户当前正在执行的操作相关信息的控件,通常与黑色背景遮罩搭配使用。 组成:一般由标题、内容、操作按钮以及 “×” 组成。 使用场景:操作任务多或复杂时;当用户进行较复杂的任务时,应使用对话框嵌套控件,突出操作内容。例如表单。
气泡确认框 定义:用来临时显示与用户当前正在执行的操作相关信息的控件。通常在操作对象附近直接显示,不出现黑色背景遮罩。 组成:一般由内容、操作按钮以及 “×”(大部分情况下没有,在气泡确认框外部点击即可关闭该确认框)组成。 使用场景:频繁使用的破坏性操作。
气泡提示 定义:用于对对象简短描述或补充说明的控件。当用户将鼠标悬停在对象上时会自动显示,当鼠标移开对象时提示就会消失。 组成:一般由解释说明信息组成。 使用场景:轻量级的信息反馈。例如,对某个对象简短描述或补充说明。对象通常是链接文字或者是问号、感叹号图标。
通知 定义:全局展示通知提醒信息。通常在系统右上角显示。 组成:一般由通知提醒信息组成。 使用场景: 用户的操作反馈提示。例如操作失败、成功、系统正在执行某操作等。 系统主动推送的消息。
单选控件 定义:只能在一组相关但互相排斥的选项中选择,且只能选择一个有效项的控件(包括通用单选控件和自定义单选控件)。 示例 通用单选控件 自定义单选控件(此处仅列举一种样式,其他样式视具体场景而定) 单选控件5种状态
单选控件使用场景及注意事项 (责任编辑:本港台直播) |