android listview fast scroll customization issue

Question

here is my listview

<ListView android:layout_width="match_parent"
            android:layout_height="match_parent" android:id="@+id/ListView"
            android:fastScrollEnabled="true" android:divider="@null"
            style="@drawable/listviewfastscrollstyle"
            ></ListView>

This is listviewfastscrollstyle style file

<style> 
<item name="android:fastScrollTrackDrawable">@drawable/listselector</item> 
<item name="android:fastScrollThumbDrawable">@drawable/listselector</item> 
</style>

This is listselector file

<selector xmlns:android="http://schemas.android.com/apk/res/android">
 <item android:state_pressed="true" android:drawable="@drawable/channelarrows_down" /> 
 <item android:drawable="@drawable/minimize" /> 
 </selector>

But still the list view fast scroll bar is not getting customized.

Answer 1

The style you created isn't correct. You need to give it a name. I'm not sure what happened to your last post about this. Do the following:

<?xml version="1.0" encoding="utf-8"?>
<resources>

<style name="listviewfastscrollstyle" parent="android:Theme">
    <item name="android:fastScrollTrackDrawable">@drawable/listselector</item>
    <item name="android:fastScrollThumbDrawable">@drawable/listselector</item>
</style>

</resources>

In your Manifest set the style like this:

<application 
    android:icon="@drawable/icon" 
    android:label="@string/app_name" 
    android:theme="@style/CustomTheme">

As requested, this is the ListView I was testing on:

<ExpandableListView
    android:id="@android:id/list"
    android:layout_width="match_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:drawSelectorOnTop="false"
    android:fastScrollAlwaysVisible="true"
    android:fastScrollEnabled="true"
    android:indicatorLeft="8dip"
    android:indicatorRight="52dip"
    android:paddingRight="32dip" />

Answer 2

In order to change the fastScrollThumbDrawable, the fastScrollTrackDrawable, or the text color of the fastscroll SectionIndexer you have to use a Context Theme. The other answers recommend overriding the application's theme via the AndroidManifest to do this. That does work but if you want different scrollbar appearances per ListView you can't do that. Also, the way you change the text color on SectionIndexer shouldn't be done in your app theme because it may have other undesired effects.

The best way to style a ListView for fastscrolling is to create a custom ListView that uses a ContextThemeWrapper.

Here is an example:

public class FastscrollThemedListView extends ListView {
    public FastscrollThemedListView(Context context, AttributeSet attrs) {
        super(new ContextThemeWrapper(context, R.style.FastScrollTheme), attrs);
    }
}

That is all you need. Your style will look like this:

<style name="FastScrollTheme">
    <item name="android:textColorPrimary">?android:textColorPrimaryInverse</item>
    <item name="android:fastScrollThumbDrawable">@drawable/fast_scrollbar_thumb</item>
    <item name="android:fastScrollTrackDrawable">@drawable/fast_scrollbar_track</item>
</style>

textColorPrimary is how you hook is how you hook into the SectionIndexer font color if you use it.

Your ListView would look like this:

<com.yourapp.view.FastscrollThemedListView 
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:id="@+id/ListView"
    android:fastScrollEnabled="true" 
    android:divider="@null"/>

and in case you need it this is what your ThumbDrawable could look like:

fast_scrollbar_thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:top="10dp" android:bottom="10dp">
        <shape android:shape="rectangle">
            <size
                android:height="45dp"
                android:width="5dp" />
            <solid android:color="#DA414A" />
        </shape>
    </item>
</layer-list>

AFAIK there is no why to style the FastScroll bar pre-HoneyComb (API 11)