Search code examples
androidandroid-themeandroid-styles

Theme/Style all checkboxes


I am trying to understand how to change the look of all checkboxes within my application for a certain theme.

I would like to change the checkbox check color and the checkbox border color.

If I create this style:

<style name="MyCheckBox" parent="Widget.AppCompat.CompoundButton.CheckBox">
    <item name="colorControlNormal">#8AFFFFFF</item>
    <item name="colorControlActivated">@android:color/white</item>
</style>

And apply it as a theme on my checkbox it works great.

<CheckBox
  android:id="@+id/status_favorite"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:theme="@style/MyCheckBox"/>

However I don't really want to apply that theme to every checkbox, I would like to set the theme for all checkboxes.

I tried to set the checkboxStyle in my theme however this doesn't work.

<style name="MyTheme" parent="Theme.AppCompat">
    ...
    <item name="checkboxStyle">@style/MyCheckBoxStyle</item>
    ...
</style>

<style name="MyCheckBoxStyle" parent="Base.Widget.AppCompat.CompoundButton.CheckBox">
    <item name="colorControlNormal">#8AFFFFFF</item>
    <item name="colorControlActivated">@android:color/white</item>
</style>

Is there a way to set a default theme for all checkboxes?


Solution

  • Unfortunately, colorControlNormal and colorControlActivated are theme attributes, not style attributes, so they only work if they're defined in the view's theme. There is no way that I know of to set a "default theme" for all views of a certain type; attributes like checkboxStyle can only set a default style for all checkboxes. Additionally, you can't "trick" the system by writing something like:

    <style name="MyTheme" parent="Theme.AppCompat">
        ...
        <item name="checkboxStyle">@style/MyCheckBoxStyle</item>
        ...
    </style>
    
    <style name="MyCheckBoxStyle" parent="Base.Widget.AppCompat.CompoundButton.CheckBox">
        <item name="android:theme">@style/MyCheckboxTheme</item>
    </style>
    
    <style name="MyCheckboxTheme">
        <item name="colorControlNormal">#8AFFFFFF</item>
        <item name="colorControlActivated">@android:color/white</item>
    </style>
    

    Your choices are:

    • Modify colorControlNormal and colorControlActivated in your app's theme
    • Modify colorControlNormal and colorControlActivated in your activity's theme
    • Manually set the android:theme attribute to every checkbox you want to change (or to the parent viewgroup holding these checkboxes)

    Edit: potential workaround

    Depending on your exact requirements, you might be able to get away with this:

    <style name="MyTheme" parent="Theme.AppCompat">
        <item name="checkboxStyle">@style/MyCheckboxStyle</item>
    </style>
    
    <style name="MyCheckboxStyle" parent="Widget.AppCompat.CompoundButton.CheckBox">
        <item name="buttonTint">#8AFFFFFF</item>
    </style>
    

    This will change the color of every checkbox in your app without requiring the use of theme attributes. You can even use a color selector resource for buttonTint if you want different colors for checked/unchecked:

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:color="@android:color/white" android:state_checked="true"/>
        <item android:color="#8AFFFFFF"/>
    </selector>