在动画期间更改进度条颜色

Question

我想根据进度条的值更改进度条的颜色。我有一个在 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="5dp"/>
            <gradient
                android:endColor="#55850000"<!-- green -->
                android:centerColor="#55e6ff00" <!-- yellow -->
                android:startColor="#5500c872" <!-- red -->
                />
        </shape>
    </item>

    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dp"/>
                <gradient
                    android:endColor="#c20600"<!-- green %100 alpha -->
                    android:centerColor="#e6ff00"<!-- yellow %100 alpha-->
                    android:startColor="#00c872"<!-- red  %100 alpha -->
                    />
            </shape>
        </clip>
    </item>

</layer-list>

我的问题是这样的，我想根据相同的背景颜色来改变整个进度的颜色。假设我的进度到了%60，整个进度条应该是黄色的。如果我的进度达到 %90，整个进度条应该是红色的。它应该是动态变化的，并且应该与进度的背景颜色相同。

这是我使用的动画颜色，它不起作用！

public class ProgressBarAnimation extends Animation{
    private ProgressBar progressBar;
    private float from;
    private float  to;

    public ProgressBarAnimation(ProgressBar progressBar, float from, float to) {
        super();
        this.progressBar = progressBar;
        this.from = from;
        this.to = to;
    }

    @Override
    protected void applyTransformation(float interpolatedTime, Transformation t) {
        super.applyTransformation(interpolatedTime, t);
        float value = from + (to - from) * interpolatedTime;
        /*if(value < 25){
            progressBar.getIndeterminateDrawable().setColorFilter(Color.GREEN, PorterDuff.Mode.MULTIPLY);
        }else if(value <=50){
            progressBar.getIndeterminateDrawable().setColorFilter(Color.YELLOW, PorterDuff.Mode.MULTIPLY);
        }else{
            progressBar.getIndeterminateDrawable().setColorFilter(Color.RED, PorterDuff.Mode.MULTIPLY);
        }*/
        // NEEDS TO CHANGE COLOR IN HERE !
        progressBar.setProgress((int) value);
    }

}

Answer 1

我最近做了类似的事情，也很难找到一个简单的例子，所以我想分享一下。主要区别在于我将进度条颜色设置为黄色 (0%)、橙色 (50%) 和红色 (100%) 之间的细粒度渐变：

...
ValueAnimator valueAnimator = ValueAnimator.ofInt(currentProgress, finalProgress);
valueAnimator.setDuration(3000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
           int[] startRGBs = getRGBColors(activity, R.color.progress_bar_yellow);
           int[] midRGBs = getRGBColors(activity, R.color.progress_bar_orange);
           int[] endRGBs = getRGBColors(activity, R.color.progress_bar_red);

           // Change the start or end colors depending on which half the progress is at (< or > 50%)
           // (done to make the transition a bit smoother, since e.g. the Blue value between orange/red is the same)
           if(percentProgressed <= 50) endRGBs = midRGBs;
           else startRGBs = midRGBs;

           int r = calcRGBValue(startRGBs[0], endRGBs[0], percentProgressed);
           int g = calcRGBValue(startRGBs[1], endRGBs[1], percentProgressed);
           int b = calcRGBValue(startRGBs[2], endRGBs[2], percentProgressed);
           int progressColorId = Color.rgb(r,g,b);

           Drawable progressDrawable = progressBar.getProgressDrawable().mutate();
           progressDrawable.setColorFilter(progressColorId, PorterDuff.Mode.MULTIPLY);
           progressBar.setProgressDrawable(progressDrawable);
        }
});

...

private int[] getRGBColors(Activity activity, int colorResourceId){
    int colorId = activity.getResources().getColor(colorResourceId);
    return new int[]{Color.red(colorId), Color.green(colorId), Color.blue(colorId)};
}

private int calcRGBValue(int startColor, int endColor, int percentProgressed){
    int colorDiff = startColor - endColor;
    if(percentProgressed > 50) percentProgressed -= 50;
    return (startColor - (int)Math.round(((double)percentProgressed ) * ((double)colorDiff / 50)));
}

因此，如果您想要在特定间隔而不是渐变的简单截断进度条颜色，您可以忽略上面的所有 RGB 计算，只需根据进度值设置 ProgressDrawable 颜色：

int progressColorId;
if(progressValue < 25) progressColorId = Color.GREEN;
else if(progressValue <= 50) progressColorId = Color.YELLOW;
else progressColorId = Color.RED;

Drawable progressDrawable = progressBar.getProgressDrawable().mutate();
progressDrawable.setColorFilter(progressColorId, PorterDuff.Mode.MULTIPLY);
progressBar.setProgressDrawable(progressDrawable);