恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
Google Material Design _ Patterns _ Promoted Actions
0.0°
2014-06-29 自译外文 规范/资料 原作者: Google 举报 48529 192 68 5

浮动操作按钮


浮动操作按钮一般作为进阶操作的开关,在用户界面中通常是一个漂浮的小圆圈,它有自身独特的动态效果,比如变形、弹出、位移等等。


有两种尺寸的浮动操作按钮:默认大小和较小的,使用哪种尺寸需要根据屏幕中的元素来决定。 

 

内容相关

并不是每一个屏幕都需要浮动操作按钮。一个浮动操作按钮应该能够代表这个APP中的主要操作。在左边主要是相册集和打开的图片,并不需要浮动按钮。而在右侧,主要的动作是添加内容,所以添加浮动操作按钮是合理的。

尽量只在屏幕中摆放一个浮动按钮,因为它是整个屏幕中最突出的按钮。

不要在对话框中使用浮动按钮,去使用扁平的按钮。

不要在侧边的导航栏中加入浮动按钮,他会分散用户的注意力,侧边栏的主要任务就是导航。

不要把浮动操作按钮摆放在下拉菜单会覆盖的面积。



操作相关

不要在浮动操作按钮中设置弹出菜单选项。

如果是应用程序内添加文件类型的标志,可以让浮动操作按钮在被点击后变化为相关的按钮。

然而,如果是一组动作按钮,之间并没有关联,那么你应该把这些按钮放入到菜单中,而不是通过浮动操作按钮激活。

如果在点击浮动操作按钮过后,出现工具栏,那么工具栏中应该摆放相关的按钮。在这个例子中,是让用户选择添加的媒体类型。

不要将毫无关联的图标按钮添加到由浮动操作按钮激活的工具栏中。

一个浮动操作按钮可以包含联系人列表。

但是不要将各类功能和联系人或其他元素都放进按钮中。


品质

浮动按钮通常可以作为:添加、编辑、喜欢、分享、搜索等等按钮出现

一般来说,我们会避免在浮动操作按钮上设置会对内容操作按钮,比如下载、删除、新建文件夹等等;或者不具体的动作,比如警告或错误;应该在工具栏或控件栏中的按钮,比如音量控制、字体颜色等等。另外浮动操作按钮不应该包含应用程序栏图标或状态栏上的通知图标,还有注意的是,不要在浮动操作按钮上再添加气泡或其他元素。 

使用圆形作为按钮的外形,以免混淆用户。

不要在浮动操作按钮中加入反弹动画。


位置

浮动操作按钮可以放在界面中明显的分割线上或附加在扩展栏中。 

也可以将浮动操作按钮放在页脚或者展开的列表上。

不要将浮动操作按钮随机的悬浮在一个位置上,同时也要注意不要让浮动操作按钮遮挡住其他按钮。

一个浮动操作按钮可以链接到一个新的窗口

浮动操作按钮可以被放置在工具栏或者页面分隔上(只要不遮挡其他元素)

浮动操作按钮可以附着在区域的边缘 

一个屏幕中只允许出现一个浮动操作按钮

不要将浮动操作按钮隐藏在侧边栏或附着在侧边栏上

不要给界面中每一个元素上都放置一个浮动操作按钮

不要让状态通知或其他元素,遮挡住浮动操作按钮。

更新:2014-06-29

收藏

192人已收藏

Daqian.Dong

默默的存在

  • 41

    作品

  • 428

    粉丝

  • 1

    关注

  • #每周临摹#166期_金融APP动效
  • 图标两枚
  • Spade A
  • 3D Touch News

    猜你喜欢

      2014-06-29 自译外文 规范/资料 原作者: Google 举报 48529 192 68 5

      Google Material Design _ Patterns _ Promoted Actions

      0.0°

      你确定要举报Google Material Design _ Patterns _ Promoted Actions

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2014年06月29日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      68
      192
      5

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录