要点：本文主要写使用 BottomNavigationView 和遇到的一些问题的解决办法
引言
作为谷歌 Material Design Components 新控件 BottomNavigationView， 提供应用底部导航栏的实现。没有这个控件之前，Android 底部导航栏一般通过 LinearLayout 包裹几个 Button 或使用 RadioGroup 和 RadioButton 来实现。使用 BottomNavigationView 这个控件，可以提供更好的用户体验和开发更容易。此文主要介绍在使用 BottomNavigationView 过程中遇到的几个问题。
如何使用
添加依赖
这个没有什么好说的
compile 'com.android.support:design:25.0.0'
添加布局
布局分两个部分，首先是总的布局：
<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:itemIconTint="@color/tab_home"
app:itemTextColor="@color/tab_home"
android:layout_gravity="bottom"
android:background="?android:attr/windowBackground"
app:menu="@menu/navigation" />
其次，配置导航项。在 res 的 menu 目录下创建上面代码中 app:menu="@menu/bottom_menu" 要引用到的文件：
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/navigation_home"
android:icon="@drawable/ic_home"
android:title="@string/title_home" />
<item
android:id="@+id/navigation_category"
android:icon="@drawable/ic_category"
android:title="@string/title_category" />
<item
android:id="@+id/navigation_activity"
android:icon="@drawable/ic_activity"
android:title="@string/title_activity" />
<item
android:id="@+id/navigation_cart"
android:icon="@drawable/ic_cart"
android:title="@string/title_cart" />
<item
android:id="@+id/navigation_mine"
android:icon="@drawable/ic_mine"
android:title="@string/title_mine" />
</menu>
事件处理
主要是点击事件的处理，代码如下：
navigation = (BottomNavigationView) findViewById(R.id.navigation);
navigation.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.navigation_home:
return true;
case R.id.navigation_category:
setTitle(R.string.title_category);
return true;
case R.id.navigation_activity:
setTitle(R.string.title_activity);
return true;
case R.id.navigation_cart:
setTitle(R.string.title_cart);
return true;
case R.id.navigation_mine:
setTitle(R.string.title_mine);
return true;
}
return false;
}
});
通过以上的代码，我们的代码就能运行起来，效果图如下:[图片上传失败...(image-7e3f7a-1512980965647)]：
没那么简单
很快你会发现，接入简单，但是真正符合我们的设计要求，我们还需要捣腾捣腾。
下面列举一下我遇到的问题：
- 当导航项大于三个的时候，选中项变大，其它文字被隐藏
- 当我们自定义默认和选中图之后，选中的效果图变色了
问题来了，我们怎么解决呢？
针对第一个问题，在网上查资料后，发现是 mShiftingMode 的问题，默认是开启的且谷歌没有开放修改接口。既然谷歌不给修改接口，那么我们就硬来，用反射来解决。实现代码如下：
BottomNavigationViewHelper.disableShiftMode(navigation);
BottomNavigationViewHelper 代码如下：
public class BottomNavigationViewHelper {
public static void disableShiftMode(BottomNavigationView view) {
BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
try {
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);
item.setShiftingMode(false);
item.setChecked(item.getItemData().isChecked());
}
} catch (NoSuchFieldException e) {
Log.e("BottomNavigationViewHelper", "Unable to get shift mode field", e);
} catch (IllegalAccessException e) {
Log.e("BottomNavigationViewHelper", "Unable to change value of shift mode", e);
}
}
}
针对第二个问题，各种谷歌百度后，发现是控件默认着色器的问题。知道问题所在，解决起来就简单了。只需一行代码禁 tint 就好了
navigation.setItemIconTintList(null);
默认和选中文字的颜色，只需要添加颜色 selector 就可以了
app:itemTextColor="@color/tab_home"
另外，BottomNavigationView 支持的导航项数量是3-5个。
总结
谷歌 BottomNavigationView 效果是挺好的，使用很方便，特效也很不错，唯一不足就是接口不太友善。总的来说，这个控件使用容易且效果很赞，建议使用。
源文地址
http://ihongqiqu.com/2017/06/14/BottomNavigationView/
作者为
