BottomNavigationView 中的选定项目与背景颜色相同答案

【问题标题】：Selected Item in BottomNavigationView Has Same Color as BackgroundBottomNavigationView 中的选定项目与背景颜色相同
【发布时间】：2019-11-30 18:06:25
【问题描述】：

我正在实现一个底部导航菜单。但未选择菜单中的第一项。我注意到，当我更改栏背景的颜色时，它会显示，原因是第一项“启用”颜色与我的导航栏的背景颜色相同。如何更改已启用选项卡以及剩余项目的颜色。默认情况下它们是黑色的......假设我想将它们更改为白色。谢谢主要活动的图像。 http://pctechtips.org/apps/activity.png 菜单xml文件

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

    <item
        android:id="@+id/navigation_dashboard"
        android:icon="@drawable/ic_dashboard_black_24dp"
        android:title="@string/title_dashboard" />

    <item
        android:id="@+id/navigation_notifications"
        android:icon="@drawable/ic_notifications_black_24dp"
        android:title="@string/title_notifications" />
</menu>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <org.techgeorge.textrecon.PaintView
        android:id="@+id/paintView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_alignParentBottom="true"
        android:background="@color/colorPrimary"
        app:menu="@menu/bottom_nav_menu" />

</RelativeLayout>

【问题讨论】：

标签： android bottomnavigationview material-components material-components-android android-bottomnav

【解决方案1】：

选中/未选中图标和标签的颜色由带有选择器的 app:itemIconTint 和 app:itemTextColor 属性定义。 BottomNavigationView 的默认样式使用此选择器为图标和图标标签着色：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:alpha="1.0" android:color="?attr/colorPrimary" android:state_checked="true"/>
  <item android:alpha="0.6" android:color="?attr/colorOnSurface"/>
</selector>

检查colorOnSurface 和colorPrimary 的颜色是否由于某种原因与BottomNavigationView 的背景颜色相同。

您可以在任何情况下在不定义新选择器的情况下覆盖这些颜色。
只需使用 android:theme 属性：

  <com.google.android.material.bottomnavigation.BottomNavigationView
      android:theme="@style/ThemeOverlay.BottomNavView"
      ../>

与：

  <style name="ThemeOverlay.BottomNavView" parent="">
    <item name="colorPrimary">@color/secondaryDarkColor</item>
    <item name="colorOnSurface">@color/colorAccent</item>
  </style>

您还可以使用带有 materialThemeOverlay 属性的自定义样式：

  <style name="MyWidget.MaterialComponents.BottomNavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
    <item name="materialThemeOverlay">@style/ThemeOverlay.BottomNavView</item>
  </style>

与：

  <com.google.android.material.bottomnavigation.BottomNavigationView
      style="@style/MyWidget.MaterialComponents.BottomNavigationView"
      ../>

最后一个属性需要库的版本 1.1.0。

【讨论】：

关于如何通过主题进行此操作的非常明确的答案。
想知道这是否也可以在应用的主题中被覆盖？

【解决方案2】：

您需要为底部导航视图制作可绘制的选择器，这是示例（nav_item_color_state.xml）

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

然后将下面的代码添加到底部导航视图中

app:itemIconTint="@drawable/nav_item_color_state" app:itemTextColor="@drawable/nav_item_color_state"

【讨论】：