BottomNavigationView实现底部导航（免费赠送沉浸式实现）

一、效果图

二、实现效果

1.导入依赖（注：28.0.0以下版本有些属性不同，稍后解释）

implementation 'com.android.support:design:28.0.0'

2、xml代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/bottomview" />

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/bottomview"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        app:itemTextColor="@drawable/selector_tab_color"
        app:menu="@menu/bottom_navigation_tab" />
    <!--属性解析-->
    <!--app:itemBackground：设置item的背景-->
    <!--app:itemIconTint：  设置icon的颜色-->
    <!--app:itemTextColor： 设置文字的颜色-->
    <!--app:menu ：         设置底部导航栏icon和文字-->
</RelativeLayout>

3、menu代码

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/tab_1"
        android:icon="@drawable/icon1_selector"
        android:title="首页" />

    <item
        android:id="@+id/tab_2"
        android:icon="@drawable/icon2_selector"
        android:title="会员" />

    <item
        android:id="@+id/tab_3"
        android:icon="@drawable/icon3_selector"
        android:title="收藏" />

</menu>

4、图片选择器代码

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/icon1s" android:state_selected="true" />
    <item android:drawable="@drawable/icon1" android:state_selected="false" />
</selector>

5、activity代码（沉浸式放到里面一起送出了，不用太惊喜哦，主题我设置的这个（其他的没试）

android:theme="@style/Theme.AppCompat.Light.NoActionBar"

public class MainActivity extends AppCompatActivity {
    private ViewPager viewpager;
    private BottomNavigationView bottomview;
    private Menu menu;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
//=======================实现沉浸式效果开始===================================
        if (Build.VERSION.SDK_INT >= 21) {
            View decorView = getWindow().getDecorView();
            //让应用主题内容占用系统状态栏的空间,注意:下面两个参数必须一起使用 stable 牢固的
            int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
            decorView.setSystemUiVisibility(option);
            //设置状态栏颜色为透明
            getWindow().setStatusBarColor(Color.TRANSPARENT);
        } else {
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        }
//=======================实现沉浸式效果结束===================================
        
        viewpager = findViewById(R.id.viewpager);
        bottomview = findViewById(R.id.bottomview);
        //获取menu数据
        menu = bottomview.getMenu();
        initViewpager();
        //设置BottomNavigationView监听
        bottomview.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) {
                switch (menuItem.getItemId()) {
                    case R.id.tab_1:
                        viewpager.setCurrentItem(0);
                        break;
                    case R.id.tab_2:
                        viewpager.setCurrentItem(1);
                        break;
                    case R.id.tab_3:
                        viewpager.setCurrentItem(2);
                        break;
                 
                }
                // 这里注意返回true,否则点击失效
                return true;
            }
        });
        //设置viewpager监听
        viewpager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float v, int i1) {

            }

            @Override
            public void onPageSelected(int position) {
                menu.getItem(position).setChecked(true);
                bottomview.getMenu();
            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }
        });
    }

    private void initViewpager() {
        viewpager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
            @Override
            public Fragment getItem(int i) {
                return FragmentTest.getInstance(menu.getItem(i).getTitle().toString());
            }

            @Override
            public int getCount() {
                return menu.size();
            }
        });
    }
}

6、fragment代码（布局就一个textview，不贴了）

/**
 * @author hel
 * @date 2019-08-08
 * 文件 MyUI
 * 描述
 */
public class FragmentTest extends Fragment {
    public static FragmentTest getInstance(String content) {
        FragmentTest fragmentTest = new FragmentTest();
        Bundle bundle = new Bundle();
        bundle.putString("content", content);
        fragmentTest.setArguments(bundle);
        return fragmentTest;

    }

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View inflate = inflater.inflate(R.layout.fragment_test, container, false);
        Bundle arguments = getArguments();
        String content = arguments.getString("content");
        TextView textView = inflate.findViewById(R.id.content);
        textView.setText(content);
        return inflate;
    }

}

7、运行看效果（图标文字都显示，选中状态有放大效果）

8、再添加两个item（注：不要超过5个）

//menu文件添加
<item
        android:id="@+id/tab_4"
        android:icon="@drawable/icon4_selector"
        android:title="消息" />
<item
        android:id="@+id/tab_5"
        android:icon="@drawable/icon5_selector"
        android:title="我的" />

//activity文件添加
case R.id.tab_4:
     viewpager.setCurrentItem(3);
     break;
case R.id.tab_5:
     viewpager.setCurrentItem(4);
     break;

9、运行看效果（选中状态显示图标和文本，并有放大效果，未选中状态只显示图标）

10、想要图标文字都显示怎么办，xml中加入这个属性

app:labelVisibilityMode="labeled"

10-1、28.0.0以下没有这个属性怎么办，activity中加入这个方法，初始化BottomNavigationView之后调用一下就行了

  public void disableShiftMode(BottomNavigationView navigationView) {

        BottomNavigationMenuView menuView = (BottomNavigationMenuView) navigationView.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 itemView = (BottomNavigationItemView) menuView.getChildAt(i);
                itemView.setShiftingMode(false);
                itemView.setChecked(itemView.getItemData().isChecked());
            }

        } catch (Exception e) {
            e.printStackTrace();
        }
    }

代码如果混淆需要加入

-keepclassmembers class android.support.design.internal.BottomNavigationMenuView { 
    boolean mShiftingMode; 
}

11、运行看效果（图标文本都显示，选中有放大效果）

12、不想要放大效果怎么办，dimens中加入以下属性

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!--选中状态文本大小-->
    <dimen name="design_bottom_navigation_active_text_size">14dp</dimen>
    <!--未选中状态文本大小-->
    <dimen name="design_bottom_navigation_text_size">14dp</dimen>
</resources>

13、不运行了，效果就是图标文本都显示，选中没有放大效果