How to change colour of the thumb in seekbar?

Question

I have the default seekbar in my android app. I noticed that when the thumb on the seekbar is held, it turns yellow. Instead, I want it to turn blue when it is held. How can this be done? I apologize if this is a basic question, I am new to android development. Thanks.

Answer 1

If you don't like the default thumb, you will have to create your own Drawable, which you can then set the thumb in code with something like:

Drawable thumb = getResources().getDrawable( R.drawable.myThumb );
SeekBar mSeekBar = (SeekBar) findViewById(R.id.mySeekBar);
mSeekbar.setThumb(thumb);

Or you can set the thumb in XML with:

<SeekBar 
    ...
    android:thumb="@drawable/seek_thumb" />

The actual Drawable can be an image, shape, or any other kind of Drawable you could possibly desire. If you want the thumb to change appearance when it is pressed, you will want to create a State List Drawable.

Answer 2

Use image filters to change color of default State List Drawables (including SeekBar):

  // Change seekbar color to green.
  SeekBar sb = (SeekBar) findViewById(R.id.seekBar1);
  sb.getProgressDrawable().setColorFilter(0xFF00FF00, PorterDuff.Mode.MULTIPLY);
  sb.getThumb().setColorFilter(0xFF00FF00, PorterDuff.Mode.MULTIPLY);

The method getThumb is only available since API 16+ (Jelly Bean).

Answer 3

No need of additional styling. Android supports it via xml. Just add android:thumbTint="@color/yourColor" in your seekbar.

For eg.

<SeekBar
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:max="100"
     android:thumbTint="@color/red"
     android:progress="0" />