Android UI 设计规范，挥泪整理面经

• ** 底部动作条（Bottom Sheets） **

底部动作条是一个从屏幕底部边缘向上滑出的一个面板，使用这种方式向用户呈现一组功能。底部动作条呈现了简单、清晰、无需额外解释的一组操作。

通常以列表形式出现，支持上下滚动。

也可以是网格式的。

• ** 按钮（Buttons） **

按钮由文字和/或图标组成，文字及图标必须能让人轻易地和点击后展示的内容联系起来。

主要的按钮有三种:

• 悬浮响应按钮（Floating action button）， 点击后会产生墨水扩散效果的圆形按钮。

• 浮动按钮(Raised button)， 常见的方形纸片按钮，点击后会产生墨水扩散效果。

• 扁平按钮(Flat button)， 点击后产生墨水扩散效果，和浮动按钮的区别是没有浮起的效果。

悬浮响应按钮

浮动按钮

扁平按钮

最重要且随处用到的操作，建议使用悬浮按钮。信息较多时，选用凸起按钮可以有效突出重要操作，但注意纸片不要叠太多层。扁平按钮适合用在简单的界面，例如对话框中。

使用悬浮按钮要遵循以下规则：

• 建议只用一个悬浮按钮

• 悬浮按钮可以贴在纸片边缘或者接缝处，但不要贴在对话框、侧边抽屉和菜单的边缘

• 悬浮按钮不能被其他元素盖住，也不能挡住其他按钮

• 列表滚动至底部时，悬浮按钮应该隐藏，防止它挡住列表项

• 悬浮按钮的位置不能随意摆放，可以贴着左右两边的对齐基线

悬浮按钮有两种尺寸：56x56dp/40x40dp

• ** 卡片（Cards） **

卡片是包含一组特定数据集的纸片，数据集含有各种相关信息，例如，关于单一主题的照片，文本，和链接。卡片通常是通往更详细复杂信息的入口。卡片有固定的宽度和可变的高度。最大高度限制于可适应平台上单一视图的内容，但如果需要它可以临时扩展（例如，显示评论栏）。卡片不会翻转以展示其背后的信息。

**卡片集**是**卡片**的一个平面布局

即使在同一个列表中，卡片的内容和布局方式也可以不一样。

卡片统一带有2dp的圆角。

在以下情况考虑使用卡片：

• 同时展现多种不同内容

• 卡片内容之间不需要进行比较

• 包含了长度不确定的内容，比如评论

• 包含丰富的内容与操作项，比如赞、滚动条、评论

• 本该是列表，但文字超过3行

• 本该是网格，但需要展现更多文字

卡片最多有两块操作区域。辅助操作区至多包含两个操作项，更多操作需要使用下拉菜单。其余部分都是主操作区。

** 卡片布局准则 **

字体设计

正文：14 sp 或 16 sp

标题：24 sp 或更大

扁平按钮：Roboto Medium, 14 sp, 10 sp 字间距

移动设备上的卡片间距

屏幕边界与卡片间留白：8 dp

卡片间留白：8 dp

内容留白

16 dp

• ** 纸片（Chips ） **

纸片是一种小块的用来呈现复杂实体的块，比如说日历的事件或联系人。它可以包含一张图片，一个短字符串(必要时可能被截取的字符串)，或者是其它的一些与实体对象有关的简洁的信息。Chips 可以非常方便的通过托拽来操作。通过按压动作可以触发悬浮卡片(或者是全屏视图)中的 Chip 对应实体的视图，或者是弹出与 Chip 实体相关的操作菜单。

狭小空间内表现复杂信息的一个组件，比如日期、联系人选择器。

• ** 提示框（Dialogs） **