底部导航条, 在 iOS 中叫 tabbar, 在 Android 中叫 bottombar 或 bottom navigation, 是一个常用的切换页面的导航条.
同样, 如果有良好的第三方库, 我们应该优先考虑, 能用好别人的东西, 已经很厉害.
GitHub 上的 roughike/BottomBar, 曾经是热度较高的库, 但是已经过时了, 没有再维护, 加到项目也会遇到编译的问题, 所以这里不使用, 这里使用的是 PagerBottomTabStrip, 地址是: https://github.com/tyzlmjj/PagerBottomTabStrip
使用 PagerBottomTabStrip, 既可实现底部导航条, 也可实现顶部导航条.
(0)添加 activity
上一节创建的 "知音" 项目是没带 activity 的, 而实际的 App 一定是带 activity, 所以先给这个项目增加一个界面, 让它能正常运行起来.
把上一节介绍的 "知音" 项目打开, 选中 App/src, 然后在菜单 File->New 的最下方选择 activity, 如下面截图所示:
这样就给 App 添加了一个窗口. 之时, 在 res 目录下会创建一个 layout 目录, 里面有一个 activity_main.xml 文件, 文件名就是在创建 activity 时的命名, 比如:
这个 xml 就代表一个界面, 跟 iOS 的 view 与 vc 一样, 界面要跟界面容器也就是 activity 关联起来, 而实际上, 在创建 xml 时, activity_main.xml(界面)对应的 activity 也被创建起来, 而且这个 activity 已经使用了 activity_main.xml, 也就是关联起来了, 请看截图:
另外, 在创建 activity_main.xml 时, 还会自动修改了 AndroidManifest.xml 文件, 这个文件是 App 的总配置文件. 我们需要在这个文件里面加入 intent-filter 字段, 如下面的截图:
如果在创建 activity_main 时, 有勾选 Launcher Activity, 则会自动生成截图上面的内容.
所以, 简单来说, 要显示一个界面, 我们要做的是:
用 File->new 菜单来创建一个界面(xml), 不需要考虑关联的事情(AS 帮你创建界面与类并关联了).
如果有必要则修改 AndroidManifest.xml 文件.
到此, 就可以编译并运行, 使用真机或下载某个模拟器(按指引下载即可, 但请准备 10G 的运行空间), 就可以看到运行起来的 App.
(1)引入 PagerBottomTabStrip
在 App/build.gradle 中加入对 PagerBottomTabStrip 的引用, 这个跟 iOS 使用 CocoaPods 来引用第三方库一样的道理, 加入这一句:
implementation 'me.majiajie:pager-bottom-tab-strip:+'
在 gradle 有改动时, as 会提示 sync.sync 一下, 成功引入, command+f9 编译一下, 通过编译.
(2)在 activity 中使用导航条
这里使用约束布局, 在布局中加入 PageNavigationView 实例(也就是导航条).
操作上, 先在 xml 文本中加入 me.majiajie.pagerbottomtabstrip.PageNavigationView 对象跟少量属性 (比如 Android:id 等), 然后在 AS 的 Design 界面对其增加位置约束. 如果没有位置约束, 则运行时会跳到(0,0) 位置, 那就不是底部的导航条了. 如截图:
对于布局与约束, 以后紧接着介绍, 这里先让其较正常的运行起来即可.
这时, 这个 App 运行就可以看到导航条, 但是还没有 tab. 写代码, 给导航条添加 tab, 如截图:
这时运行效果是这样的:
(3)响应 tab 的点击
给导航条写上事件监听, 如下图:
至此, 一个底部导航条的基本功能与效果就实现了, 是不是很简单? 后继再介绍更多的界面效果.
来源: https://www.cnblogs.com/freeself/p/10326605.html