如何为Bottom Navigation选中Tab设置不同背景色？

嘿，我来帮你搞定这个问题！要给默认Navigation Tab Activity里的BottomNavigationView选中的Tab设置单独的背景色（比如你说的灰色），不用第三方库的话，咱们可以通过自定义状态选择器和调整导航栏样式来实现，具体步骤如下：

1. 创建Tab背景的状态选择器 #

首先在res/drawable目录下新建一个XML文件，命名为bottom_nav_tab_bg.xml，用来定义Tab在选中/未选中状态下的背景样式：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 选中状态的背景色，这里用你需要的灰色 -->
    <item android:drawable="@color/tab_selected_gray" android:state_checked="true" />
    <!-- 未选中状态的背景，这里设为透明，你也可以改成其他颜色 -->
    <item android:drawable="@android:color/transparent" android:state_checked="false" />
</selector>

记得在res/values/colors.xml里添加对应的颜色值：

<color name="tab_selected_gray">#E5E5E5</color>

2. 给BottomNavigationView应用背景选择器 #

接下来修改你的BottomNavigationView布局代码，通过app:itemBackground属性把刚才的选择器绑定到每个Tab上：

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:id="@+id/nav_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:background="?android:attr/windowBackground"
    app:menu="@menu/bottom_nav_menu"
    <!-- 关键：给每个Tab设置背景选择器 -->
    app:itemBackground="@drawable/bottom_nav_tab_bg"
    <!-- 可选：同时设置文字和图标的状态颜色 -->
    app:itemTextColor="@drawable/bottom_nav_item_color"
    app:itemIconTint="@drawable/bottom_nav_item_color" />

如果需要让Tab的文字和图标也随选中状态变色，可以再创建一个颜色选择器bottom_nav_item_color.xml（同样放在res/drawable目录）：

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

别忘了在colors.xml里补充对应的颜色哦。

3. 微调样式（可选） #

如果觉得选中的背景和边缘太紧凑，可以给BottomNavigationView或者Tab加一点内边距，让视觉效果更舒服：

<com.google.android.material.bottomnavigation.BottomNavigationView
    ...
    android:paddingHorizontal="8dp"
    android:paddingVertical="4dp"
    app:itemPaddingHorizontal="12dp" />

小提示 #

• 确保你的项目已经引入了Material Components库（默认的Navigation Tab Activity是自带的，如果没有的话，在build.gradle(Module level)里添加依赖：

implementation 'com.google.android.material:material:1.9.0'

• 区分android:background和app:itemBackground：前者是整个底部导航栏的背景，后者是每个单独Tab的背景，别搞混啦！

这样设置完成后，点击Tab的时候，选中的Tab就会显示你想要的灰色背景啦～

内容的提问来源于stack exchange，提问作者MIDHUN CEASAR