Navigation+BottomNavigationView的

本篇主要介绍使用2个以上的tab页时的实现；

1. 接着上篇建立的FirstFragment.java, SecondFragment.java
2. 导航视图文件nav_fragment.xml修改成：

<navigation 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"
    app:startDestination="@id/firstFragment">
 
    <fragment
        android:id="@+id/firstFragment"
        android:name="com.example.jatpack.navigation.FirstFragment"
        android:label="fragment_first"
        tools:layout="@layout/fragment_first" >
        <action
            android:id="@+id/action_firstFragment_to_second"
            app:destination="@id/secondFragment" />
        <action
            android:id="@+id/action_firstFragment_to_food"
            app:destination="@id/foodFragment" />
    </fragment>
    <fragment
        android:id="@+id/secondFragment"
        android:name="com.example.jatpack.navigation.SecondFragment"
        android:label="fragment_second"
        tools:layout="@layout/fragment_second" >
      <action
            android:id="@+id/action_firstFragment_to_second"
            app:destination="@id/firstFragment" />
      <action
            android:id="@+id/action_firstFragment_to_food"
            app:destination="@id/foodFragment" />
    </fragment>
    <fragment
        android:id="@+id/foodFragment"
        android:name="com.example.jatpack.navigation.FoodFragment"
        android:label="fragment_food"
        tools:layout="@layout/fragment_food" >
      <action
            android:id="@+id/action_foodFragment_to_first"
            app:destination="@id/firstFragment" />
      <action
            android:id="@+id/action_foodFragment_to_second"
            app:destination="@id/secondFragment" />
    </fragment>
</navigation>

3. 在res下新建menu文件夹，并新建menu_navigation.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/menu_fragment1"
        android:icon="@drawable/bottom_sel"
        android:title="firstFragment"/>

    <item
        android:id="@+id/menu_fragment2"
        android:icon="@drawable/bottom_sel"
        android:title="secondFragment"/>
    <item
        android:id="@+id/menu_food"
        android:icon="@drawable/bottom_sel"
        android:title="foodFragment"/>
</menu>

bottom_sel.xml 切换icon的状态，选中与非选中时呈现不一样的图片：

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_checked="true" android:drawable="@drawable/ic_launcher_round"/>
    <item android:state_checked="false" android:drawable="@drawable/ic_launcher"/>
</selector>

4. MainActivity.java

public class MainActivity extends AppCompatActivity implements BottomNavigationView.OnNavigationItemSelectedListener {
    private NavigationController navController;
    private BottomNavigationView bottomNavView;
    private MenuItem menuItem;

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

    private void initNav(){
         navController = Navigation.findNavController(this,R.id.fragment);
        bottomNavView = (BottomNavigationView) findViewById(R.id.bottomnavigationview);
        NavigationUI.setupWithNavController(bottomNavView,navController );
        bottomeNavView.setItemIconTintList(null);
        bottomNavView.setOnNavigationItemSelectedListener(this);
    }

    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
        int itemId = item.getItemId();
        switch (itemId){
            case R.id.menu_fragment1:
                //当该项已经被选中时，不执行任何操作
                if(item.isChecked()) {
                  return true;
                }
               if (bottomNavView.getSelectedItemId() == R.id.menu_fragment2) {
                   navController.navigate(R.id.action_secondFragment_to_first);
               } else if ((bottomNavView.getSelectedItemId() == R.id.menu_food) {
                   navController.navigate(R.id.action_foodFragment_to_first);
               }
                menuItem.setChecked(true);
                break;
            case R.id.menu_fragment2:
                if(item.isChecked()) {
                  return true;
                }
                if (bottomNavView.getSelectedItemId() == R.id.menu_fragment1) {
                   navController.navigate(R.id.action_firstFragment_to_second);
               } else if ((bottomNavView.getSelectedItemId() == R.id.menu_food) {
                   navController.navigate(R.id.action_foodFragment_to_second);
               }
               menuItem.setChecked(true);
                break;
           case R.id.menu_food:
                if(item.isChecked()) {
                  return true;
                }
                if (bottomNavView.getSelectedItemId() == R.id.menu_fragment1) {
                   navController.navigate(R.id.action_firstFragment_to_food);
               } else if ((bottomNavView.getSelectedItemId() == R.id.menu_fragment2) {
                   navController.navigate(R.id.action_secondFragment_to_food);
               }
               menuItem.setChecked(true);
                break;
        }
        return false;
    }

}

5. 布局文件
   activity_main.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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
 
   <fragment
       android:name="androidx.navigation.fragment.NavHostFragment"
       android:id="@+id/fragment"
       android:layout_above="@+id/bottomnavview"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       app:defaultNavHost="false"
       app:navGraph="@navigation/nav_fragment" />
<!--app:itemBackground="@null" 去掉焦点效果-->
<android.support.design.widget.BottomNavigationView
        android:id="@+id/bottomnavview"
        android:layout_alignParentBottom="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:itemBackground="@null"
        app:menu="@menu/menu_navigation">
    </android.support.design.widget.BottomNavigationView>
</RelativeLayout>