Android appcompat-v7:21.0.0 change material checkbox colors

Nima G picture Nima G · Nov 10, 2014 · Viewed 71.1k times · Source

I've updated my project to use the latest appcompat support library, the new version uses material design checkboxes and radio buttons. My app is dark themed and the checkboxes are black which is hard to see. I'm trying to change their colors according to Maintaining Compatibility but so far nothing works.

res/values/styles.xml

  <style name="AppBaseTheme" parent="@style/Theme.AppCompat.Light">

    <!-- customize the color palette -->
    <item name="colorAccent">@color/silver</item>
  </style>

in build.gradle:

    android {
      compileSdkVersion 21
      buildToolsVersion '21.1.1'

      defaultConfig {
        minSdkVersion 9
        targetSdkVersion 19
      }
    }

.....
.....    

    compile 'com.android.support:appcompat-v7:21.0.0'

AndroidManifest.xml:

  <application
      android:name="ee.mtakso.App"
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppBaseTheme">

The checkboxes, editTexts, radiobuttons etc. remain black.

Edit

I don't know if this makes much difference, but the radiobuttons and checkboxes I'm using are for a CheckedTextView, as following:

Single (radio button): android:checkMark="?android:attr/listChoiceIndicatorSingle"

Multi (check box): android:checkMark="?android:attr/listChoiceIndicatorMultiple"

Since these get the black colored material drawable, I don't think the issue is coming from them.

Answer

paulina_glab picture paulina_glab · Nov 10, 2014

I had a similar problem with unchecked CheckBoxes and RadioButtons. I found the solution, when I figured out that controls takes their "Off" color from

<item name="android:textColorSecondary">@color/secondary_text</item>


EDIT:

Specifying, if your app's or activity's theme inherite one of L's AppCompat (Dark/Light/Light.DarkActionBar), you can set:

<style name="SampleTheme" parent="Theme.AppCompat">
    <item name="colorAccent">@color/green</item>
    <item name="android:textColorSecondary">@color/red</item>
</style>

And that's result:

enter image description here

Notice: When you get different effect you probably use "wrong" theme - make sure you set it correctly.