UI设计素材之按钮和选框,悠闲素材帮你轻松搞定设计。

UI 界面当中,各种开关、按钮、选框控件是非常常见的组件,它们看起来不复杂,但是在实际使用的时候讲究非常之多,它们不仅关乎体验,而且涉及到一些界面逻辑问题。

英文中的 「Toggle」一词,对应的是带有短柄的拨动式开关,拨动它的时候,能够在两种不同的状态之间切换。

至于 「单选按钮」(Radio Buttons)这一词则来自汽车收音机,在老式的汽车控制面板上有一排机械的可以存储预设电台的按钮,用户可以快速地按动按钮切换不同的电台。按下其中一个按钮,其他的按钮会弹起,这里的按钮是互斥的,多个按钮无法同时被激活。

举几个可以临摹的例子,看看优秀作品是如何操作的,更多按钮图标搜UI(SOOUI) 根据关键词搜索!

 

果味开关

复选框(Checkboxes)则通常有一个或者多个选项,供用户选择,复选框内的选项通常不是互斥的,用户可以选择一个也可以选择多个。

带有灯光和阴影PSD的开关

黑暗的必备开关和PSD切换

拨动开关(Toggle-Switch)则是最常见的一种按钮样式,点击即可切换状态。

 

七彩切换/开关打开关闭

选择按钮(Choice Chips)是单选按钮一种精简模式,它通常会包含有至少2个选项,用户可以选择其中的一个,选择按钮大多出现在移动端界面上。

 

按钮免费赠品V2

多选按钮(Multi-select Chips)则是复选框的一种通用替代品,用户可以选择其中多个选项,而这种按钮也大多应用在移动端设备上。

 

3个开关

各类选择控件已经在用户界面中存在了很长时间,所以用户对于它的功能、认知以及期望是清晰的。下面是一个非常简单的清单,列举出了绝大多数常见的选择控件的类型和使用场景:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

awayaya1

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值