seekbar change background progress colour

294 Views Asked by At

I want the entire progress bar to be white, but can't figure out how to do it. This is what I have now:

        <SeekBar
            android:id="@+id/seek_bar"
            android:layout_width="match_parent"
            android:paddingTop="10dp"
            android:thumbTint="@color/black"
            android:progressTint="@color/white"
            android:layout_height="wrap_content"
            android:layout_marginLeft="28dp"
            android:layout_marginRight="28dp"
            android:gravity="center_horizontal"
            />

Which results in this - but I want the right side of the seekbar (the remaining progress) to be white too.

enter image description here

2

There are 2 best solutions below

0
On BEST ANSWER

Is that what you're looking for :

enter image description here

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:id="@android:id/background">
        <shape android:shape="rectangle">
            <corners android:radius="5dp"/>
            <solid android:color="#fff"/>
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">
        <scale
            android:scaleWidth="100%" >
            <shape android:shape="rectangle">
                <corners android:radius="5dp"/>
                <solid android:color="#fff"/>
            </shape>
        </scale>
    </item>

    <item android:id="@android:id/progress">
        <scale
            android:scaleWidth="100%" >
            <shape android:shape="rectangle">
                <corners android:radius="5dp"/>
                <solid android:color="#fff"/>
            </shape>
        </scale>
    </item>
</layer-list>
0
On

You can use the Slider in the Material Components Library:

<com.google.android.material.slider.Slider
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:trackColor="@color/white"
    app:thumbColor="@color/black"/>

enter image description here