Style Material Checkbox/Compound ripple color

Question

I am trying to style CompoundButton.CheckBox using official material.io tutorial:

<style name="Widget.App.CheckBox" parent="Widget.MaterialComponents.CompoundButton.CheckBox">
   <item name="buttonTint">@color/button_tint</item>
</style>

and in color/button_tint.xml:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color=">@color/shrine_pink_900" android:state_checked="true"/>
  <item android:alpha="0.38" android:color="@color/shrine_pink_100" android:state_enabled="false"/>
  <item android:color="@color/shrine_pink_100"/>
</selector>

What I cannot style is the ripple effect color when checked checkbox is pressed:

I see that this color is the default green with transparency and I need to use blue one. Tried to play with checkbox states in selector but without luck.

Official documentation: https://material.io/develop/android/components/checkboxes

Answer 1

Try to override your checkbox theme like this:

first, declare this in your style:

<style name="MyCheckBox" parent="Theme.AppCompat.Light">
    <!-- Customize your color as you want here -->
    <item name="colorControlNormal">#ADB6AF</item>
    <item name="colorControlActivated">#F7F13D</item>
    <item name="colorControlHighlight">#F73D</item>
</style>

then apply it to your checkbox:

<CheckBox
    ...
    android:theme="@style/MyCheckBox"/>