Why we can't use BottomNavigationView widget counter badge functionality with AppCompat theme?

App build.gradle:

And crash error when trying call to method getOrCreateBadge:
--------- beginning of crash
2019-11-01 17:04:08.199 27162-27162/com.example E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.example, PID: 27162
java.lang.IllegalArgumentException: The style on this component requires your app theme to be Theme.MaterialComponents (or a descendant).
at com.google.android.material.internal.ThemeEnforcement.checkTheme(ThemeEnforcement.java:243)
at com.google.android.material.internal.ThemeEnforcement.checkMaterialTheme(ThemeEnforcement.java:217)
at com.google.android.material.badge.BadgeDrawable.<init>(BadgeDrawable.java:379)
at com.google.android.material.badge.BadgeDrawable.createFromAttributes(BadgeDrawable.java:305)
at com.google.android.material.badge.BadgeDrawable.create(BadgeDrawable.java:273)
at com.google.android.material.bottomnavigation.BottomNavigationMenuView.getOrCreateBadge(BottomNavigationMenuView.java:641)
at com.google.android.material.bottomnavigation.BottomNavigationView.getOrCreateBadge(BottomNavigationView.java:673)
at com.example.MainActivity$onCreate$1.onPropertyChanged(MainActivity.kt:75)
at androidx.databinding.PropertyChangeRegistry$1.onNotifyCallback(PropertyChangeRegistry.java:30)
at androidx.databinding.PropertyChangeRegistry$1.onNotifyCallback(PropertyChangeRegistry.java:26)
at androidx.databinding.CallbackRegistry.notifyCallbacks(CallbackRegistry.java:201)
at androidx.databinding.CallbackRegistry.notifyFirst64(CallbackRegistry.java:122)
at androidx.databinding.CallbackRegistry.notifyRemainder(CallbackRegistry.java:169)
at androidx.databinding.CallbackRegistry.notifyRecurse(CallbackRegistry.java:145)
at androidx.databinding.CallbackRegistry.notifyCallbacks(CallbackRegistry.java:91)
at androidx.databinding.BaseObservable.notifyChange(BaseObservable.java:60)
at androidx.databinding.ObservableInt.set(ObservableInt.java:89)
at com.example.viewmodels.AppModel.addToBasket(AppModel.java:120)
at com.example.viewmodels.AppModel.addToBasket(AppModel.java:125)
at com.example.fragments.products.ShowProductDetailsBottomSheet$initListeners$$inlined$let$lambda$4.onClick(ShowProductDetailsBottomSheet.kt:386)
at android.view.View.performClick(View.java:7125)
at android.view.View.performClickInternal(View.java:7102)
at android.view.View.access$3500(View.java:801)
at android.view.View$PerformClick.run(View.java:27336)
at android.os.Handler.handleCallback(Handler.java:883)
at android.os.Handler.dispatchMessage(Handler.java:100)
at android.os.Looper.loop(Looper.java:214)
at android.app.ActivityThread.main(ActivityThread.java:7356)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)
Hi @boyfox as the stacktrace stated, you will need to set a MaterialComponents theme (at least on the bottom navigation component) in order to use the badge feature because the badge is relying on theme attributes that are guaranteed to be defined in a material theme.
@wcshi I must support older versions from android 5, how I can use material them for older versions if i don't use AppCompat? why you close bug if it is not solved?
Hi @boyfox the Material Components library offers support for APIs 14 (Android 4.0) and above. In order to use specific material components such as the badge feature, you will need to use a material theme as explained above.
Our MaterialComponents themes inherit from AppCompat themes. More info about transitioning to one can be found in our Getting Started guide.
app:theme="@style/Theme.MaterialComponents"
style="@style/AppWidget.BottomNavigation"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="@menu/bottom_tab_menu" />
@boyfox
Please increase the version number.
And after that I faced 1 more issue.
java.lang.IllegalArgumentException: The style on this component requires your app theme to be Theme.MaterialComponents (or a descendant).
To resolved this issue I used below lines.
app:theme="@style/Theme.MaterialComponents"
style="@style/Widget.Design.BottomNavigationView"
Thanks summerEnd.
Most helpful comment
app:theme="@style/Theme.MaterialComponents"
style="@style/AppWidget.BottomNavigation"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="@menu/bottom_tab_menu" />
@boyfox