Seekbar showing only progress color and not background color

Question

I am using a custom seekbar drawable and set its progress to 50 in my xml. It shows perfectly fine in Android Studio Preview, but in device, the background color is same as the progress color. I am using Nexus 5 with Android version: 6.0.1. Here are the codes and screenshots:

Seekbar:

 <SeekBar
     android:id="@+id/seekbar"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_below="@id/ivRepeat"
     android:indeterminate="false"
     android:maxHeight="2dp"
     android:minHeight="2dp"
     android:progress="50"
     android:progressDrawable="@drawable/progress_drawable"
     android:thumbTint="@color/seekColor" />

progress_drawable.xml:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dip" />
            <solid android:color="#F7CCBD" />
        </shape>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <solid android:color="@color/seekColor" />
            </shape>
        </clip>
    </item>
</layer-list>

seekColor value: #87DED5

How it shows in Android studio Preview:

How it shows in my device:

Any ideas why this is happening and how to fix it?

Answer 1

Here, Code have no issue once clear project.

If still issue then try below code snippet.

    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:id="@android:id/background"> <!--background of seekbar--> 
            <shape>
                <corners android:radius="5dip" />
                <solid android:color="#F7CCBD" />
            </shape>
        </item>
        <item android:id="@android:id/progress"> <!--progress color-->
            <clip>
                <shape>
                    <corners android:radius="5dip" />
                    <solid android:color="#87DED5" />
                </shape>
            </clip>
        </item>
        <item android:id="@android:id/secondaryProgress"> <!--secondaryProgress color-->
            <clip>
                <shape>
                    <corners android:radius="5dip" />
                    <solid android:color="#F7CCBD" />
                </shape>
            </clip>
        </item>
    </layer-list>