Alpoe
Alpoe

Reputation: 277

how to change SeekBar color in android? (Programmatically)

I made an equalizer to go with my app but I am not sure how I can change the seekbar's thumb and progress color. It seems to be pink by default and that doesn't fit my app's aesthetics.

 SeekBar seekBar = new SeekBar(this);

        seekBar.setId(i);

        seekBar.setLayoutParams(layoutParams);
        seekBar.setMax(upperEqualizerBandLevel - lowerEqualizerBandLevel);

        seekBar.setProgress(mEqualizer.getBandLevel(equalizerBandIndex));
        //seekBar.setBackgroundColor(Color.DKGRAY);
        //seekBar.setDrawingCacheBackgroundColor(Color.DKGRAY);

Upvotes: 12

Views: 24371

Answers (9)

moyo
moyo

Reputation: 1402

Kotlin version, and without using deprecated methods:

val colorFilter = BlendModeColorFilterCompat.createBlendModeColorFilterCompat(
    Resources.getSystem().getColor(R.color.your_color, null),
    BlendModeCompat.SRC_ATOP
)

// SeekBar progress color
seekBar.progressDrawable.colorFilter = colorFilter
// SeekBar thumb handle color
seekBar.thumb.colorFilter = colorFilter

Upvotes: 0

ucMax
ucMax

Reputation: 5430

Just a little more peachy answer

public static void setSeekBarColor(SeekBar seekBar, int color) {
    seekBar.getProgressDrawable().setColorFilter(color, PorterDuff.Mode.MULTIPLY);
    seekBar.getThumb().setColorFilter(color, PorterDuff.Mode.SRC_ATOP);
}

Upvotes: 0

Sachin Varma
Sachin Varma

Reputation: 2235

You can easily change it via code,

For example:

seekbar.setProgressTintList(ColorStateList.valueOf(Color.parseColor(#000000)));

or

seekbar.setProgressTintList(ColorStateList.valueOf(Color.RED));

Hoping that it will be helpfull for someone in future.

Upvotes: 1

twenk11k
twenk11k

Reputation: 577

You can change seekbar thumb and progress colors for programmatically like this:

   seekBar.getProgressDrawable().setColorFilter(Utils.getAccentColor(this), PorterDuff.Mode.SRC_IN);
   seekBar.getThumb().setColorFilter(Utils.getAccentColor(this), PorterDuff.Mode.SRC_IN);

Upvotes: 2

Georges daou
Georges daou

Reputation: 71

While using a style is a good idea, it does not provide much flexibility specially if you want to assign the colors programmatically I suggest:

//for the progress seekBar.getProgressDrawable().setColorFilter(mThemeColor,PorterDuff.Mode.SRC_ATOP); //for the thumb handle seekBar.getThumb().setColorFilter(mThemeColor, PorterDuff.Mode.SRC_ATOP);

Upvotes: 7

Abhi
Abhi

Reputation: 3511

To change the color of the Seekbar thumb, create a new style in style.xml

<style name="SeekBarColor"
  parent="Widget.AppCompat.SeekBar"> 
  <item name="colorAccent">@color/your_color</item> 
</style>

Finally in the layout:

<SeekBar
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:theme="@style/SeekBarColor" />

To change the Seekbar progress color, use this in Java Class.

seekBar.getProgressDrawable().setColorFilter("yourcolor", PorterDuff.Mode.MULTIPLY);

Both these will work for API>16.

Edit

To change SeekBar thumb color by Java code.

 seekBar.getProgressDrawable().setColorFilter(getResources().getCo‌​lor(R.color.your_color‌​), PorterDuff.Mode.SRC_ATOP);

Upvotes: 21

Przemyslaw Jablonski
Przemyslaw Jablonski

Reputation: 753

    //seekBar.setBackgroundColor(Color.DKGRAY);
    //seekBar.setDrawingCacheBackgroundColor(Color.DKGRAY);

There are few Views in Android SDK (ProgressBar is another example) in which you have to change colour using graphical color filters, instead of changing Background / Foreground source colour.

Find .setColorFilter() method, supply your source colour into it with some PorterDuff filter, like .Mode.MULTIPLY (depending on what filter mode you like best) and there you go.

Example:

seekBar.setColorFilter(new PorterDuffColorFilter(srcColor,PorterDuff.Mode.MULTIPLY));

Upvotes: -1

Oussema Aroua
Oussema Aroua

Reputation: 5329

try this :

seekBar.getProgressDrawable().setColorFilter(getResources().getColor(R.color.mcolor), PorterDuff.Mode.MULTIPLY);

Upvotes: 0

Anmol317
Anmol317

Reputation: 1376

You need to call you seekbar like this

SeekBar newSeek = new SeekBar(this, null, R.style.YOUR_NEW_STYLE);

where YOUR_NEW_STYLE will define the colors of the Seekbar that you want.

Upvotes: 0

Related Questions