BottomNavigationView基本使用

曾嘉祯
2023-12-01

简单介绍一下BottomNavigationView基本使用。

布局内设置:

 <com.google.android.material.bottomnavigation.BottomNavigationView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="@color/white"
        app:itemBackground="@color/white"
        app:itemIconSize="20dp"
        app:itemIconTint="@color/main_btn_selected_color"
        app:itemTextAppearanceActive="@style/bottom_tab_title_active"
        app:itemTextAppearanceInactive="@style/bottom_tab_title_inactive"
        app:itemTextColor="@color/main_btn_selected_color"
        app:labelVisibilityMode="labeled"
        app:layout_constraintBottom_toBottomOf="parent"
        app:menu="@menu/main_menu" />

1.取消水波纹动画:

将背景颜色和item背景颜色设置问一致即可。

android:background="@color/white"
app:itemBackground="@color/white"

2.图标选中颜色以及未选中颜色:

app:itemIconTint="@color/main_btn_selected_color"

   在res/color新建文件main_btn_selected_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/text_blue" android:state_checked="true" />
    <item android:color="@color/text_black" android:state_checked="false"/>
</selector>

3.文字选中以及未选中大小

app:itemTextAppearanceActive="@style/bottom_tab_title_active" //选中文字大小
app:itemTextAppearanceInactive="@style/bottom_tab_title_inactive" //未选中文字大小

styles内新建样式bottom_tab_title_active和bottom_tab_title_inactive

<!--选中的样式,可以设置选择的字体颜色,这里只是为了改变选择时的字体大小-->
<style name="bottom_tab_title_active">
    <item name="android:textSize">10sp</item>
</style>
<!--没有选中的样式,导航默认的字体大小就是10sp-->
<style name="bottom_tab_title_inactive">
    <item name="android:textSize">10sp</item>
</style>

4.文字选中和未选中颜色

app:itemTextColor="@color/main_btn_selected_color"

和图标颜色同样设置方式

5.设置menu

app:menu="@menu/main_menu"

新建menu文件main_menu.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/main_fragment"
        android:icon="@mipmap/img_home_unchecked"
        android:title="@string/text_main" />
    <item
        android:id="@+id/install_fragment"
        android:icon="@mipmap/img_install_unchecked"
        android:title="@string/text_install" />
    <item
        android:id="@+id/setting_fragment"
        android:icon="@mipmap/img_setting_unchecked"
        android:title="@string/setting" />
</menu>

结束。

 类似资料: