ANDROID BottomNavigationBar底部导航栏的实现示例

概述第一种介绍的就是使用开源库，因为使用开源库最简单，也更加的符合我们的审美标准，同时BottomNavigationBar还是符合当前的MaterialDesign标准的。

第一种介绍的就是使用开源库，因为使用开源库最简单，也更加的符合我们的审美标准，同时BottomNavigationbar还是符合当前的Material Design标准的。

效果展示

@H_404_23@

依赖

compile'com.ashokvarma.androID:bottom-navigation-bar:1.2.0'

布局文件

activity_main.xml

<?xml version="1.0" enCoding="utf-8"?><linearLayout  xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  androID:orIEntation="vertical">  <FrameLayout    androID:ID="@+ID/fragment_container"    androID:layout_wIDth="match_parent"    androID:layout_height="0dp"    androID:layout_weight="1"/>  <com.ashokvarma.bottomnavigation.BottomNavigationbar    androID:ID="@+ID/bottom_navigation_bar"    androID:layout_wIDth="match_parent"    androID:layout_height="wrap_content"    androID:layout_gravity="bottom"/></linearLayout>

对于下面将要使用到四个Fragment里面的布局文件

1.fragment_index.xml
2.fragment_map.xml
3.fragment_love.xml
4.fragment_person.xml

只需要将其中的androID:text属性中的内容进行修改以做区分

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:orIEntation="vertical"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  androID:gravity="center">  <TextVIEw    androID:text="主页"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content" /></linearLayout>

Java代码

public class MainActivity extends AppCompatActivity implements BottomNavigationbar.OnTabSelectedListener {  BottomNavigationbar mBottomNavigationbar;  private IndexFragment indexFragment;  private MapFragment mapFragment;  private loveFragment loveFragment;  private PersonFragment personFragment;  private BadgeItem badgeItem;  @OverrIDe  protected voID onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentVIEw(R.layout.activity_main);    initBadge();    setDefaultFragment();    InitNavigationbar();  }  private voID InitNavigationbar() {    mBottomNavigationbar = (BottomNavigationbar)findVIEwByID(R.ID.bottom_navigation_bar);    mBottomNavigationbar.setTabSelectedListener(this);    mBottomNavigationbar.setMode(BottomNavigationbar.MODE_SHIFTING);    mBottomNavigationbar.setBackgroundStyle(BottomNavigationbar.BACKGROUND_STYLE_RIPPLE);    mBottomNavigationbar        .addItem(new BottomNavigationItem(R.drawable.icon_index,"首页").setActivecolorResource(R.color.red))        .addItem(new BottomNavigationItem(R.drawable.icon_map,"地图").setActivecolorResource(R.color.blue))        .addItem(new BottomNavigationItem(R.drawable.icon_love,"关注").setActivecolorResource(R.color.yellow).setBadgeItem(badgeItem))        .addItem(new BottomNavigationItem(R.drawable.icon_person,"个人").setActivecolorResource(R.color.green))        .setFirstSelectedposition(0)        .initialise();  }  public voID initBadge()  {    badgeItem = new BadgeItem()          .setborderWIDth(2)          .setbordercolor("#ff0000")          .setBackgroundcolor("#ff0000")          .setGravity(Gravity.RIGHT| Gravity.top)          .setText("2")          .setTextcolor("#ffffff")          .setAnimationDuration(2000)          .setHIDeOnSelect(true);  }  private voID setDefaultFragment() {    FragmentManager fm = getSupportFragmentManager();    FragmentTransaction transaction = fm.beginTransaction();    indexFragment = new IndexFragment();    transaction.replace(R.ID.fragment_container,indexFragment);    transaction.commit();  }  @OverrIDe  public voID onTabSelected(int position) {    Log.d("onTabSelected","onTabSelected: " + position);    FragmentManager fm = getSupportFragmentManager();    FragmentTransaction transaction = fm.beginTransaction();    switch (position) {      case 0:        if (indexFragment == null) {          indexFragment = new IndexFragment();        }        transaction.replace(R.ID.fragment_container,indexFragment);        break;      case 1:        if (mapFragment== null) {          mapFragment = new MapFragment();        }        transaction.replace(R.ID.fragment_container,mapFragment);        break;      case 2:        if (loveFragment == null) {          loveFragment = new loveFragment();        }        transaction.replace(R.ID.fragment_container,loveFragment);        break;      case 3:        if (personFragment == null) {          personFragment = new PersonFragment();        }        transaction.replace(R.ID.fragment_container,personFragment);        break;      default:        break;    }    // 事务提交    transaction.commit();  }  @OverrIDe  public voID onTabUnselected(int position) {    Log.d("onTabUnselected","onTabUnselected: " + position);  }  @OverrIDe  public voID onTabReselected(int position) {    Log.d("onTabReselected","onTabReselected: " + position);  }}

代码分析

1.初始化导航条样式

对于Mode和BackgroundStyle各有3种选择

Mode

在xml代码使用androID:bnbMode属性 在Java代码中使用setMode方法

MODE_DEFAulT：如果Item的个数<=3就会使用MODE_FIXED模式，否则使用MODE_SHIFTING模式。
MODE_FIXED：填充模式，未选中的Item会显示文字，没有换挡动画。
MODE_SHIFTING：换挡模式，未选中的Item不会显示文字，选中的会显示文字。在切换的时候会有一个像换挡的动画。

BackgroundStyle

在xml代码使用androID:bnbBackgroundStyle属性 在Java代码中使用setBackgroundStyle方法

BACKGROUND_STYLE_DEFAulT：如果设置的Mode为MODE_FIXED，将使用BACKGROUND_STYLE_STATIC 。如果Mode为MODE_SHIFTING将使用BACKGROUND_STYLE_RIPPLE。
BACKGROUND_STYLE_STATIC：点击的时候没有水波纹效果
BACKGROUND_STYLE_RIPPLE：点击的时候有水波纹效果

2.初始化导航条条目

需要几个就添加几个，包含图片和图片下方代表的文字以及设定被选中时产生效果的颜色。

复制代码 代码如下:
mBottomNavigationbar.addItem(new BottomNavigationItem(R.drawable.icon_index,"首页").setActivecolorResource(R.color.red))；

3.初始化Badge

badgeItem = new BadgeItem().setborderWIDth(2)//边框宽度          .setbordercolor("#ff0000")//边框颜色          .setBackgroundcolor("#ff0000")//背景颜色          .setGravity(Gravity.RIGHT| Gravity.top)//显示位置          .setText("2")//显示文字          .setTextcolor("#ffffff")//文字颜色          .setAnimationDuration(2000)//渐退、渐出的时间          .setHIDeOnSelect(true);//选中时是否消失

然后为特定需要设置Badge的条目设置上

复制代码 代码如下:
mBottomNavigationbar.addItem(new BottomNavigationItem(R.drawable.icon_love,"关注").setActivecolorResource(R.color.yellow).setBadgeItem(badgeItem))；

4.初始化Fragment

在activity_main.xml当中有一个FrameLayout，这个需要当导航条条目发生改变时，对应着发生改变。

setDefaultFragment()：当活动打开时，事先显示哪个fragment

FragmentManager fm = getSupportFragmentManager();    FragmentTransaction transaction = fm.beginTransaction();    indexFragment = new IndexFragment();    transaction.replace(R.ID.fragment_container,indexFragment);    transaction.commit();

下面则为下面的导航条目绑定监听事件

mBottomNavigationbar.setTabSelectedListener(this);

onTabSelected():当选中的导航条目发生改变时

FragmentManager fm = getSupportFragmentManager();    FragmentTransaction transaction = fm.beginTransaction();    switch (position) {      case 0:        if (indexFragment == null) {          indexFragment = new IndexFragment();        }        transaction.replace(R.ID.fragment_container,personFragment);        break;      default:        break;    }    // 事务提交    transaction.commit();

总结

代码和解析都在上方，初学者一定要仔细的使用，方能很好的掌握。

源码：BottomBarOne_jb51.rar

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的ANDROID BottomNavigationBar底部导航栏的实现示例全部内容，希望文章能够帮你解决ANDROID BottomNavigationBar底部导航栏的实现示例所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。