扫码阅读
手机扫码阅读

单选控件 | 控件怎么选?跟着场景走就对了!

61 2024-03-22

#
产品经理必聊的100个话题



第21期:单选有多少种表示方式

在页面设计的时候,经常会遇到单项选择的问题。


有的时候是在两个选项中选择一个,有的时候是在多项选择中选择一个。

在不同的场景下,应用不同的控件,会给用户带来不同的体验。

如果你只有一种选择,那么设计的页面体验就不会好。因此掌握更多的控件,可以为自己设计页面的时候在不同的场景下应用合适的控件。



控件说明


Business Analysis





1. 单选控件Radio

单选控件也叫单选按钮,其控件要求用户从一组选项中必须选择一个选项。但当选项过多的时候,单选框就不是合适的控件了。

2. 下拉框DropDown

下拉框包含单箭头指示符,单击后会显示包含选项列表的菜单。通过下拉框可以从多个控件中选择一个。但当选项数量在一定有限数量(不多)的情况下,单选框是个不错的选择。

3. 开关控件Switch

开关控件是两个互斥状态(打开和关闭)之间的可视切换。当选项只有两个,并且处于On/Off之间切换的时候,可以选择开关控件。开关控件在很多小型设备上使用更为灵活方便。


4. 胶囊选项控件Capsule

胶囊(Capsule)控件可以帮助在几个不多的选项中选出一个来作为选项值。并且操作起来体验感更好。

5. 打分控件Rate

当选项是在一组不超过10的数字中选择一个的时候,打分控件往往能够派上用场。打分控件看其名字也知道,其应用场景也受限于打分的时候。


6. 级联下拉框Cascader

当数据选项过多,需要从中按照规律来选择数据的时候,可以考虑使用级联下拉框。级联下拉框提供了多个层次级别,按照选择的分类逐级向下选择。


7. 树形选择器(TreeSelect)

和级联下拉框相似,树形选择器也是一个可以通过级联关系提供选择的控件。

8.超长数据过滤器(DataFilter)

当从一个超大且缺少规律的集合中选择数据的时候,可以考虑选择过滤器控件。

树形选择控件或者是下拉控件中输入关键词,从整个集合中过滤出相关的选项数据,从而减小集合的尺寸,以便选择对应的数据。

原文链接: http://mp.weixin.qq.com/s?__biz=Mzk0MzM2OTQzOA==&mid=2247484272&idx=1&sn=1db95ffa3873e126f66117ac335ba339&chksm=c335bec1f44237d7ff02c39609b2fe699f7cb573d5dca36e6ea5b4a2bd2b2971221a2df16968#rd