推荐直接查看以下链接的文档介绍。
================== 本文开始 ========================
该控件在实际项目拓展性不高可以使用。否则还是自己实现吧~
下面是练手项目中使用 BottomNavigation
的一张动图。
实现了 一个
Activity
+ 多个Fragment
沉浸式状态栏,同时Bottom Navigation
和Toolbar
在内容滑动的时候也跟随滑动显示显示和隐藏。
从上面的截图可以看出,底部导航栏有些不一样,而这个底部导航栏就是 Android 5.0
之后推出的 Bottom navigation
控件。下面一张图是宣传图。
项目刚开始我使用的是 BottomBar 这个库,但是这个库的作者不更新了,推荐我们使用 Bottom navigation
,那就来学习一波官方的控件吧
在今天看到了一个还不错的第三方实现的底部导航栏控件 BottomNavigation
什么时候使用?
- 顶级页面使用
- 3 到 5 个页面使用
- 仅限手机和平板电脑使用
状态栏和虚拟栏
-
Status bar 状态栏
在Android上,状态栏包含通知图标和系统图标。
-
navigation bar 导航栏
Android中的Android导航栏包含设备导航控件:Back,Home和Overview。它还显示为Android 2.3或更早版本编写的应用程序菜单。
添加红点、气泡
看到效果但是没有实现的 API ,感觉有点坑。
- 红色气泡
- 数字气泡
- 具有最大数量限制的数字气泡
滑动
这个滑动效果给我找的也是很辛苦,最后在 Github material-components-android 中的 demos 目录下边找到,而且只有滑动隐藏底部图标导航栏的,但是 Toolbar 标题栏是没有跟随滑动隐藏的。动图中能滑动隐藏,我是做个一个位移动画。
- 上滑隐藏
- 下滑显示
页面切换
- 避免页面横向切换(像
ViewPager
控件的默认点击切换动画) - 应该使用渐变切换
页面切换 改变 文本和 icon 颜色
- 使用应用程序的主要颜色来指示点击的页面
- 避免使用不同的彩色图标和文字标签。
- 如果底部导航栏已着色,请将当前操作的图标和文本标签设置为黑色或白色。否则在彩色底部导航栏上放置彩色图标和文本时,请确保清晰的颜色对比。
变色
不建议底部色彩颜色太多
- 文本图标
- 背景色
设计规范
================== 本文结束 ========================
期待你的留言讨论~