Home » Android » How to dynamically change the color of progress bar background android

How to dynamically change the color of progress bar background android

Posted by: admin May 14, 2020 Leave a comment

Questions:

I’d like to dynamically change the background color of a progress bar in android. I followed the “bonus” part near the end of the page of this tutorial:

http://colintmiller.com/2010/10/how-to-add-text-over-a-progress-bar-on-android/

It changes the color, but only once. If called more than once, the progress bar disappears. Here’s the code.

Here’s the progress bar definition:

<ProgressBar android:id="@+id/progress_bar" android:layout_width="fill_parent"
    android:layout_height="wrap_content" style="@android:style/Widget.ProgressBar.Horizontal"
    android:layout_marginRight="5dp" />

This is the drawable definition in res/drawable/green_progress.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">
    <shape>
        <corners android:radius="5dip" />
        <gradient
                android:startColor="#ff9d9e9d"
                android:centerColor="#ff5a5d5a"
                android:centerY="0.75"
                android:endColor="#ff747674"
                android:angle="270"
        />
    </shape>
</item>

<item android:id="@android:id/secondaryProgress">
    <clip>
        <shape>
            <corners android:radius="5dip" />
            <gradient
                    android:startColor="#80ffd300"
                    android:centerColor="#80ffb600"
                    android:centerY="0.75"
                    android:endColor="#a0ffcb00"
                    android:angle="270"
            />
        </shape>
    </clip>
</item>
<item
    android:id="@android:id/progress">
    <clip>
        <shape>
            <corners
                android:radius="5dip" />
            <gradient
                    android:startColor="@color/greenStart"
                    android:centerColor="@color/greenMid"
                    android:centerY="0.75"
                    android:endColor="@color/greenEnd"
                    android:angle="270"
            />
        </shape>
    </clip>
</item>

</layer-list>

Ene entries to rex/values/colors.xml:

<color name="greenStart">#ff33dd44</color>
<color name="greenMid">#ff0A8815</color>
<color name="greenEnd">#ff1da130</color>

And finally, in the code:

m_bar.setProgressDrawable(getResources().getDrawable(R.drawable.green_progress));  

Again, the problem is it works the first time, but then makes the bar disappear.

How to&Answers:

See Android ProgressBar.setProgressDrawable only works once? for the answer, repeated below:

What I found out is that the drawable doesn’t know it’s size when setprogressdrawable is called. When it is initially set up, it does know it’s size. This means there is a new drawable set to the seekbar, but the size of the drawable is 0, you won’t see anything.

The solution is to first get the bounds of the current drawable, then set the new drawable and finally set the bounds again:

Rect bounds = mySeekBar.getProgressDrawable().getBounds();
mySeekBar.setProgressDrawable(newSeekBarBackground);
mySeekBar.getProgressDrawable().setBounds(bounds);

Answer:

Well, for anyone looking for how to do it programmatically:

    Drawable bckgrndDr = new ColorDrawable(Color.RED);
    Drawable secProgressDr = new ColorDrawable(Color.GRAY);
    Drawable progressDr = new ScaleDrawable(new ColorDrawable(Color.BLUE), Gravity.LEFT, 1, -1);
    LayerDrawable resultDr = new LayerDrawable(new Drawable[] { bckgrndDr, secProgressDr, progressDr });

    resultDr.setId(0, android.R.id.background);
    resultDr.setId(1, android.R.id.secondaryProgress);
    resultDr.setId(2, android.R.id.progress);

    progressBar.setProgressDrawable(resultDr);

Setting ids to drawables is crucial, and takes care of preserving bounds and actual state of progress bar