目录
[1. BottomNavigationView](#1. BottomNavigationView)
[(1) 准备BottomNavigationView使用的菜单资源文件](#(1) 准备BottomNavigationView使用的菜单资源文件)
[(2) 准备颜色选择器](#(2) 准备颜色选择器)
[(3) BottomNavigationView控件设置](#(3) BottomNavigationView控件设置)
[(4) 在Java代码中设置OnItemSelectedListener监听器](#(4) 在Java代码中设置OnItemSelectedListener监听器)
[(5) 与Fragment配合](#(5) 与Fragment配合)
[2. BottomTabBar](#2. BottomTabBar)
实现安卓底部导航栏,google为我们提供了BottomNavigationView类。第三方提供了简易版BottomTabBar类。
1. BottomNavigationView
(1) 准备BottomNavigationView使用的菜单资源文件
res / menu / xxx.xml
使用BottonNavigationView中app:menu属性 设置。
java
//例.
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:showIn="navigation_view">
<item android:id="@+id/item1"
android:icon="@drawable/ic_home_main"
android:title="home"/>
<item android:id="@+id/item2"
android:icon="@drawable/ic_home_butt"
android:title="butt"/>
<item android:id="@+id/item3"
android:icon="@drawable/ic_home_chat"
android:title="chat"/>
<item android:id="@+id/item4"
android:icon="@drawable/ic_home_mime"
android:title="mime"/>
</menu>
(2) 准备颜色选择器
BottomNavigationView的颜色通常设置为颜色选择器,然后使用 app:itemTextColor属性 设置文字颜色 ,使用 app:itemIconTint属性 设置图标颜色,也可不进行设置。
res / color / xxx.xml
java
//例.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/purple_700" android:state_checked="true"/>
<item android:color="@color/black" android:state_checked="false"/>
</selector>
(3) BottomNavigationView控件设置
java
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="@menu/bottom_navigation_view_menu"
app:itemTextColor="@color/my_color"
app:itemIconTint="@color/my_color" />
(4) 在Java代码中设置OnItemSelectedListener监听器
java
BottomNavigationView bottomNavigationView=findViewById(R.id.bottomNavigationView);
bottomNavigationView.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
public boolean onNavigationItemSelected(MenuItem item) {
// 选择item
if( item.getItemId() == R.id. itemX ){
//判断点击的Item的Id是否是指定Item的Id
}
//必须返回true,返回falseBottomNavigationView将不变化
return true;
}
});
(5) 与Fragment配合
BottomNavigationView与Fragment的配合一般通过onItemSelectedListener监听器
获取碎片管理者,需使用getSupportFragmentManager(),而getFragmentManager()已淘汰
java
public class MainActivity extends AppCompatActivity {
private Fragment f1,f2,f3,f4;
private FragmentManager fragmentManager;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
f1=new Fragment1();
f2=new Fragment2();
f3=new Fragment3();
f4=new Fragment4();
//获取碎片管理者,需使用getSupportFragmentManager(),而getFragmentManager()已淘汰
fragmentManager=getSupportFragmentManager();
FragmentTransaction fragmentTransaction= fragmentManager.beginTransaction();
fragmentTransaction.add(R.id.frameLayout,f1);
fragmentTransaction.add(R.id.frameLayout,f2);
fragmentTransaction.add(R.id.frameLayout,f3);
fragmentTransaction.add(R.id.frameLayout,f4);
fragmentTransaction.hide(f2);
fragmentTransaction.hide(f3);
fragmentTransaction.hide(f4);
fragmentTransaction.commit();
BottomNavigationView bottomNavigationView=findViewById(R.id.bottomNavigationView);
bottomNavigationView.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
private int nowFragment=R.id.item1;
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
int itemId=item.getItemId();
FragmentTransaction fragmentTransaction= fragmentManager.beginTransaction();
switch (nowFragment){
case R.id.item1:fragmentTransaction.hide(f1);break;
case R.id.item2:fragmentTransaction.hide(f2);break;
case R.id.item3:fragmentTransaction.hide(f3);break;
case R.id.item4:fragmentTransaction.hide(f4);break;
}
switch (itemId){
case R.id.item1:fragmentTransaction.show(f1);break;
case R.id.item2:fragmentTransaction.show(f2);break;
case R.id.item3:fragmentTransaction.show(f3);break;
case R.id.item4:fragmentTransaction.show(f4);break;
}
fragmentTransaction.commit();
nowFragment=itemId;
return true;
}
});
}
}
2. BottomTabBar
该方法于2018.8.25进行最后一次更新,不建议使用。
java
compile 'com.hjm:BottomTabBar:1.2.2'
java
<com.hjm.bottomtabbar.BottomTabBar
android:id="@+id/bottom_tab_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"
hjm:tab_bar_background="#FFFFFF" //BottomTabBar的整体背景颜色
hjm:tab_divider_background="#FF0000" //分割线背景
hjm:tab_font_size="14px" //文字尺寸
hjm:tab_img_font_padding="0" //图片文字间隔
hjm:tab_img_height="70px" //图片高度
hjm:tab_img_width="70px" //图片宽度
hjm:tab_isshow_divider="true" //是否显示分割线
hjm:tab_padding_bottom="5px" //下边距
hjm:tab_padding_top="5px" //上边距
hjm:tab_selected_color="#000000" //选中的颜色
hjm:tab_unselected_color="@color/colorPrimary"/> //未选中的颜色
java
mBottomBar = findViewById(R.id.bottom_bar);
mBottomBar.init(getSupportFragmentManager(), 720, 1280)
// .setImgSize(70, 70)
// .setFontSize(14)
// .setTabPadding(5, 0, 5)
// .setChangeColor(Color.parseColor("#FF00F0"),Color.parseColor("#CCCCCC"))
.addTabItem("第一项", R.mipmap.home_selected, R.mipmap.home, OneFragment.class)
.addTabItem("第二项", R.mipmap.list, TwoFragment.class)
.addTabItem("第三项", R.mipmap.user, ThreeFragment.class)
// .isShowDivider(true)
// .setDividerColor(Color.parseColor("#FF0000"))
// .setTabBarBackgroundColor(Color.parseColor("#00FF0000"))
.setOnTabChangeListener(new BottomTabBar.OnTabChangeListener() {
@Override
public void onTabChange(int position, String name, View view) {
if (position == 1)
mBottomBar.setSpot(1, false);
}
})
.setSpot(1, true)
.setSpot(2, true);