Styling the scrollbar thumb

Question

I'm trying to change the outlook of the scrollbar thumb for a ListView.

I added the following property to the listview:

android:scrollbarThumbVertical="@drawable/scrollbar_vertical_thumb"

scrollbar_vertical_thumb.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" > 
    <gradient android:angle="0" android:endColor="#FF9900" android:startColor="#FF9900"/> 
    <corners android:radius="1dp" /> 
    <size android:width="3dp" /> 
</shape>

After applying my gradient I noticed I have tho scrollbars or scrollbar thumbs, as you can see in following picture (at the beginning of the page there's the left one and then it changes to the second one):

It seems like I didn't override the theme style for the scrollbar thumb.

Does anybody know, what could be wrong?

Illness

Answer 1

Update your ListView by adding 'scrollbarThumbVertical' property,

android:scrollbarThumbVertical="@drawable/scrollbar_vertical_thumb"

Then add following to 'scrollbar_vertical_thumb.xml' in drawable folder,

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient android:angle="0" android:endColor="#6699FF" android:startColor="#3333FF" />
<corners android:radius="1dp" />
<size android:width="10dp" />
</shape>

Mandamandaean

It doesn't change the height of the scrollbar thumb only the width got the effect. – Miniaturist

i want to set static height to thumb too. – Rubbery

Answer 2

You've override the wrong property.

You should do this instead:

<item name="android:fastScrollThumbDrawable">@drawable/scrollbar_vertical_thumb</item>

Shir