使用BottomNavigationView实现底部导航栏

笔者的SDK版本为27，此文章适合27及以下，如果是28及以上版本请看 使用谷歌官方BottomNavigationView实现非md风格的底部状态栏 更加简单

首先我们需要了解 Bottom Navigation是5.0(API level 21）新出的一种符合Material Design规范的导航栏规范。

在Android Studio中我们可以直接选择新建 BottomNavigation 的模板 Activity ，网上也有好多开源库比google自带的这个模板更好更美观的项目，比如ahbottomnavigation，BottomBar，BottomNavigation。

下面我们新建一个BottomNavigation项目，当然也可以在你原有的项目java文件中右键new->Activity->Bottom Navigation Activity

项目建完以后我们可以看到AS已经自动为我们把MainActivity和activity_main.xml的代码填充完成，效果图如下。那么此时我们的项目就完成了么？不不不，我们现在还只是一个通用的模板，一般我们的项目需要根据自己的需求修改其中的一些代码。

那么我们该修改哪里，如何去修改呢，这就需要我们去看一下这些代码都是什么意思了。首先我们看布局文件，TextView部分很好理解，一些基本的属性我在这里就不解释了，其中的layout_margin......="@dimen/......" 这个就是在values文件夹下生成了一个尺寸资源文件，我们ctrl+左键点进去之后就会看到设置的是很简单的竖直和水平距离。

接下来就是BottomNavigationView这个控件，大家有兴趣可以点进去看看源码，由于我水平有限在这里就不过多解释。它用到了一个菜单menu，我们点进去看到navigation.xml的代码如下：

显然大家可以看出来这里控制的就是我们底部导航个数，此时默认生成的为三个，title就是名称，icon就是图案，我们点进去其中一个icon发现代码如下，是一个SVG文件，具体什么是SVG和具体的用法大家可以自行百度。

 到此布局文件我们已经看完了，MainActivity中就是对点击事件进行监听处理，大概的功能大家都能看懂，如果要想彻底理解还是要去看源码并分析。

既然代码大家都基本理解了，下面我们就要把模板修改成我们想要的样子了

 在navigation.xml中修改icon所对应的文件中设置, 就可以修改图标了。 比如在 ../drawable/ic_home_black_24dp.xml修改如下：

然后对其余的两个文件进行相同的操作，我的图片是从阿里巴巴矢量库中获取的，此时我们完成了对原有图标的修改，而一般我们的app都是有4个底部导航，这时候就需要我们去进行添加一个item了。

去navigation.xml添加一个item，属性和上面的一样，然后定义一个icon，最后别忘记去MainActivity中添加上对这个item的监听，此时底部的效果图如下：

 此时我们看到下面的图标并没有进行均分，这时我们要注意：

1、BottomNavigationView只适用于3到5个的导航栏；

2、当tab个数大余3个时，BottomNavigationView并不会均分宽度。

具体的修改实现请参考https://blog.csdn.net/IWantToHitRen/article/details/77338138

class BottomNavigationViewHelper {
    @SuppressLint("RestrictedApi")
    public static void disableShiftMode(BottomNavigationView view) {
        //获取子View BottomNavigationMenuView的对象
        BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
        try {
            //设置私有成员变量mShiftingMode可以修改
            Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
            shiftingMode.setAccessible(true);
            shiftingMode.setBoolean(menuView, false);
            shiftingMode.setAccessible(false);
            for (int i = 0; i < menuView.getChildCount(); i++) {
                BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
                //去除shift效果
                item.setShiftingMode(false);
                item.setChecked(item.getItemData().isChecked());
            }
        } catch (NoSuchFieldException e) {
            Log.e("BNVHelper", "没有mShiftingMode这个成员变量", e);
        } catch (IllegalAccessException e) {
            Log.e("BNVHelper", "无法修改mShiftingMode的值", e);
        }
    }
}

然后在onCreate中调用这个方法即可

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mTextMessage = (TextView) findViewById(R.id.message);
        BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation);
        BottomNavigationViewHelper.disableShiftMode(navigation);
        navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener);
    }

 然后我们就已经实现了底部导航栏有四个图标，截图如下：

本人水平有限，如有错误请指正。