Android 开发BottomNavigationView学习

Posted 2022-01-11 guanxinjing

前言

　　注意这个里介绍的是androidX的com.google.android.material.bottomnavigation.BottomNavigationView

xml布局中

   <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation_view"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:menu="@menu/p_home_bottom_menu"
        app:labelVisibilityMode="labeled"
        app:itemTextColor="@color/fontBlack1"
        app:itemTextAppearanceActive="@style/Active"
        app:itemTextAppearanceInactive="@style/Inactive"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent">

    </com.google.android.material.bottomnavigation.BottomNavigationView>

 

• app:labelVisibilityMode="labeled" 　　标签显示模式,其实就是改变点选后的整体动画,推荐选中labeled,默认的太恶心了超过3个item就会出现超丑的动画
• app:itemTextColor="@color/fontBlack1"  　　item文本的颜色
• app:itemTextAppearanceActive="@style/Active" 设置选中后的item效果
• app:itemTextAppearanceInactive="@style/Inactive"  设置未选中的item效果

style

<style name="Active" parent="@style/TextAppearance.AppCompat.Caption">
        <item name="android:textSize">@dimen/font_size_17</item>
    </style>

    <style name="Inactive" parent="@style/TextAppearance.AppCompat.Caption">
        <item name="android:textSize">@dimen/font_size_11</item>
    </style>

只是改变文字大小

menu

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

    <item
        android:id="@+id/home"
        android:title="首页"
        android:icon="@mipmap/ic_admission"/>

    <item
        android:id="@+id/notice"
        android:title="通知"
        android:icon="@mipmap/ic_head"/>

    <item
        android:id="@+id/circle"
        android:title="圈子"
        android:icon="@mipmap/ic_temp"/>

    <item
        android:id="@+id/my_info"
        android:title="我的"
        android:icon="@mipmap/ic_notice"/>

</menu>

图标被Tint颜色覆盖

图标添加后你会发现图标会被Tint颜色覆盖变成灰色的图标,下面这两行代码解决这个问题

        mBottomNavigationView = findViewById(R.id.bottom_navigation_view);
        mBottomNavigationView.setItemIconTintList(null);

 

如果你需要改变选中图标

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false" android:drawable="@drawable/ic_home_page_normal"/>
    <item android:state_checked="true" android:drawable="@drawable/ic_home_page_selected"/>
</selector>

在menu的item上调用

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

 两个点击监听

mBottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() 
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem menuItem) 
                Log.e("ytzn", "onNavigationItemSelected: 选中"+menuItem.getItemId() );
                return true;
            
        );
        mBottomNavigationView.setOnNavigationItemReselectedListener(new BottomNavigationView.OnNavigationItemReselectedListener() 
            @Override
            public void onNavigationItemReselected(@NonNull MenuItem menuItem) 
                Log.e("ytzn", "onNavigationItemSelected: 选中状态再次选中"+menuItem.getItemId() );

            
        );

setOnNavigationItemSelectedListener 是点击未选择的item后的回调,返回的boolean是决定是否启用选中效果或者放大效果

setOnNavigationItemReselectedListener 是如果已经是选中状态后,在点击一次后的回调

end