Android BottomNavigationView 完全自定义指南：图标、文字颜色与选中状态

1. 核心功能概述
通过 Material Design 的 BottomNavigationView，你可以轻松实现以下自定义：

✅ 动态切换选中/默认图标

✅ 自定义选中与默认文字颜色

✅ 控制文字显示模式（始终显示/仅选中显示/自动隐藏）

✅ 添加动画和高级样式调整

2. 图标自定义
方法 1：通过 Menu XML 指定不同状态图标
在 res/menu/bottom_nav_menu.xml 中直接定义：

<item android:id="@+id/nav_home"android:icon="@drawable/ic_home_default"  <!-- 默认图标 -->android:title="Home" />

代码中动态切换选中图标：

bottomNavigationView.setOnNavigationItemSelectedListener { item ->when (item.itemId) {R.id.nav_home -> item.setIcon(R.drawable.ic_home_selected)R.id.nav_search -> item.setIcon(R.drawable.ic_search_selected)else -> false}true
}

方法 2：通过 Tint 自动着色（推荐）
创建颜色选择器 res/color/nav_icon_color_selector.xml：

<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:color="#FF0000" android:state_checked="true" />  <!-- 选中为红色 --><item android:color="#9E9E9E" android:state_checked="false" /> <!-- 默认灰色 -->
</selector>

在布局中应用：

<com.google.android.material.bottomnavigation.BottomNavigationViewapp:itemIconTint="@color/nav_icon_color_selector"... />

3. 文字颜色自定义
步骤 1：创建文字颜色选择器
res/color/nav_text_color_selector.xml：

<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:color="#FF0000" android:state_checked="true" />  <!-- 选中红色 --><item android:color="#60000000" android:state_checked="false" /> <!-- 默认半透明灰 -->
</selector>

步骤 2：绑定到 BottomNavigationView

<com.google.android.material.bottomnavigation.BottomNavigationViewapp:itemTextColor="@color/nav_text_color_selector"app:labelVisibilityMode="labeled"  <!-- 仅选中显示文字 -->... />

4. 控制文字显示模式
通过 labelVisibilityMode 调整文字显示行为：

模式值 效果
labeled 仅选中项显示文字
unlabeled 全部隐藏文字
auto 根据空间自动调整（默认）
示例代码：

<com.google.android.material.bottomnavigation.BottomNavigationViewapp:labelVisibilityMode="labeled"... />

5. 完整样式定制
自定义样式 (styles.xml)

<style name="AppBottomNavigation" parent="Widget.MaterialComponents.BottomNavigationView"><item name="itemIconTint">@color/nav_icon_color_selector</item><item name="itemTextColor">@color/nav_text_color_selector</item><item name="itemIconSize">24dp</item><item name="itemPaddingTop">6dp</item>
</style>

应用样式

<com.google.android.material.bottomnavigation.BottomNavigationViewstyle="@style/AppBottomNavigation"app:menu="@menu/bottom_nav_menu" />

6. 高级技巧
动态切换选中状态

viewPager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() {override fun onPageSelected(position: Int) {bottomNavigationView.menu.getItem(position).isChecked = true}
})

添加点击动画

bottomNavigationView.setOnNavigationItemSelectedListener { item ->item.actionView?.apply {scaleX = 0.8f; scaleY = 0.8fanimate().scaleX(1f).scaleY(1f).setDuration(200).start()}true
}

7. 注意事项
依赖版本：确保使用 Material Components 1.3.0+：

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

图标一致性：所有图标建议使用相同尺寸（如 24x24dp）。
主题兼容：应用主题需继承 Theme.MaterialComponents。

通过以上方法，你可以完全掌控 BottomNavigationView 的视觉和交互行为，轻松实现设计需求！