Android: How to bring recyclerview scrollbar to front over RecyclerView.ItemDecoration?

Question

As you notice in the image below, my scrollbar is showing up behind the item separator / RecyclerView.ItemDecoration. So you are able to see the separators over the scrollbar which looks ugly. Is there a way to bring the scrollbar to front?

Answer 1

I think the scrollbar is already in front of the dividers, it's semi-transparent so your divider shows thru.

You can control scrollbar positioning via the android:scrollbarStyle property.

This property has four possible values, insideOverlay, insideInset, outsideOverlay, outsideInset, documented here:

http://developer.android.com/reference/android/view/View.html#attr_android:scrollbarStyle

SOLUTION #1: Use either outsideOverlay or outsideInset to place the scrollbar outside of your content, thus avoiding the overlapping. The @ScottStanchfield answer here provides useful info on this: android ListView scrollbarStyle.

SOLUTION #2: Another possible solution is to modify your ItemDecoration divider to a gradient that fades out near the edges, avoiding any overlap with the scrollbar.

Define your divider.xml as follows:

<inset xmlns:android="https://schemas.android.com/apk/res/android"
    android:insetLeft="16dp" android:insetRight="16dp">
    <shape android:shape="rectangle">
        <gradient android:startColor="#20FF0000" android:centerColor="#FFFF0000" android:endColor="#20FF0000" android:angle="0" />
    </shape>
</inset>

modifying the insets and colors to suite your needs. The insets will prevent the overlap with the scrollbars, the gradient allows the divider to fade out towards the left and right edges.

SOLUTION #3: Use a custom drawable for the scrollbar via property android:scrollbarThumbVertical, and ensure this drawable is non-transparent.