Bottom Navigation View colors not updating based on dynamic theme

Viewed 80

I have a bottom navigation view in my app. I also have dynamic coloring enabled by extending the Application class like so:

public class BottomNavBarApplication extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        DynamicColors.applyToActivitiesIfAvailable(this);
    }
}

And modifying AndroidManifest to have android:name=".BottomNavBarApplication". All elements including buttons, top app bar, ... update with dynamic theme change. However, the buttom nav view background color stays the same color I defined in themes.xml (reddish tint).

Here's my layout XML:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/bottom_navigation"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">
    </FrameLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

</androidx.constraintlayout.widget.ConstraintLayout>

and my build.gradle dependecies:

dependencies {
    implementation 'com.google.android.material:material:1.6.1'
    implementation 'androidx.navigation:navigation-fragment:2.5.0'
    implementation 'androidx.preference:preference:1.2.0'
    implementation 'com.google.code.gson:gson:2.9.0'
    testImplementation 'junit:junit:4.13.2'
    androidTestImplementation 'androidx.test.ext:junit:1.1.3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
}

I am not modifying the background color in Java code either.

Example screenshots with three different dynamic theme colors. Note the bottom nav view has a reddish tint. Any ideas?

Example of how it should look like (from the Google Contacts app).

Also, I am not sure how to achieve the same bouncy animation Google Contacts app has when selecting an item from the bottom nav view.

1 Answers

Removing @color/md_theme_dark_surfaceTint from themes.xml fixed the issue. This is because elevationOverlayColor was added recently; however, the material library hasn't been updated with it yet. Full description here.

Related