BottomAppBar 与 BottomNavigationView：无法更改图标和文本颜色

Question

我有一个带有嵌套 BottomNaviagtionView 的 BottomAppBar，如下所示。选择所选图标时，我似乎无法覆盖默认的紫色。

这是我的代码：

<?xml version="1.0" encoding="utf-8"?> <androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto">

<com.google.android.material.bottomappbar.BottomAppBar
    android:id="@+id/bottomAppBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    app:contentInsetStart="0dp"
    app:contentInsetStartWithNavigation="0dp"
    android:backgroundTint="@color/colorWhite"
    android:theme="@style/Theme.MaterialComponents.Light">

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="@drawable/bg_transparent"
        app:labelVisibilityMode="labeled"
        app:menu="@menu/bottom_app_bar"
        android:theme="@style/Theme.MaterialComponents.Light"
        app:itemHorizontalTranslationEnabled="false" />
</com.google.android.material.bottomappbar.BottomAppBar>

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:srcCompat="@drawable/redyellow"
    app:layout_anchor="@id/bottomAppBar"
    app:layout_anchorGravity="center"
    android:layout_marginBottom="10dp"
    /> </androidx.coordinatorlayout.widget.CoordinatorLayout>

我尝试过的步骤：

styles.xml 文件中的一些不同的主题样式变体，运气不佳...similar to this
然后我像这样创建了一个自定义可绘制文件：

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

然后将其应用于 app:itemIconTint="@color/..." 和 app:itemTextColor="@color/nav_item_colors"，但这似乎也不起作用。

这是我的其余代码：

styles.xml

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="actionBarSize">70dp</item>
    </style>

    <style name="bottom_nav_overlay">
        <!-- selected item -->
        <item name="colorPrimary">@color/colorSecondary</item>
        <!-- other -->
        <item name="colorOnSurface">@color/colorPrimary</item>
    </style>

</resources>

gradle 依赖关系：

dependencies {
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation 'androidx.appcompat:appcompat:1.1.0'
    implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'androidx.test.ext:junit:1.1.1'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.2.0'

    implementation "androidx.recyclerview:recyclerview:1.1.0"
    // For control over item selection of both touch and mouse driven selection
    implementation "androidx.recyclerview:recyclerview-selection:1.1.0-rc01"
    implementation "androidx.cardview:cardview:1.0.0"
    implementation 'de.hdodenhof:circleimageview:3.1.0'
    implementation 'com.github.bumptech.glide:glide:4.11.0'
    implementation 'com.yarolegovich:discrete-scrollview:1.4.9'
    implementation 'com.google.android.material:material:1.1.0'
    implementation "androidx.coordinatorlayout:coordinatorlayout:1.1.0"

nav_item_colors.xml:

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

Answer 1

您可以在 BottomNavigationView 中使用 itemIconTint 和 itemTextColor 属性：

   <com.google.android.material.bottomnavigation.BottomNavigationView
           app:itemIconTint="@color/..."
           app:itemTextColor="@color/..."/>

使用如下选择器：

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

否则您可以使用以下方法覆盖颜色：

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

与：

<style name="bottom_nav_overlay">
    <!-- selected item -->
    <item name="colorPrimary">@color/...</item>
    <!-- other -->
    <item name="colorOnSurface">@color/...</item>
</style>

Answer 2

这就是我能够将 bottomNavigation 图标和文本颜色更改为所需颜色的方法

里面BottomNavigationView

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

bottom_navigation_colors:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_checked="true"
        android:color="@color/dark_red" />
    <item
        android:state_checked="false"
        android:color="@color/black" />
</selector>

BottomAppBar 与 BottomNavigationView：无法更改图标和文本颜色

BottomAppBar with BottomNavigationView: Cant change icon and text color

android

android-bottomappbar

material-components-android

android-bottomnavigationview