BottomNavigation未显示设置的选中颜色问题求助

你的问题出在Icon组件没有继承BottomNavigationItem的内容颜色配置，默认情况下Icon会使用自身的原始颜色（比如你图标本身是黑色），而不会自动应用BottomNavigationItem设置的selectedContentColor和unselectedContentColor。

解决方案：给Icon添加tint属性 #

修改MainActivity.kt中BottomNavigationItem的icon部分，让Icon继承当前上下文的内容颜色，这样就能自动跟随选中/未选中的颜色设置：

// 先导入所需包
import androidx.compose.ui.graphics.LocalContentColor

// 修改BottomNavigationItem的icon代码
BottomNavigationItem(
    icon = { 
        Icon(
            painter = icons[index], 
            contentDescription = title,
            tint = LocalContentColor.current // 添加这一行
        ) 
    },
    label = { Text(title) },
    selected = selectedTab == index,
    onClick = { selectedTab = index },
    alwaysShowLabel = true,
    selectedContentColor = Color.White,
    unselectedContentColor = Color.White.copy(alpha = 0.7f),
)

替代方案：直接根据选中状态设置tint #

如果你不想依赖主题的内容颜色，也可以直接根据选中状态指定图标颜色：

BottomNavigationItem(
    icon = { 
        Icon(
            painter = icons[index], 
            contentDescription = title,
            tint = if (selectedTab == index) Color.White else Color.White.copy(alpha = 0.7f)
        ) 
    },
    // 其他属性不变
)

额外注意事项 #

• 确保你的图标是矢量图（VectorDrawable），如果是PNG格式，tint效果可能会受限制，建议使用矢量图标以获得更好的颜色适配。
• 你当前使用的是Material3的主题系统，建议保持Theme.kt和UI组件的一致性，避免混用Material2和Material3的组件（比如确认BottomNavigation和BottomNavigationItem来自androidx.compose.material3包）。

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