android : 底部导航栏的实现（使用ViewPager和BottomNavigationView）

本案例中需要用的控件ViewPager和BottomNavigationView

1. ViewPager：主要是页面的切换
2. Fragment：碎片（也就是每个页面的内容）
3. BottomNavigationView：底部导航栏

非常简单，主要就是一个Viewpager和BottomNavigationView

先来说一下思路：BottomNavigationView底部导航栏   ViewPager+Fragment页面

        那么我么如何设置两个控件联动（仅需要两个方法即可）

1.         ViewPager中的滑动页面监听 接口onPageSelected()方法
2.         BottomNavigationViewr中的 底部图标切换监听 接口onNavigationItemSelected()方法

  简单地说就是当我们滑动页面的时候改变底部导航栏图标id
   点击底部导航栏时更改viewpager界面

在main.xml中编辑，放入viewpager和BottomNavigationView

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity"
    >
 
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/main_vp"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />
 
    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/main_bnv"
        android:layout_width="match_parent"
        android:layout_height="73dp"
        app:labelVisibilityMode="labeled"
        app:menu="@menu/bottom_nav_menu"
        />
</LinearLayout>

在res下新建一个menu的目录；

在menu中建立一个bottom_nav_menu.xml的文件 在main中引用这个menu

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/menu_home"
        android:icon="@drawable/first"
        android:title="首页" />
    <item
        android:id="@+id/menu_order"
        android:icon="@drawable/order"
        android:title="订单" />
    <item
        android:id="@+id/menu_collection"
        android:icon="@drawable/collection"
        android:title="收藏" />
    <item
        android:id="@+id/menu_my"
        android:icon="@drawable/my"
        android:title="我的" />
</menu>

用自动的方式新建四个Fragment和对应的xml

 修改mainactivity的代码

package com.changlin.test;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;
import android.view.MenuItem;

import com.changlin.test.adapter.MainAdapter;
import com.changlin.test.fragment.FirstFragment;
import com.changlin.test.fragment.FourFragment;
import com.changlin.test.fragment.SecondFragment;
import com.changlin.test.fragment.ThirdFragment;
import com.google.android.material.bottomnavigation.BottomNavigationView;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

//将一个list 用于存放fragment
    List<Fragment> fragmentList = new ArrayList<>();



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

        //拿到两个组件
        ViewPager viewPager = findViewById(R.id.main_vp);
        BottomNavigationView bottomNavigationView = findViewById(R.id.main_bnv);

        initData();
        MainAdapter adapter = new MainAdapter(getSupportFragmentManager(), fragmentList);
        viewPager.setAdapter(adapter);


//        页面更改监听
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }

            @Override
            public void onPageSelected(int position) {
                switch (position) {
                    case 0:
                        bottomNavigationView.setSelectedItemId(R.id.menu_home);
                        break;
                    case 1:
                        bottomNavigationView.setSelectedItemId(R.id.menu_order);
                        break;
                    case 2:
                        bottomNavigationView.setSelectedItemId(R.id.menu_collection);
                        break;
                    case 3:
                        bottomNavigationView.setSelectedItemId(R.id.menu_my);
                        break;
                }
            }
            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });

//        图标选择监听
        bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId()){
                    case R.id.menu_home:
                        viewPager.setCurrentItem(0);
                        break;
                    case R.id.menu_order:
                        viewPager.setCurrentItem(1);
                        break;
                    case R.id.menu_collection:
                        viewPager.setCurrentItem(2);
                        break;
                    case R.id.menu_my:
                        viewPager.setCurrentItem(3);
                        break;
                }
                return true;
            }

        });
    }


    private void initData() {
        FirstFragment firstFragment = FirstFragment.newInstance("首页", "");
        fragmentList.add(firstFragment);
        SecondFragment secondFragment = SecondFragment.newInstance("订单", "");
        fragmentList.add(secondFragment);
        ThirdFragment thirdFragment = ThirdFragment.newInstance("收藏", "");
        fragmentList.add(thirdFragment);
        FourFragment fourFragment = FourFragment.newInstance("我的", "");
        fragmentList.add(fourFragment);
    }

}

接下来是Viewpager的适配器

 MainActivityAdapter.java

自定义一个构造函数，两个参数，一个是fragmentManager  一个是一个fragmen集合

在创建的时候，传入 getSupportFragmentManager() 和一个集合  

为viewpager设置一个适配器

package com.example.myapplication;
 
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentStatePagerAdapter;
 
import java.util.ArrayList;
import java.util.List;
 
public class MainActivityAdapter extends FragmentStatePagerAdapter {
    List<Fragment> fragmentList=new ArrayList<>();
 
    public MainActivityAdapter(@NonNull FragmentManager fm, List<Fragment> fragmentList) {
        super(fm);
        this.fragmentList = fragmentList;
    }
 
    @NonNull
    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }
 
    @Override
    public int getCount() {
        return fragmentList.size();
    }
}