![产品经理方法论](https://wfqqreader-1252317822.image.myqcloud.com/cover/25/45938025/b_45938025.jpg)
1.2 单选按钮和复选框
单选按钮(radio button)、复选框(check box)与文本框一样,适用于用户与产品进行交互时,需要用户输入信息的场景。它们之间的区别在于,单选按钮和复选框提供给用户的主要是已分类的信息,用户只需选择输入即可。
单选按钮是一种单项选择命令。它只允许用户在一组选项中选择其中一个。单选按钮的外观一般是一个空白的圆圈,当被选中时,则白色圆圈会被圆点填充。而在它的旁边通常会有一个文字标签,用于描述选项内容。
复选框是一种多项选择指令。复选框允许用户在一组选项中同时选择多个选项。复选框通常使用方框加对号表示。图1-12展示了单选按钮和复选框。
![](https://epubservercos.yuewen.com/B2B0AA/25073867509683306/epubprivate/OEBPS/Images/1-12.jpg?sign=1738829147-onEFwaaiCKajfI6k3BvyZ7wZOYXCuqie-0-13c185534966196199bbb7dd09a15541)
图1-12 单选按钮和复选框
单选按钮一般适用于单项选择的用户输入场景,各选项之间是“或”的关系,若选择了A就不能选择B。在图1-12中,要求用户选择一个职业信息,一般情况下,大多数用户只有一个职业,这样的场景比较适合使用单选按钮。而当想知道用户喜欢什么水果时,更适合使用复选框,因为一般用户会喜欢两种以上的水果。
无论是单选按钮还是复选框,都需要有主题标签和选项标签,主题标签用于描述对什么进行选择,而选项标签用于描述可以选择什么。图1-11中的“从事职业”就是一个主题标签,而“教师”是其中的一个选项标签。
在某些场景下,我们需要对“选项标签”进行辅助说明,从而添加一些辅助描述文字,类似于文本框控件中的帮助文本,目的也是让用户更好地理解控件内容,如图1-13所示。
在交互层面,单选按钮比较简单,仅要明确选中状态和未选中状态,以及当用户单击一个单选按钮时,该按钮会变为选中状态,其他所有按钮会变为非选中状态的基本逻辑,没有其他交互逻辑。而复选框需要在产品需求文档(Product Requirement Document,PRD)中描述清楚是否支持全选,如果支持全选,是否需要新增全选按钮的快捷方式;如果不支持全选,则要说明最多可以选择几项。
![](https://epubservercos.yuewen.com/B2B0AA/25073867509683306/epubprivate/OEBPS/Images/1-13.jpg?sign=1738829147-81zzhZVjsIlVql56V1vDsPC4YF7xRslD-0-749e16f4cfa65893a7825e4618eee41c)
图1-13 辅助描述文字