Search code examples
javaandroidviewsliderseekbar

Android SeekBar custom rectangle thumb visual bug


I try to set custom rectangle thumb with drawable timeline_runner.png enter image description here

SeekBar in my activity.xml:

<SeekBar
    android:id="@+id/seekBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:maxHeight="10dp"
    android:minHeight="10dp"
    android:progressDrawable="@drawable/seek_bar_video"
    android:thumb="@drawable/timeline_runner"
    android:thumbOffset="0dp"
    android:padding="0dp"
    android:layout_weight="1"
    android:layout_marginLeft="17dp"
    android:layout_marginRight="12dp"/>

seek_bar_video.xml:

<?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
      android:id="@android:id/background"
      android:drawable="@drawable/timeline_grey"
      android:height="10dp"
      android:gravity ="center"
    />
    <item android:id="@android:id/progress">
       <scale
           android:drawable="@drawable/timeline_yellow"
           android:scaleWidth="100%"
           android:height="10dp" />
    </item>
 </layer-list>

At versions < 21 all are working fine.

enter image description here

But at 21+ when moving thumb appears grey circle:

enter image description here

How can I remove it?


Solution

  • to disable the ripple effect on your SeekBar's thumb you can have to null the background, E.g.

    android:background="@null"