单词“ toggle”是指带有短手柄的开关，这种开关每次使用时，仅会在两种状态间切换，比如我们每次“打开”台灯时都会用到它。


至于“收音机按钮”，这个词来自汽车收音机。通常情况下，在表盘下方有一组按钮，以机械地形式存储电台预设，用户使用时可以快速地在电台之间切换。按下其中一个按钮，它会一直保持同一中状态，直到按下另一个按钮为止。



单选框——当有一个或多个独立选项时使用，用户可以选择任意数量的选项（包括无，一个或多个）；

单选按钮——当存在两个或多个互斥选项，用户只能选择其中一个使用；

拨动切换按钮——当有两个互斥选项，并且始终出现一个默认值时使用。切换选择后，按钮会立即生效；



选择控件——是单选按钮的精简版，至少包含两个选项，选择控件也能让用户进行的单个选择；

多选控件——是复选框的精简版，允许用户选择多个选项，主要用于在移动设备上的筛选。

选择控件已在用户界面中被使用了很长时间，怎么应用它们呢？以下是有详细列举：



01 选择控件的状态

单选、复选框都可以选择或取消，波动开关可以切换开/关。它们全部具有：激活、禁用、悬停、选中和按下等各式状态。虽然状态看起来很多，但若想打造一套完整的选择交互，这些状态必不可少。



02 别忽视不确定状态

复选框中会同时出现未选中&选中的选项，比如涉及到父子级、多层级的复选框时，因为并不是每个选项都能用得到，这种不确定、未知性的交互，别忽视了。



03 禁止滥用拨动开关

禁止在层级结构中使用拨动开关，它在视觉上大大分散了用户注意力，还会误导用户以为所有子选项都处于开/关状态。



04 拨动开关&立即触发

使用拨动开关，最好保证要触发的功能是需要立即生效的，否则就失去了它的意义。如果不是，最好用单个复选框去替换拨动开关。



05 使用常规样式风格

任何偏离设计标准、常规的样式风格都会给用户增加额外负担，注意设计语言的统一和规范。



06 垂直列表中的对齐版式

左对齐的控件和标签组合一起时效果最佳，这样能方便用户快速浏览，不会出现读串行等错误。右对齐控件在移动设备上相对效果更好，控件和按钮不能分开太远，这种设计方便用户单手操作，也不在勾选时遮挡标签。


07 垂直排版时用按钮代替选框

避免出现用户无法快速识别控件状态的情况，下图中，标签按钮相对比选框更容易清晰识别主要、次要信息。



08 用单选按钮代替下拉菜单

使所有选项永久可见，方便用户比较它们，从而减轻了认知负担帮助表单更透明。



09 选项过多时使用下拉菜单

如果选项数量超过6个，建议将其置于下拉菜单里，因为用户无法牢记所有选项。这同样适用于可预测的，一些相似或是增量的选项，例如10％，20％，30％…



10 设置一个默认选项

一旦单选按钮被选中，用户就不能取消选择或将其设置回原来的状态了。当用户不愿选择时，可以提供一个标记为None的默认单选按钮，再依据此排列选项列表，使用效果也会更好。



11 设置清晰的标签

文本标签应以用户第一视角设置，避免否定样式出现，造成误解。



12 突出选定项，吸引用户注意

在视觉上，将数据中表内的所选项与其他选项区分开，尤为重要。



13 支持批量选择和清除

对用户而言，一次性选择或清除多个项目，应该是毫不费力的，不要忽略批量选择和批量删除功能。



14 增大点击区域实现可靠交互

根据菲茨定律，目标的大小起着重要作用。复选框和单选按钮通常都很小，尤其在移动设备上，在点击时可能会比较棘手，所以交互区域可以包含按钮、文本标签及周围一些空白区域，甚至加大触发面积，对于交互来说都是非常友好的。



／End.

本文原创，未经作者允许不可转载！
更多内容，欢迎关注作者微信公众号：UX辞典！