UI 界面当中,各种开关、按钮、选框控件是非常常见的组件,它们看起来不复杂,但是在实际使用的时候讲究非常之多,它们不仅关乎体验,而且涉及到一些界面逻辑问题。
英文中的 「Toggle」一词,对应的是带有短柄的拨动式开关,拨动它的时候,能够在两种不同的状态之间切换。
至于 「单选按钮」(Radio Buttons)这一词则来自汽车收音机,在老式的汽车控制面板上有一排机械的可以存储预设电台的按钮,用户可以快速地按动按钮切换不同的电台。按下其中一个按钮,其他的按钮会弹起,这里的按钮是互斥的,多个按钮无法同时被激活。
举几个可以临摹的例子,看看优秀作品是如何操作的,更多按钮图标 到搜UI(SOOUI) 根据关键词搜索!
复选框(Checkboxes)则通常有一个或者多个选项,供用户选择,复选框内的选项通常不是互斥的,用户可以选择一个也可以选择多个。
拨动开关(Toggle-Switch)则是最常见的一种按钮样式,点击即可切换状态。
选择按钮(Choice Chips)是单选按钮一种精简模式,它通常会包含有至少2个选项,用户可以选择其中的一个,选择按钮大多出现在移动端界面上。
多选按钮(Multi-select Chips)则是复选框的一种通用替代品,用户可以选择其中多个选项,而这种按钮也大多应用在移动端设备上。
各类选择控件已经在用户界面中存在了很长时间,所以用户对于它的功能、认知以及期望是清晰的。下面是一个非常简单的清单,列举出了绝大多数常见的选择控件的类型和使用场景: