Navigation+BottomNavigationView的

Navigation+BottomNavigationView的使用

Navigation简单使用

Navigation谷歌新推出导航组件，它提供了多Fragment之间的转场，栈管理，帮助你更轻松的使用Fragment；
而BottomNavigationView实现的效果就是常见的app底部导航栏的效果。
具体实例：

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_secondFragment_to_first"
            app:destination="@id/secondFragment" />
    </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" />
    </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"/>
</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;
                }
                navController.navigate(R.id.action_secondFragment_to_first);
                break;
            case R.id.menu_fragment2:
                if(item.isChecked()) {
                  return true;
                }
                navController.navigate(R.id.action_firstFragment_to_second);
                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="true"
       app:navGraph="@navigation/nav_fragment" />
<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>

6. 注意事项：
   （1）图片选择会失效,需要加上:

mNavView.setItemIconTintList(null);

（2）焦点选中时会有水波纹效果，在布局文件里去掉水波纹：

app:itemBackground="@null"

（3）修改文字切换颜色
使用itemTextColor属性来指定选中和未选中的颜色

<!--selector_navigation.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
   <item android:color="#F14040" android:state_checked="true" />
   <item android:color="#959393"/>
</selector>

app:itemTextColor="@drawable/selector_navigation"