Kotlin中如何设置BottomNavigationView菜单项的透明度(alpha)

我的导航面板
选中底部导航面板的某个菜单项时，需要修改对应菜单项的alpha透明度：例如选中Documents项打开对应Documents Fragment时，菜单内其余的Reader Mode、Settings项亮度降低，最终达到如下效果：预期效果

现有代码 #

菜单XML代码 #

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/documents"
        android:title="Documents"
        android:icon="@drawable/documents_icon" />

    <item
        android:id="@+id/reader_mode"
        android:title="Reader Mode"
        android:icon="@drawable/reader_mode_icon"/>
    <item
        android:id="@+id/settings"
        android:title="Settings"
        android:icon="@drawable/settings_icon"/>
</menu>

布局XML代码 #

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#1e1e1e"
    android:id="@+id/bottom_navigation_menu"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:menu="@menu/menu"
    tools:ignore="MissingConstraints"
    app:itemIconTint="@color/white"
    app:itemTextColor="@color/white"/>

Kotlin代码 #

class LyricsListActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_lyrics_list)

    bottom_navigation_menu.setOnNavigationItemReselectedListener {
        when (it.itemId){
             R.id.documents -> TODO()
            }
        }
    }
}

实现方案 #

优先用Material组件自带的状态选择器实现，无需手动遍历修改控件属性，性能更好也更符合组件设计规范：

• 在res/color目录下新建导航项颜色选择器nav_item_color.xml，分别给选中、未选中状态配置带透明度的白色：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 选中状态：完全不透明的白色 -->
    <item android:color="#FFFFFFFF" android:state_checked="true"/>
    <!-- 未选中状态：半透明白色，透明度数值越低视觉上越暗，可按需调整0.5这个alpha比例 -->
    <item android:color="#80FFFFFF" android:state_checked="false"/>
</selector>

• 修改布局中BottomNavigationView的颜色配置，把原来写死的白色替换为刚创建的选择器：

<com.google.android.material.bottomnavigation.BottomNavigationView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#1e1e1e"
    android:id="@+id/bottom_navigation_menu"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:menu="@menu/menu"
    tools:ignore="MissingConstraints"
    app:itemIconTint="@color/nav_item_color"
    app:itemTextColor="@color/nav_item_color"/>

• 修正Kotlin代码中的监听器：原有代码用的setOnNavigationItemReselectedListener仅监听重复点击当前已选中项的事件，监听选项切换需要改用setOnNavigationItemSelectedListener，同时补充对应Fragment切换逻辑，选中事件消费后返回true即可：

class LyricsListActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_lyrics_list)

        // 初始化默认选中第一项
        bottom_navigation_menu.selectedItemId = R.id.documents

        bottom_navigation_menu.setOnNavigationItemSelectedListener { menuItem ->
            when (menuItem.itemId){
                R.id.documents -> {
                    // 替换为实际的Documents Fragment切换逻辑
                    supportFragmentManager.beginTransaction()
                        .replace(R.id.fragment_container, DocumentsFragment())
                        .commit()
                    true
                }
                R.id.reader_mode -> {
                    // 替换为实际的Reader Mode Fragment切换逻辑
                    supportFragmentManager.beginTransaction()
                        .replace(R.id.fragment_container, ReaderModeFragment())
                        .commit()
                    true
                }
                R.id.settings -> {
                    // 替换为实际的Settings Fragment切换逻辑
                    supportFragmentManager.beginTransaction()
                        .replace(R.id.fragment_container, SettingsFragment())
                        .commit()
                    true
                }
                else -> false
            }
        }
    }
}

注意：如果布局中还没有Fragment承载容器，需要在对应位置添加一个id为fragment_container的FrameLayout。

如果需要手动控制alpha（比如做自定义选中动画），可以在选中项切换时遍历所有菜单项，拿到对应ItemView直接设置alpha值：

/**
 * 更新导航栏项透明度
 * @param selectedItemId 当前选中的菜单项id
 */
private fun updateNavItemAlpha(selectedItemId: Int) {
    val menu = bottom_navigation_menu.menu
    for (i in 0 until menu.size()) {
        val item = menu.getItem(i)
        val itemView: View = bottom_navigation_menu.findViewById(item.itemId)
        itemView.alpha = if (item.itemId == selectedItemId) 1f else 0.5f
    }
}

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