Android. CheckBoxPreference color

Question

How can I change the checkbox color of CheckBoxPreference? I specifying theme attribute does not work. I have also set theme in manifest, but it is not displayed with accent color but with default color instead.

Manifest:

<activity android:name=".ui.activities.AppPreferencesActivity"
android:theme="@style/PreferencesTheme"/>

Style:

<style name="PreferencesTheme">
    <item name="colorAccent">#FF4081</item>
</style>

Am I missing something? Thanks in advance.

Answer 1

I solved it assigning the desired colors in my styles.xml

    <item name="android:colorAccent" tools:targetApi="21">@color/arrows</item>
    <item name="colorAccent">@color/arrows</item>

And using a custom xml for the checkbox inside the PreferenceActivity layout file (settings.xml in my case).

settings.xml

<?xml version="1.0" encoding="utf-8"?>
<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android">
    <CheckBoxPreference
        android:defaultValue="false"
        android:key="prefSendReport"
        android:summary="@string/desc_daily_not"
        android:title="@string/title_daily_not"
        android:layout="@layout/checkbox_preference"
        android:widgetLayout="@layout/custom_checkbox"
        >
    </CheckBoxPreference>

    <Preference
        android:key="prefSyncFrequency"
        android:summary="@string/pref_sync_frequency_summary"
        android:title="@string/pref_sync_frequency"
        android:layout="@layout/checkbox_preference"
        />

checkbox_preference.xml

<?xml version="1.0" encoding="utf-8"?>
<!-- Layout for a Preference in a PreferenceActivity. The Preference is able
to place a specific widget for its particular type in the "widget_frame" 
layout. -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
android:gravity="center_vertical" android:paddingRight="?android:attr/scrollbarSize"
>

    <RelativeLayout android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_marginLeft="15dip"
        android:layout_marginRight="6dip" 
        android:layout_marginTop="6dip"
        android:layout_marginBottom="6dip" 
        android:layout_weight="1"
    >

        <TextView android:id="@+android:id/title"
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"
            android:singleLine="true" 
            android:textAppearance="? 
            android:attr/textAppearanceMedium"
            android:ellipsize="marquee" 
            android:fadingEdge="horizontal"
            android:textColor="@color/arrows"
        />

        <TextView android:id="@+android:id/summary"
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"
            android:layout_below="@android:id/title" 
            android:layout_alignLeft="@android:id/title"
            android:textAppearance="?android:attr/textAppearanceSmall"
            android:maxLines="4"
            android:textColor="@color/mdtp_light_gray"
        />

    </RelativeLayout>

    <!-- Preference should place its actual preference widget here. -->
    <LinearLayout android:id="@+android:id/widget_frame"
    android:layout_width="wrap_content" android:layout_height="match_parent"
    android:gravity="center_vertical" android:orientation="vertical"
    />

</LinearLayout>

custom_checkbox.xml

<?xml version="1.0" encoding="UTF-8"?>
<CheckBox xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+android:id/checkbox" android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:focusable="false"
    android:clickable="false"
/>

Answer 2

Create theme to your setting activity, add this parameters to the style:

 <style name="AppTheme.NoActionBar.SettingActivity"  parent="AppTheme.NoActionBar"> 
         <!--when the check box is checked --!>       
        <item name="colorControlNormal">@color/your-color</item> 
        <!--when the check box is unchecked --!>       
        <item name="colorControlActivated">@color/your-color</item>
  </style>`