底部导航

使用场景

底部导航栏适用于：

• 有 3–5 个同等重要的顶级视图（备选方案：可从应用的任何地方访问的固定显示的导航抽屉）

• 目标视图需要从应用的任何地方直接进行访问（备选方案：仅在 1-2 个目标时使用选项卡）

颜色

激活状态的导航项的图标和文本需要使用主色。

文本标签

文本标签是对导航项图标的简短说明。这些文本不会被截断或换行，所以应避免使用长文本。

底部导航图标

点击底部导航栏的图标将直接进入相应视图，或刷新当前激活的视图。每个图标都必须指向一个目标视图，不能打开菜单或对话框。

滚动

底部导航栏会随着界面的滚动而显示或隐藏：

• 向下滚动时隐藏底部导航栏
• 向上滚动时显示底部导航栏

固定状态的底部导航栏

用底部导航栏的宽度除以导航项的个数，就是每个导航项的宽度：

导航项的宽度 = 导航栏宽度 / 导航项数量

例如：导航栏宽度是 360dp，有 3 个导航项，那么每个导航项宽度是 120dp。

桌面端和更大屏幕
另一种做法是将所有导航项的宽度设置为与最宽的导航项一致。

可切换的底部导航栏

最小宽度和最大宽度（包含内边距）：

激活状态

• 最大宽度：168dp
• 最小宽度：96dp

不激活状态

• 最大宽度：96dp
• 最小宽度：56dp

高度：
56dp

图标大小：
24 x 24dp

内容对齐方式：
文本和图标需水平居中。

内边距：

• 图标上方 6dp（激活状态），图标上下各 16dp（不激活状态）
• 文本下方 10dp

文本标签：
Roboto Regular 14sp（激活状态）

海拔高度

因为 Snackbar 的海拔高度为 6dp，而底部导航栏的海拔高度为 8dp，所以 Snackbar 会显示在底部导航栏的后面。

而底部面板、导航抽屉和键盘会显示在底部导航栏上方，并将其完全覆盖。