Material-components-android: [BottomNavigationView] Background error when use fontFamily

[kimcy929]

I had a problem with the background of BottomNavigationView when pressing menu. It only happened when I set fontFamily. You can see the demo below, it always shows the white background for a light theme and black for a dark theme.

For the version material design 1.1.0-alpha05 it hadn't this problem.

Tested on Android 9.0
Material design version: 1.1.0-alpha08

<style name="Widget.BottomNavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
        <item name="android:fontFamily">@font/roboto_condensed_bold</item>
        <item name="fontFamily">@font/roboto_condensed_bold</item>
    </style>

 <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottomNavigationView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginEnd="0dp"
            android:layout_marginStart="0dp"
            android:theme="@style/Widget.BottomNavigationView"
            app:menu="@menu/navigation" />

When don't use fontFamily

[kimcy929]

If I set global fontFamily for the app's theme then this problem can resolve but I don't want to use same a font for all views.

[GuanacoDevs]

Have you tried changing this
android:theme="@style/Widget.BottomNavigationView"
for
style="@style/Widget.BottomNavigationView"

and also the property name is twice in your style, this should be enough:

<item name="fontFamily">@font/roboto_condensed_bold</item>

[kimcy929]

@GuanacoDevs Before I tried your way. Using style will not work with BottomNavigationView

[kimcy929]

I fixed workaround use itemTextAppearanceActive/InActivate.

<style name="Widget.BottomNavigationView" parent="Widget.MaterialComponents.BottomNavigationView">
        <item name="itemTextAppearanceActive">@style/BottomNavigationTextActivate</item>
        <item name="itemTextAppearanceInactive">@style/BottomNavigationTextInactivate</item>
    </style>

    <style name="BottomNavigationTextActivate">
        <item name="fontFamily">@font/roboto_condensed_bold</item>
        <item name="android:textSize">12sp</item> <!-- Disable the zoom animation when switch tab -->
    </style>

    <style name="BottomNavigationTextInactivate" parent="BottomNavigationTextActivate" />

and use style instead of android:theme

<com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottomNavigationView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:layout_marginEnd="0dp"
            android:layout_marginStart="0dp"
            style="@style/Widget.BottomNavigationView"
            app:menu="@menu/navigation" />