Android 导航 BottomNavgiationView

Android的底部导航栏 效果如下：

底部导航效果.png

代码如下:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="?attr/actionBarSize">

   <!--  底部导航栏  -->
    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_btn_view"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu"
        android:layout_alignParentBottom="false"
        android:elevation="1dp"
        app:elevation="1dp"
        app:itemBackground="@null"
        app:itemHorizontalTranslationEnabled="false"
        app:labelVisibilityMode="labeled"/>

    <!--  navigation导航栏  -->
    <fragment
        android:id="@+id/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@id/nav_btn_view"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/mobile_navigation" />

</androidx.constraintlayout.widget.ConstraintLayout>

常用属性

• app:itemTextColor="" 设置文字颜色
• app:itemIconTint="" 设置图片颜色 使用自己的图片是记得在代码中添加 navBtnView.setItemIconTintList(null);
• app:labelVisibilityMode="labeled" 选中的图标不让变大

• app:menu="@menu/bottom_nav_menu" 设置底部导航栏条目
  在res文件夹下创建menu文件创建menu.xml文件

  
  image.png
  

  代码如下:

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

    <item
        android:id="@+id/navigationbtm_home"
        android:icon="@drawable/select_bottom_bar_home"
        android:title="@string/title_home" />

    <item
        android:id="@+id/navigationbtm_find"
        android:icon="@drawable/select_bottom_bar_find"
        android:title="@string/title_dashboard" />

    <item
        android:id="@+id/navigationbtm_my"
        android:icon="@drawable/ic_notifications_black_24dp"
        android:title="@string/title_notifications" />

</menu>

icon图片使用的选择器

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

点击事件的监听：

navBtnView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {  //navBtnView控件名
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                NavController navController = Navigation.findNavController(MainActivity.this, R.id.nav_host_fragment);
                switch (item.getItemId()){
                    case R.id.navigationbtm_home:
                        navController.navigate(R.id.navigation_home);
                        showToast("主页");
                        break;
                    case R.id.navigationbtm_find:
                        showToast("发现");
                        navController.navigate(R.id.navigation_find);
                        break;
                    case R.id.navigationbtm_my:
                        showToast("我的");
                        navController.navigate(R.id.navigation_my);
                        break;
                }
                return true;
            }
        });