How to set margin for Vertical Scrollbar from the right edge in ListView?

Question

For Android Platform:

I need to put margin on right side of the vertical scrollbar in listview (it is customized). Please see the attached image. Default scrollbar sticks to the extream right side of the listview.

Need your hand. Thanks.

Hayseed

What platform/GUI framework is this for? Lots of them have vertical scrollbars and ListViews. – Harangue

This is for Android Platform for 2.1 and above. – Hayseed

Answer 1

Refer to documentation on android:scrollbarStyle attribute of View. The style you probably want to use is insideOverlay (in conjunction with android:paddingRight).

Something like

<LinearLayout android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center_horizontal"
    android:paddingRight="50dip">
    <ListView
        android:id="@+id/scrollable_table" 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:scrollbarStyle="insideOverlay">
    .
    .
    .

Idealize

Why not the padding directly in the ListView without using the wrapper? – Skintight

@Michael's answer is much better. Please review it and consider changing the accepted answer. – Piedadpiedmont

Note: if you need the opposite (make scroll bar gravitate to right) and have paddingRight and clipToPadding = false, use outsideOverlay – Matadi

Answer 2

If you care about your design and want to apply the style globally use this.

---

res/values/styles.xml

<item name="android:scrollbarThumbVertical">@drawable/scrollbar</item>

res/drawable/scrollbar.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:right="4dp"> <!-- Your Margin -->
        <shape>
            <solid android:color="@color/red500" /> <!-- Your Color -->
            <corners android:radius="2dp" /> <!-- Your Radius -->
            <size android:width="4dp" /> <!-- Your Width -->
        </shape>
    </item>
</layer-list>

---

All the other answers were created by developers, not designers like myself.

Result

Salade

This is what i was looking for! Tnx Michael! – Avogadro

Sorry I couldn't give more than one upvote. This answer deserves 100. – Magnetostriction

Answer 3

Try enabling fast scroll, it does the job most of the time:

<ListView
    android:id="@+id/chapter_list"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:fastScrollEnabled="true"/>

Stamin

This does not answering to the question. – Coprophagous