android ui 开关,Android设计规范 Material Design-Components(15开关)

本文详细介绍了UI设计中复选框、单选按钮和on/off开关的使用场景和设计原则。复选框适用于多选,单选按钮用于排他选择,而on/off开关则用于切换单一设置。每个元素都有其特定的视觉反馈动画,以表达用户交互状态。在设计时,应确保元素的清晰性和易用性。
摘要由CSDN通过智能技术生成

开关

开关允许用户选择选择项。一共有三种类型的开关:复选框、单选按钮和 on/off 开关。

注释:下面示例中所示的图形环代表一个动画,并不是实际按钮的外观。

复选框

复选框允许用户从一组选项中选择多个。

如果需要在一个列表中出现多个 on/off 选项,复选框是一种节省空间的好方式。

如果只有一个 on/off 选择,不要使用复选框,而应该替换成 on/off 开关。

通过主动将复选框换成勾选标记,可以使去掉勾选的操作变得更加明确且令人满意。

复选框通过动画来表达聚焦和按下的状态。

3957aa17795378595b487612ef16ba0d.png

23cf814194ae2bed76bdd4c2b43c4fad.png

单选按钮

单选按钮只允许用户从一组选项中选择一个。如果你认为用户需要看到所有可用的选项并排显示,那么请为排他选择使用单选按钮。

否则,考虑相比显示全部选择更节省空间的下拉。

单选按钮通过动画来表达聚焦和按下的状态。

9a4cb25058f885e40975ff8b6b0d6436.png

d87e67d8bf5e08759dec046c3d27744b.png

3331c40c076d8e5f42cff9dfbade351c.png

开关

On/off 开关切换单一设置选择的状态。开关控制的选项以及它的状态,应该明确的展示出来并且与内部的标签相一致。开关应该单选按钮呈现相同的视觉特性。

开关通过动画来传达被聚焦和被按下的状态。

开关滑块上标明 “on” 和 “off” 的做法被弃用,取而代之的是下图所示的开关。

25575fa2d54cc52fcb2a900be75b5071.png

a97a1508c7bd80516d2c9a67269726f4.png

80167c488b51d062d05f92755b41e948.png

302ad9c011c01fc42062f57e58f1217d.png

仅在支持触屏操作的情况下,对在交互中被完全遮挡的元素使用外部径向扩张效果。桌面使用的是鼠标,你不需要这个额外的指示。

46ac75fd8dba734122fb3789485c0104.png

01fca008ccb40ef1662579c3faa2db33.png

非常感谢这些辛苦翻译的小伙伴!!未完待续~~~

文章转自:http://design.1sters.com/

========================关于学ui网=========================

xueui.cn 学ui网发布高质量ui设计教程和设计分享经验,希望打造一个最好的ui学习教程平台!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值