Android how to make custom scroll bar for recycler view

Question

I have a custom vertical scroll bar for recycler view, but the thumb that is used to show item position is a bit too big and an off position on when on top.

In styles.xml I defined custom scroll bar with thumb.xml and track.xml files for custom track and thumb. In recyler.xml I added a style attribute to show the custom scroll bar, with paddings as well.

Any ideas of how can I fix this, I tried to change width and height in thumb.xml but it does not work. Thanks!

Styles.xml file:

<resources>
<style name="AppTheme" parent="@style/Theme.Leanback">
    <item name="@attr/scrollbarStyle">@style/scrollbar_shape_style</item>
</style>

<attr name="scrollbarStyle" format="reference"/>

<style name="scrollbar_shape_style">
    <item name="android:scrollbarAlwaysDrawVerticalTrack">true</item>
    <item name="android:scrollbarStyle">outsideOverlay</item>
    <item name="android:scrollbars">vertical</item>
    <item name="android:fadeScrollbars">false</item>
    <item name="android:scrollbarThumbVertical">@drawable/thumb</item>
    <item name="android:scrollbarTrackVertical">@drawable/track</item>
    <item name="android:scrollbarSize">8dp</item>
</style>

thumb.xml file:

<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
    android:angle="0"
    android:endColor="#ffffff"
    android:startColor="#ffffff" />

<corners android:radius="5dp" />
<size android:width="8dp" />
<size android:height="3dp" />

track.xml file:

<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <gradient
        android:angle="0"
        android:endColor="#9BA3C5"
        android:startColor="#8388A4" />
    <stroke
        android:width="7dp"
        android:color="#00ffffff"/>
</shape>

Recycler's xml file:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="383dp"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler"
        style="@style/scrollbar_shape_style"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:paddingEnd="50dp"
        android:paddingStart="0dp"/>
</LinearLayout>

Answer 1

I managed the thumb on scrolling bar to have fixed size. Here is the thumb.xml file that fix the size

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:gravity="top">
    <shape android:shape="rectangle">
        <corners android:radius="100dp" />
        <solid android:color="#e9eef2" />
        <size
            android:width="5dp"
            android:height="25dp" />
    </shape>
</item>