Change the line color used in listSeparatorTextViewStyle

Question

I have the following code

        <TextView
            android:text="@string/hello"
            style="?android:attr/listSeparatorTextViewStyle" />

and I will get the following effect.

However, I am not happy with the color line. I would like to have something like

I would like it to have blue color line as in holo. I try the following custom style.

<style name="MyOwnListSeperatorTextViewStyle">        
<item name="android:background">@android:drawable/list_section_divider_holo_light</item>        
<item name="android:textAllCaps">true</item>    

<!-- Copy from Widget.TextView.ListSeparator -->

<item name="android:background">@android:drawable/dark_header_dither</item>
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:textStyle">bold</item>
    <item name="android:textColor">?textColorSecondary</item>
    <item name="android:textSize">14sp</item>
    <item name="android:gravity">center_vertical</item>
    <item name="android:paddingLeft">8dip</item>        
</style>

But it won't work, as I get the following error.

error: Error: Resource is not public. (at 'android:background' with value '@android:drawable/dark_header_dither').

Have idea how can I change the line color used in listSeparatorTextViewStyle?

Answer 1

I needed to do this to override the typical Holo Spinner style (I didn't want the underlined item - i just wanted the arrow), and I think this can be overridden in precisely the same manner:

First off, you want to find the item you wish to override in the android styles source. There is an incredibly useful SO answer that contains all of the styles (and the names to override them) right here: Set Dialog theme to parent Theme in Android

I believe yours is the following line:

<item name="listSeparatorTextViewStyle">@android:style/Widget.Holo.Light.TextView.ListSeparator</item>

This takes us on a journey to find the style Widget.Holo.Light.TextView.ListSeparator which should live somewhere on your very own computer! But I'll make it easy and just c&p it:

<style name="Widget.Holo.Light.TextView.ListSeparator" parent="Widget.TextView.ListSeparator">
    <item name="android:background">@android:drawable/list_section_divider_holo_light</item>
</style>

Now, you probably want to leave well enough alone, and just look at that background drawable. You will find it is a grey 9patch file that looks like the sinister grey line you seek to avoid.

We need to override this. I am sure there are a number of ways to do this, but I do so by customizing the theme of the application. Here is the themes.xml file:

<style name="AppTheme" parent="@android:style/Theme.Holo.Light.NoActionBar">
    <item name="android:listSeparatorTextViewStyle">@style/MyOwnListSeperatorTextViewStyle</item>
</style>

<style name="MyOwnListSeperatorTextViewStyle" parent="Widget.TextView.ListSeparator">
    <item name="android:background">@drawable/make_your_own_blue_9_patch_here</item>
</style>

Notice how we used the listSeparatorTextViewStyle from that previous SO post? And the parent of the custom style is the Widget.TextView.ListSeparator from android's style source? All very important.

Now you just need to apply this theme to your app, but I am assuming you have a theme already. If you haven't already, you will need to make your own 9patch but I would just look at the list_section_divider_holo_light.9.png file on your computer, and make the grey parts blue, and then make a copy and place it into your own drawables folder.

Hope this works and is helpful!