Android实现多段颜色进度条效果

Android实现多段颜色进度条效果,第1张

概述多段颜色进度条实现思路,供大家参考,具体内容如下这个进度条其实相对简单.

多段颜色的进度条实现思路,供大家参考,具体内容如下

这个进度条其实相对简单.
这里可以把需要绘制的简单分为两个部分

1.灰色背景部分
2.多段颜色的进度部分

考虑到实际绘制中,分段部分不太容易根据进度值进行动态绘制.
故把多段颜色部分作为背景进行绘制,实际的灰色部分根据进度值变化,达到多段颜色部分进度变化的效果.

实现步骤

1.自定义view 来绘制进度条
2.定义背景及进度条绘制所需的画笔

private Paint backgroundPaint,progresspaint,linePaint;//背景和进度条画笔 

3.定义不同颜色区域的矩阵数组(这里将进度分为多个色块)
4.定义颜色数组,以及所占比例的数组.后面根据比例和颜色进行绘制

private Rect progressRect = new Rect();//进度条;private Rect backgroundRects[];//背景矩形区域private float weights[];//每个区域的权重private int colors[];//颜色

5.定义进度值,监听等杂项.

private float progress = 10,maxProgress = 100;//进度和最大进度private OnProgresschangelistener Listener;

6.在draw方法中进行绘制
7.背景色块的绘制

 //绘制背景颜色块int x = 0,y = getHeight();int progressX = (int) getWIDthForWeight(progress,maxProgress);for (int i = 0; i < colors.length; i++) {   Rect rect = backgroundRects[i];   backgroundPaint.setcolor(colors[i]);   int wIDth = (int) (getWIDthForWeight(weights[i],totalWeight));   rect.set(x,x + wIDth,y);   x += wIDth;//计算下一个的开始位置   canvas.drawRect(rect,backgroundPaint);//绘制矩形 }

8.进度条及分割线的绘制

progressRect.set(0,progressX,getHeight());//设置进度条区域canvas.drawRect(progressRect,progresspaint);//绘制进度条for (int i = 0,lineX = 0; i < colors.length; i++) {   int wIDth = (int) (getWIDthForWeight(weights[i],totalWeight));   //绘制矩形块之间的分割线   lineX = lineX + wIDth;   if (lineX < progressX) {//给已经走过了的区域画上竖线      canvas.drawline(lineX,lineX,getHeight(),linePaint);    }}

最后看看实现的效果图

完整代码

package com.wq.Widget;import androID.animation.ObjectAnimator;import androID.animation.ValueAnimator;import androID.content.Context;import androID.graphics.Canvas;import androID.graphics.color;import androID.graphics.Paint;import androID.graphics.Rect;import androID.util.AttributeSet;import androID.util.Log;import androID.vIEw.VIEw;import androID.vIEw.animation.linearInterpolator;/** * 多段颜色的进度条 * Created by WQ on 2017/7/11. */public class MultistageProgress extends VIEw {  private Paint backgroundPaint,linePaint;//背景和进度条画笔  private Rect progressRect = new Rect();//进度条;  private Rect backgroundRects[];//背景矩形区域  private float weights[];//每个区域的权重  private int colors[];//颜色  private float totalWeight;//总的权重  public static final int DEF_colorS[];//默认背景颜色数组  public static final float DEF_WEIGHTS[];//每段对应的权重  private float progress = 10,maxProgress = 100;//进度和最大进度  private OnProgresschangelistener Listener;  static {    DEF_colorS = new int[]{        color.parsecolor("#00B6D0"),color.parsecolor("#0198AE"),color.parsecolor("#008396"),color.parsecolor("#007196"),color.parsecolor("#005672")    };    DEF_WEIGHTS = new float[]{        138,35,230,57    };  }  public float getProgress() {    return progress;  }  public voID setProgress(float progress) {    this.progress = progress;    invalIDate();    onProgressChange();  }  private voID onProgressChange() {    if (Listener != null) {      int position = 0;      int currentWIDth = (int) getWIDthForWeight(getProgress(),getMaxProgress());      int tmpWIDth = 0;      for (int i = 0; i < weights.length; i++) {        tmpWIDth += (int) getWIDthForWeight(weights[i],totalWeight);        if (tmpWIDth >= currentWIDth) {          position = i;          break;        }      }      Listener.onProgressChange(getProgress(),position);    }  }  public float getMaxProgress() {    return maxProgress;  }  public voID setMaxProgress(float maxProgress) {    this.maxProgress = maxProgress;    invalIDate();  }  public OnProgresschangelistener getProgresschangelistener() {    return Listener;  }  public voID setProgresschangelistener(OnProgresschangelistener Listener) {    this.Listener = Listener;  }  public MultistageProgress(Context context) {    super(context);    init();  }  public MultistageProgress(Context context,AttributeSet attrs) {    super(context,attrs);    init();  }  public MultistageProgress(Context context,AttributeSet attrs,int defStyleAttr) {    super(context,attrs,defStyleAttr);    init();  }  public MultistageProgress(Context context,int defStyleAttr,int defStyleRes) {    super(context,defStyleAttr,defStyleRes);    init();  }  public voID init() {    backgroundPaint = new Paint();    backgroundPaint.setStyle(Paint.Style.FILL_AND_stroke);    backgroundPaint.setcolor(color.RED);    progresspaint = new Paint();    progresspaint.setStyle(Paint.Style.FILL_AND_stroke);    progresspaint.setcolor(color.parsecolor("#d9d9d9"));    linePaint = new Paint();    linePaint.setStyle(Paint.Style.FILL_AND_stroke);    linePaint.setcolor(color.parsecolor("#e7eaf0"));    linePaint.setstrokeWIDth(2);    setcolors(DEF_colorS,DEF_WEIGHTS);  }  /**   * 设置进度条颜色   *   * @param color   */  public voID setProgresscolor(int color) {    progresspaint.setcolor(color);  }  /**   * 设置每一段的颜色以及对应的权重   *   * @param colors   * @param weights   */  public voID setcolors(int[] colors,float weights[]) {    if (colors == null || weights == null) {      throw new NullPointerException("colors And weights must be not null");    }    if (colors.length != weights.length) {      throw new IllegalArgumentException("colors And weights length must be same");    }    backgroundRects = new Rect[colors.length];    this.colors = colors;    this.weights = weights;    totalWeight = 0;    for (int i = 0; i < weights.length; i++) {      totalWeight += weights[i];      backgroundRects[i] = new Rect();    }  }  @OverrIDe  protected voID onDraw(Canvas canvas) {    super.onDraw(canvas);    if (backgroundRects == null) {      return;    }    if (maxProgress <= 0) {      maxProgress = getWIDth();    }    //绘制背景颜色块    int x = 0,y = getHeight();    int progressX = (int) getWIDthForWeight(progress,maxProgress);    for (int i = 0; i < colors.length; i++) {      Rect rect = backgroundRects[i];      backgroundPaint.setcolor(colors[i]);      int wIDth = (int) (getWIDthForWeight(weights[i],totalWeight));      rect.set(x,y);      x += wIDth;//计算下一个的开始位置      canvas.drawRect(rect,backgroundPaint);//绘制矩形    }    progressRect.set(0,getHeight());//设置进度条区域    canvas.drawRect(progressRect,progresspaint);//绘制进度条    for (int i = 0,lineX = 0; i < colors.length; i++) {      int wIDth = (int) (getWIDthForWeight(weights[i],totalWeight));      //绘制矩形块之间的分割线      lineX = lineX + wIDth;      if (lineX < progressX) {//给已经走过了的区域画上竖线        canvas.drawline(lineX,linePaint);      }    }  }  /**   * 根据权重获取对应的宽度   *   * @param weight   * @param totalWeight   * @return   */  public float getWIDthForWeight(float weight,float totalWeight) {    return getWIDth() * (weight / totalWeight) + 0.5f;  }  /**   * 根据根据权重在数组中的索引获取对应的位置   *   * @param position   * @return   */  public float getXForWeightposition(int position) {    float xposition = 0;    for (int i = 0; i < position; i++) {      xposition += getWIDthForWeightposition(i);    }    return xposition;  }  /**   * 根据根据权重在数组中的索引获取对应的宽度   *   * @param position   * @return   */  public float getWIDthForWeightposition(int position) {    return getWIDth() * (weights[position] / totalWeight) + 0.5f;  }  ObjectAnimator valueAnimator;  public voID autochange(float startProgress,float endProgress,long changeTime) {    if (valueAnimator != null && valueAnimator.isRunning()) return;    setProgress((int) startProgress);    setMaxProgress((int) endProgress);    valueAnimator = ObjectAnimator.offloat(this,"progress",startProgress,endProgress);    valueAnimator.setDuration(changeTime);    valueAnimator.setInterpolator(new linearInterpolator());    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {      @OverrIDe      public voID onAnimationUpdate(ValueAnimator animation) {        float value = (float) animation.getAnimatedValue();//        setProgress((int) value);        Log.d(getClass().getname(),"进度值 " + value);      }    });    valueAnimator.start();  }  public voID stopChange() {    if (valueAnimator != null && valueAnimator.isRunning()) valueAnimator.cancel();  }  @OverrIDe  protected voID onDetachedFromWindow() {    if (valueAnimator != null && valueAnimator.isRunning()) {      valueAnimator.cancel();    }    super.onDetachedFromWindow();  }  public interface OnProgresschangelistener {    /**     * 进度改变时触发     * @param progress 进度     * @param position 所在区间段     */    voID onProgressChange(float progress,int position);  }}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。

您可能感兴趣的文章:Android 七种进度条的样式Android中实现Webview顶部带进度条的方法android自定义进度条渐变色View的实例代码Android文件下载进度条的实现代码android ListView和ProgressBar(进度条控件)的使用方法Android中自定义进度条详解实例详解Android自定义ProgressDialog进度条对话框的实现Android三种方式实现ProgressBar自定义圆形进度条Android ProgressBar进度条和ProgressDialog进度框的展示DEMOAndroid ProgressBar进度条使用详解 总结

以上是内存溢出为你收集整理的Android实现多段颜色进度条效果全部内容,希望文章能够帮你解决Android实现多段颜色进度条效果所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1143028.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存