Android Android studio 底部导航栏的基本实现

人生必须的知识就是引人向光明方面的明灯。这篇文章主要讲述Android Android studio 底部导航栏的基本实现相关的知识，希望能为你提供帮助。
【爱迪的懂】本期来学一学一个底部导航栏的基本实现~

效果图：点击三个按钮任意一个，切换页面上文字。

文章图片

步骤：
1.准备
开始前需要准备导航栏底部的图片，以及点击后变换的图片，这里共6张。放在 drawable 下

文章图片

2.新建一个Activity

文章图片
,修改他对应的布局文件

FrameLayout：相当于一个碎片的容器

1 < LinearLayout 2xmlns:android="http://schemas.android.com/apk/res/android" 3android:id="@+id/main_body_bar" 4android:orientation="vertical" 5android:layout_width="match_parent" 6android:layout_height="match_parent"> 7 8< include layout="@layout/bottom_title_bar"/> 9 10< RelativeLayout 11android:id="@+id/main_body" 12android:layout_width="match_parent" 13android:layout_height="match_parent"> 14 15< FrameLayout 16android:id="@+id/fl_container" 17android:layout_width="match_parent" 18android:layout_height="match_parent" 19android:layout_above="@+id/bottom_bar"/> 20 21< LinearLayout 22android:id="@+id/bottom_bar" 23android:layout_alignParentBottom="true" 24android:orientation="horizontal" 25android:background="#F2F2F8" 26android:layout_width="match_parent" 27android:layout_height="50dp"> 28< RelativeLayout 29android:id="@+id/bottom_bar_1_btn" 30android:layout_weight="1" 31android:layout_width="0dp" 32android:layout_height="match_parent"> 33< TextView 34android:id="@+id/bottom_bar_text_1" 35android:layout_width="match_parent" 36android:layout_height="wrap_content" 37android:layout_alignParentBottom="true" 38android:layout_centerHorizontal="true" 39android:layout_marginBottom="2dp" 40android:gravity="center" 41android:text="botton_1" 42android:textColor="#000000" 43android:textSize="14sp"/> 44< ImageView 45android:id="@+id/bottom_bar_image_1" 46android:layout_width="30dp" 47android:layout_height="30dp" 48android:layout_above="@+id/bottom_bar_text_1" 49android:layout_alignParentTop="true" 50android:layout_centerHorizontal="true" 51android:layout_marginTop="2dp" 52android:src="https://www.songbingjia.com/android/@drawable/main_button_1"/> 53< /RelativeLayout> 54 55< RelativeLayout 56android:id="@+id/bottom_bar_2_btn" 57android:layout_weight="1" 58android:layout_width="0dp" 59android:layout_height="match_parent"> 60< TextView 61android:id="@+id/bottom_bar_text_2" 62android:layout_width="match_parent" 63android:layout_height="wrap_content" 64android:layout_alignParentBottom="true" 65android:layout_centerHorizontal="true" 66android:layout_marginBottom="2dp" 67android:gravity="center" 68android:text="botton_1" 69android:textColor="#000000" 70android:textSize="14sp"/> 71< ImageView 72android:id="@+id/bottom_bar_image_2" 73android:layout_width="30dp" 74android:layout_height="30dp" 75android:layout_above="@+id/bottom_bar_text_2" 76android:layout_alignParentTop="true" 77android:layout_centerHorizontal="true" 78android:layout_marginTop="2dp" 79android:src="https://www.songbingjia.com/android/@drawable/main_button_2"/> 80< /RelativeLayout> 81< RelativeLayout 82android:id="@+id/bottom_bar_3_btn" 83android:layout_weight="1" 84android:layout_width="0dp" 85android:layout_height="match_parent"> 86< TextView 87android:id="@+id/bottom_bar_text_3" 88android:layout_width="match_parent" 89android:layout_height="wrap_content" 90android:layout_alignParentBottom="true" 91android:layout_centerHorizontal="true" 92android:layout_marginBottom="2dp" 93android:gravity="center" 94android:text="botton_1" 95android:textColor="#000000" 96android:textSize="14sp"/> 97< ImageView 98android:id="@+id/bottom_bar_image_3" 99android:layout_width="30dp" 100android:layout_height="30dp" 101android:layout_above="@+id/bottom_bar_text_3" 102android:layout_alignParentTop="true" 103android:layout_centerHorizontal="true" 104android:layout_marginTop="2dp" 105android:src="https://www.songbingjia.com/android/@drawable/main_button_3"/> 106< /RelativeLayout> 107< /LinearLayout>

3. 返回该活动中

文章图片
，初始化布局文件中的控件

文章图片

文章图片

4. 新建三个Fragment （这里后两个我复制的第一个），后面只针对一个说明，其余效果相同

文章图片

5.打开其中一个布局文件，设置一个TextView (其余两个修改一下 text 就行)

文章图片

6.返回对应的 Activity 修改代码（其他两个对应修改成各自的）

文章图片

onCreateView()参考 : https://blog.csdn.net/weixin_44618862/article/details/98209943
onViewCreated()参考：https://www.jianshu.com/p/20b1f11b72b8
inflater.inflate()参数详解：https://blog.csdn.net/weixin_41213648/article/details/98453845

7. 再次打开

文章图片
，将三个 Fragment 创建

文章图片

8. 写一个底部导航栏状态的切换方法

文章图片

9. 实现底部导航栏的响应
添加监听方方式：通过当前类实现OnClickListener接口并在其必须实现的onClick方法中添加事件

【Android Android studio 底部导航栏的基本实现】

文章图片

文章图片

9.1 点击事件
这里我设置了一个 TAG，目的是：如果一直都是 ADD ，会造成 fragment 重叠的效果，所以 TAG判断是否为第一次点击，如果不是则执行 replace 方法

文章图片

getSupportFragmentManager().beginTransaction()： https://www.jianshu.com/p/5761ee2d3ea1
10. 总结
到这里就差不多可以运行啦~ 可实现点击按钮切换碎片容器内的内容啦~
学习期间也出现过许多困难，比如在寻找学习教程的时找了很久，说到这不得不感觉 B站的up主和博主们，B站也是一个神仙app,安利。
还有遇到的就是方法过时等一些问题，不过这都不是事，一点一点解决，加油，奥里给！