Android Material Chip Theme overriding

Question

I want to customize a Material chip.

I would think this is how to do it:

<style name="AppTheme" parent="Theme.MaterialComponents.NoActionBar">

    .... lots more theme stuff here

    <item name="chipStyle">@style/MaterialChips</item>
    <item name="chipGroupStyle">@style/MaterialChips</item>
    <item name="chipStandaloneStyle">@style/MaterialChips</item>
</style>

<style name="MaterialChips" parent="Widget.MaterialComponents.Chip.Choice">
    <item name="chipBackgroundColor">@color/chips</item>
</style>

None of the tags like chipStyle affect the chips. But if I set app:chipBackgroundColor="@color/chips" in xml it works.

It also works fine like this for other things like say <item name="materialAlertDialogTheme">@style/AlertDialogTheme</item>.

The material documentation (if you can call it that) is really not helping.

Answer 1

Your app theme is correct.

The default style used by Chip component is defined in the app theme by the chipStyle attribute.

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
  <!-- Default style for chip component -->
  <item name="chipStyle">@style/Widget.MaterialComponents.Chip.Action</item>  
</style>

You can customize this style using for example:

<style name="AppTheme" parent="Theme.MaterialComponents.*">
  <!-- Default value for chipStyle -->
  <item name="chipStyle">@style/MaterialChips</item>  
</style>

<style name="MaterialChips" parent="@style/Widget.MaterialComponents.Chip.Choice">
    <!-- ... -->
    <item name="chipBackgroundColor">@color/chips</item>
</style>

If you specify the style attribute in your layout, this style overrides the default value.

        <com.google.android.material.chip.Chip
            style="@style/Widget.MaterialComponents.Chip.Entry"
            .../>

In this case the Chip uses the Widget.MaterialComponents.Chip.Entry style.