首页 > 系统 > Android > 正文

Android中制作进度框和环形进度条的简单实例分享

2019-10-24 20:16:28
字体:
来源:转载
供稿:网友
这篇文章主要介绍了Android中制作进度框和环形进度条的简单实例分享,环形进度条带有基本的百分比显示,需要的朋友可以参考下
 

进度框

import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import android.view.View;  import java.util.Random; public class ObliqueProgressbar extends View {    private Paint mPaint;   private float mProgress;    public ObliqueProgressbar(Context context) {     this(context, null);   }    public ObliqueProgressbar(Context context, AttributeSet attrs) {     this(context, attrs, 0);   }    public ObliqueProgressbar(Context context, AttributeSet attrs, int defStyleAttr) {     super(context, attrs, defStyleAttr);      mPaint = new Paint();     mPaint.setAntiAlias(true);   }     @Override   protected void onDraw(Canvas canvas) {     super.onDraw(canvas);      if (mProgress == 0) return;      //碎片雨     mPaint.setColor(Color.parseColor("#a96ecb"));     mPaint.setStrokeWidth(3);     Random random = new Random();     int sx, sy;     for (int i = 0; i < 200; i++) {       sx = random.nextInt(getWidth() + 10);       sy = random.nextInt(getHeight() + 10); //      canvas.drawLine(sx, sy, sx+random.nextInt(5), sy+random.nextInt(5), mPaint);       canvas.drawCircle(sx, sy, random.nextInt(5) + 1, mPaint);     }      //进度     mPaint.setColor(Color.parseColor("#6AFFFFFF"));     mPaint.setStrokeWidth(15);     float x = mProgress * getWidth();     for (int i = 0; i < x; i += 30) {       canvas.drawLine(i - 30, -10, i + 30, getHeight() + 10, mPaint);     }    }    public void setProgress(float progress) {     this.mProgress = progress;     invalidate();   } } 

环形进度条

先来看一下效果:

Android,进度框,进度条

下面直接上代码了:

ckage com.stone.circleprogressbar.view;  import android.content.Context; import android.content.res.TypedArray; import android.graphics.Bitmap; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.LinearGradient; import android.graphics.Paint; import android.graphics.RectF; import android.graphics.Shader; import android.util.AttributeSet; import android.view.View;  import com.stone.circleprogressbar.R; public class CircleProgressbar extends View {   private float mProgress;  private int mBarColor;  private int mTextColor;  private float mTextSize;   public CircleProgressbar(Context context) {   this(context, null);  }   public CircleProgressbar(Context context, AttributeSet attrs) {   this(context, attrs, 0);  }   public CircleProgressbar(Context context, AttributeSet attrs, int defStyleAttr) {   super(context, attrs, defStyleAttr);    TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CircleProgressbar);   mBarColor = array.getColor(R.styleable.CircleProgressbar_barColor, Color.GRAY);   mTextColor = array.getColor(R.styleable.CircleProgressbar_textColor, Color.GRAY);   mProgress = array.getFloat(R.styleable.CircleProgressbar_progress, 0);  }   @Override  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {   super.onMeasure(widthMeasureSpec, heightMeasureSpec);  }   public void setProgress(float count) {   mProgress = count;   invalidate();  }   @Override  protected void onDraw(Canvas canvas) {   int w = getWidth();   int h = getHeight();   int strokeWidth = 20;   int radius = w / 2 - strokeWidth / 2;//大圆 半径   Bitmap barBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);   Paint paint = new Paint();   paint.setAntiAlias(true); //抗锯齿   paint.setStrokeWidth(strokeWidth); //描边宽   paint.setDither(true); //防抖动    /* 外边框 */   Canvas circleCanvas = new Canvas(barBitmap);   RectF rect = new RectF(0, 0, w, h);   paint.setColor(Color.argb(0x11, 0xcc, 0xcc, 0xcc)); //  circleCanvas.drawRect(rect, paint); //没啥用 只是看外边框的    /* 内圆 */   paint.setColor(Color.CYAN);   paint.setShader(new LinearGradient(0, 0, w, h, Color.RED, Color.GREEN, Shader.TileMode.CLAMP));   circleCanvas.drawCircle(w / 2, h / 2, radius - strokeWidth / 2, paint);   paint.setShader(null);    /* 外圆 */   paint.setColor(mBarColor);   paint.setStyle(Paint.Style.STROKE);   circleCanvas.drawCircle(w / 2, h / 2, radius, paint);    /* 圆弧 */   paint.setShader(new LinearGradient(0, 0, w, h,     new int[]{Color.GREEN, Color.MAGENTA, Color.CYAN, Color.RED},     new float[]{0.2f, 0.5f, 0.7f, 1.0f}, Shader.TileMode.CLAMP));   float cur = mProgress * 360 * 0.01f;   circleCanvas.drawArc(new RectF(strokeWidth / 2, strokeWidth / 2, w - strokeWidth / 2, h - strokeWidth / 2),     360 - 45, cur, false, paint);   paint.setShader(null);    /* 文本 */   paint.setColor(mTextColor);   if (mTextSize == 0) {    calcTextSize(paint, w, strokeWidth);   } else {    paint.setTextSize(mTextSize);   }   paint.setTextAlign(Paint.Align.LEFT);//default   String percent = mProgress + "%";   paint.setStyle(Paint.Style.FILL);   circleCanvas.drawText(percent, w / 2 - paint.measureText(percent) / 2, h / 2 + paint.getTextSize() / 2, paint);    canvas.drawBitmap(barBitmap, 0, 0, paint);  }   /**   * 计算并设置最适合的textSize   *   * @param paint   * @param max 最大宽度   * @param offset 偏移   */  private void calcTextSize(Paint paint, int max, int offset) {   float width = paint.measureText("99.99%");   while (width < max * 3 / 5) {    paint.setTextSize(paint.getTextSize() + 5);    width = paint.measureText("92.88%") + offset / 2;   }   mTextSize = paint.getTextSize();  }  } 

设置进度刷新显示  调用  setProgress()即可。



注:相关教程知识阅读请移步到Android开发频道。
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表