1.布局文件：

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

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

    <com.ashokvarma.bottomnavigation.BottomNavigationBar
        android:layout_alignParentBottom="true"
        android:id="@+id/bottom_navigation_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
      />

</RelativeLayout>

顶部的viewpager+底部的bottomnavgationbar

2.框架的配置：
2.1 初始化 viewpager

viewpager bottomNavigationBar = findViewById(R.id.bottom_navigation_bar);

2.2 初始化fragment

    private void initFragment() {
        mHomefragment =new HomeFragmnent();
        mNavgationfragment = new NavgationFragment();
        mSystemfragment = new SystemFragment();
        mSubjectfragment = new SubjectFragment();
        mMefragment = new MeFragment();
        mFragmentList.add(mHomefragment);
        mFragmentList.add(mNavgationfragment);
        mFragmentList.add(mSystemfragment);
        mFragmentList.add(mSubjectfragment);
        mFragmentList.add(mMefragment);
    }

2.3
初始化底部条目

    private void initBottomItems() {
        BottomNavigationItem homeItem = new BottomNavigationItem(R.drawable.select_home, "首页").
                setActiveColorResource(R.color.common_blue)
                .setInActiveColorResource(R.color.text_normal);
        BottomNavigationItem knowItem = new BottomNavigationItem(R.drawable.select_knowledge, "知识").
                setActiveColorResource(R.color.common_blue)
                .setInActiveColorResource(R.color.text_normal);
        BottomNavigationItem navItem = new BottomNavigationItem(R.drawable.select_navgation, "体系").
                setActiveColorResource(R.color.common_blue)
                .setInActiveColorResource(R.color.text_normal);
        BottomNavigationItem projectItem = new BottomNavigationItem(R.drawable.select_project, "项目").
                setActiveColorResource(R.color.common_blue)
                .setInActiveColorResource(R.color.text_normal);
        BottomNavigationItem meItem = new BottomNavigationItem(R.drawable.select_ne, "我的").
                setActiveColorResource(R.color.common_blue)
                .setInActiveColorResource(R.color.text_normal);

                 bottomNavigationBar.addItem(homeItem).addItem(knowItem).addItem(navItem).addItem(projectItem).addItem(meItem).
                setMode(BottomNavigationBar.MODE_SHIFTING)
                .setBackgroundStyle(BottomNavigationBar.BACKGROUND_STYLE_RIPPLE)
                .setBarBackgroundColor(R.color.common_white)
                .initialise();
        bottomNavigationBar.setTabSelectedListener(new BottomNavigationBar.OnTabSelectedListener() {
            @Override
            public void onTabSelected(int position) {
mViewpwgwe.setCurrentItem(position);
            }

            @Override
            public void onTabUnselected(int position) {

            }

            @Override
            public void onTabReselected(int position) {

            }
        });

    }

2.4 设置viewpager的适配器，将viewpager和fragment绑定，同时处理pager滑动后的底部导航的回复

    private void initViewpager() {
        MainFragmentPagerAdapter adapter = new MainFragmentPagerAdapter(getSupportFragmentManager(),mFragmentList);
        mViewpwgwe.setAdapter(adapter);
        mViewpwgwe.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                bottomNavigationBar.selectTab(position);
            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
    }

2.5 MainFragmentPagerAdapter 适配器

public class MainFragmentPagerAdapter extends FragmentPagerAdapter {
    private List<BaseFragment> mFragmentList;

    public MainFragmentPagerAdapter(FragmentManager fm,List<BaseFragment> list) {
        super(fm);
        this.mFragmentList = list;
    }

    @Override
    public Fragment getItem(int position) {
        return mFragmentList.get(position);
    }

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

}