How to change the color of the PreferenceCategory divider in PreferenceScreen

Question

I have an android.support.v4.preference.PreferenceFragment which uses the following PreferenceScreen:

<PreferenceScreen xmlns:android="http://schemas.android.com/apk/res/android">
<PreferenceCategory
    android:title="Cat1"
    android:key="pref_cat1">
    <ListPreference
        android:key="pref_list1"
        android:title="@string/pref_list1"
        android:dialogTitle="@string/pref_list1"
        android:entries="@array/pref_list1_entries"
        android:entryValues="@array/pref_list1_entries"
        android:defaultValue="@string/pref_list1_default"/>
    <EditTextPreference
        android:key="pref_text2"
        android:title="@string/pref_text2"
        />
</PreferenceCategory>
<PreferenceCategory
    android:title="Cat2"
    android:key="pref_cat2">
    <EditTextPreference
        android:key="pref_text3"
        android:title="@string/pref_text3"
        />
</PreferenceCategory>

When displaying the PreferenceFragment, some dividers are shown between the preferences, but also under the name of each PreferenceCategory. Though I can easily modify the color of the dividers between the preferences by accessing the PreferenceFragment's ListView, this has no effect on the PreferenceCategory dividers.

How to change also the color of such dividers?

Answer 1

I had the same problem in my Prefernces file. I solved it by the following steps:

1: Define file name preferences_category.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+android:id/title"
        style="?android:attr/listSeparatorTextViewStyle"

        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical" />

    <View style="@style/Divider" />

</LinearLayout>

2: Define style in the style xml file:

<style name="Divider">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">1dp</item>
    <item name="android:background">@android:color/white</item>
</style>

3: add the preferences_category.xml file as android:layout attribute in the preferences xml file: :

 <PreferenceCategory 
    android:title="My title"
    android:layout="@layout/preferences_category">

Answer 2

You have two options:

1. Define the listSeparatorTextViewStyle in your app's theme

Note that anything else which relies on this theme attribute will also change to use the style you define. If that's ok with you, it will look something like this:

<style name="AppTheme" parent="android:...">
    ...
    <item name="android:listSeparatorTextViewStyle">@style/ListSeparatorText</item>
</style>

<style name="ListSeparatorText" parent="android:Widget.TextView"><!--parent is optional -->
    <item name="android:background">...</item>
    ...
</style>

2. Define a custom layout for your PreferenceCategories

The default layout for a PreferenceCategory is just a TextView. You can make your layout as simple or as complicated as you like, but somewhere should be a TextView with android:id="@android:id/title" so that the title is bound automatically.

Once you have a layout, use the android:layout attribute in your preference xml:

<PreferenceCategory
    android:title="Cat2"
    android:key="pref_cat2"
    android:layout="@layout/my_pref_category">
    ...
</PreferenceCategory>

Alternatively, you can define the preferenceCategoryStyle in your app's theme, in which case you don't need to use android:layout at all in your preference xml.

<style name="AppTheme" parent="android:...">
    ...
    <item name="android:preferenceCategoryStyle">@style/PreferenceCategoryStyle</item>
</style>

<style name="PreferenceCategoryStyle" parent="android:Preference.Category">
    <item name="android:layout">@layout/my_pref_category</item>
    ...
</style>

Answer 3

Now you can also set a custom drawable for your divider in code. I'm not sure about the older versions of support libraries, but at least now with AndroidX it works for me.

In your PreferenceFragmentCompat you can add:

@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    setDivider(getResources().getDrawable(R.drawable.your_divider_drawable, requireActivity().getTheme()));
}

Also you can call setDivider(null) to remove the separator.