起航学习网

- 让每个人都能学到最前沿新知识、新技能!
起航学习网
当前位置: 起航学习网 > 短期培训 > 设计培训 > Android设计规范 Material Design-Components(13Snackbars 与

Android设计规范 Material Design-Components(13Snackbars 与

时间:2016-05-19 09:40:00来源:UI设计网 作者:起航学习网 已有: 名学员访问该课程

  快捷搜索:经验Android教程APP设计


机构名称:我爱学习网 联系手机:13783581536 在线客服:起航学习网客服 在 线 QQ:起航学习网客服 网站域名:

前言: 9月17日,时间好快呀~~眼看着就要国庆了~~反正是过了中秋,就开始坐等国庆了~~今天主要是Snackbars 与 Toasts的用法和

9月17日,时间好快呀~~眼看着就要国庆了~~反正是过了中秋,就开始坐等国庆了~~今天主要是Snackbars 与 Toasts的用法和规格,希望对大家有用~~

Snackbars 与 Toasts

Snackbar 是一种针对操作的轻量级反馈机制,常以一个小的弹出框的形式,出现在手机屏幕下方或者桌面左下方。它们出现在屏幕所有层的最上方,包括浮动操作按钮。

它们会在超时或者用户在屏幕其他地方触摸之后自动消失。Snackbar 可以在屏幕上滑动关闭。当它们出现时,不会阻碍用户在屏幕上的输入,并且也不支持输入。屏幕上同时最多只能现实一个 Snackbar。

Android 也提供了一种主要用于提示系统消息的胶囊状的提示框 Toast。Toast 同 Snackbar 非常相似,但是 Toast 并不包含操作也不能从屏幕上滑动关闭。

用法

短文本

通常 Snackbar 的高度应该仅仅用于容纳所有的文本,而文本应该与执行的操作相关。Snackbar 中不能包含图标,操作只能以文本的形式存在。

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn
不要

暂时性

为了保证可用性,Snackbar 不应该成为通往核心操作的唯一方式。作为在所有层的上方,Snackbar 不应该持续存在或相互堆叠。

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn
不要

最多0-1个操作,不包含取消按钮

当一个动作发生的时候,应当符合提示框和可用性规则。当有2个或者2个以上的操作出现时,应该使用提示框而不是 Snackbar,即使其中的一个是取消操作。如果 Snackbar 中提示的操作重要到需要打断屏幕上正在进行的操作,那么理当使用提示框而非 Snackbar。

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn
不要

不要阻挡了浮动操作按钮

垂直移动浮动操作按钮到 Snackbar 的上方。

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn
不要

规格

手机端 Snackbar

  • 单行 Snackbar 高度:48 dp
  • 多行 Snackbar 高度:80 dp
  • 文本:Roboto Regular 14 sp
  • 操作按钮:Roboto Medium 14 sp, 大写文本
  • 默认背景填充色:#323232 100%

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

平板/桌面端 Snackbar

  • 单行 snackbar 高度:48 dp 以上
  • 最小宽度:288 dp
  • 最大宽度:568 dp
  • 2 dp 圆角
  • 文本:Roboto Regular 14 sp
  • 操作按钮:Roboto Medium 14 sp, 大写文本
  • 默认背景填充色:#323232 100%

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android toast

开发者可以自定义的 Toast 和它在屏幕上的位置。如果你打算自定义 Toast 的话,强烈建议按照上述 Snackbar 的样式来设计。

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

Android设计规范 Material Design-Components(13Snackbars 与_qh.itpxw.cn

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

原文:Snackbars and Toasts 翻译:chenzimu7 校对:PoppinLp

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

========================关于起航学习网=========================

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

 APP截图站:qh.itpxw.cn  海量APP截图,让你灵感爆发!

转载请注明:起航学习网 » Android设计规范 Material Design-Components(13Snackbars 与 Toast)

文章出自:http://qh.itpxw.cn/peixun/ui/201613719.html

文章标题:Android设计规范 Material Design-Components(13Snackbars 与



免责声明:本站文章均由入驻起航学习网的会员所发或者网络转载,所述观点仅代表作者本人,不代表起航学习网立场。如有侵权或者其他问题,请联系举报,必删。侵权投诉


机构名称:我爱学习网 联系手机:13783581536 在线客服:起航学习网客服 在 线 QQ:起航学习网客服 网站域名:

(责任编辑:深圳学历教育网)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------