Android实现圆形渐变加载进度条

最近设计要求要一个圆形进度条渐变的需求:

1.画圆形进度条

2.解决渐变

最终实现效果代码

package com.view;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.SweepGradient;
import android.util.AttributeSet;
import android.view.View;
import com.fx.R;
public class CompletedView extends View {

  // 画实心圆的画笔
  private Paint mCirclePaint;
  // 画圆环的画笔
  private Paint mRingPaint;
  // 画圆环的画笔背景色
  private Paint mRingPaintBg;
  // 画字体的画笔
  private Paint mTextPaint;
  // 圆形颜色
  private int mCircleColor;
  // 圆环颜色
  private int mRingColor;
  // 圆环背景颜色
  private int mRingBgColor;
  // 半径
  private float mRadius;
  // 圆环半径
  private float mRingRadius;
  // 圆环宽度
  private float mStrokeWidth;
  // 圆心x坐标
  private int mXCenter;
  // 圆心y坐标
  private int mYCenter;
  // 字的长度
  private float mTxtWidth;
  // 字的高度
  private float mTxtHeight;
  // 总进度
  private int mTotalProgress = 100;
  // 当前进度
  private int mProgress;

  private String string;

  public CompletedView(Context context,AttributeSet attrs) {
    super(context,attrs);
    // 获取自定义的属性
    initAttrs(context,attrs);
    initVariable();
  }

  //属性
  private void initAttrs(Context context,AttributeSet attrs) {
    TypedArray typeArray = context.getTheme().obtainStyledAttributes(attrs,R.styleable.TasksCompletedView,0);
    mRadius = typeArray.getDimension(R.styleable.TasksCompletedView_radius,80);
    mStrokeWidth = typeArray.getDimension(R.styleable.TasksCompletedView_strokeWidth,10);
    mCircleColor = typeArray.getColor(R.styleable.TasksCompletedView_circleColor,0xFFFFFFFF);
    mRingColor = typeArray.getColor(R.styleable.TasksCompletedView_ringColor,0xFFFFFFFF);
    mRingBgColor = typeArray.getColor(R.styleable.TasksCompletedView_ringBgColor,0xFFFFFFFF);

    mRingRadius = mRadius + mStrokeWidth / 2;
  }
  RectF oval;
  //初始化画笔
  private void initVariable() {
    oval = new RectF();
    //内圆
    mCirclePaint = new Paint();
    mCirclePaint.setAntiAlias(true);
    mCirclePaint.setColor(mCircleColor);
    mCirclePaint.setStyle(Paint.Style.FILL);
    mCirclePaint.setStrokeCap(Paint.Cap.ROUND);

    //外圆弧背景
    mRingPaintBg = new Paint();
    mRingPaintBg.setAntiAlias(true);
    mRingPaintBg.setColor(mRingBgColor);
    mRingPaintBg.setStyle(Paint.Style.STROKE);
    mRingPaintBg.setStrokeWidth(mStrokeWidth);

    //外圆弧
    mRingPaint = new Paint();
    mRingPaint.setAntiAlias(true);
//    mRingPaint.setColor(mRingColor);
    mRingPaint.setStyle(Paint.Style.STROKE);
    mRingPaint.setStrokeWidth(mStrokeWidth);
    mRingPaint.setStrokeCap(Paint.Cap.ROUND);//设置线冒样式,有圆 有方

    //中间字
    mTextPaint = new Paint();
    mTextPaint.setAntiAlias(true);
    mTextPaint.setStyle(Paint.Style.FILL);
    mTextPaint.setColor(mRingColor);
    mTextPaint.setTextSize(mRadius / 2);

    Paint.FontMetrics fm = mTextPaint.getFontMetrics();
    mTxtHeight = (int) Math.ceil(fm.descent - fm.ascent);
  }
  SweepGradient sweepGradient;
  //画图
  @Override
  protected void onDraw(Canvas canvas) {
    mXCenter = getWidth() / 2;
    mYCenter = getHeight() / 2;

    //内圆
    canvas.drawCircle(mXCenter,mYCenter,mRadius,mCirclePaint);

    //外圆弧背景
    RectF oval1 = new RectF();
    oval1.left = (mXCenter - mRingRadius);
    oval1.top = (mYCenter - mRingRadius);
    oval1.right = mRingRadius * 2 + (mXCenter - mRingRadius);
    oval1.bottom = mRingRadius * 2 + (mYCenter - mRingRadius);
    canvas.drawArc(oval1,360,false,mRingPaintBg); //圆弧所在的椭圆对象、圆弧的起始角度、圆弧的角度、是否显示半径连线

    //外圆弧
    if (mProgress > 0 ) {

      oval.left = (mXCenter - mRingRadius);
      oval.top = (mYCenter - mRingRadius);
      oval.right = mRingRadius * 2 + (mXCenter - mRingRadius);
      oval.bottom = mRingRadius * 2 + (mYCenter - mRingRadius);
      if (sweepGradient==null) {
        int[] arcColors= new int[]{mRingColor,Color.parseColor("#b05e39"),mRingColor};
        float[] arcPostion=new float[]{0.0f,0.5f,0.95f};
//        sweepGradient = new SweepGradient(mXCenter,mRingColor,Color.parseColor("#b05e39"));
        sweepGradient = new SweepGradient(mXCenter,arcColors,arcPostion);

        Matrix matrix = new Matrix();
        matrix.setRotate(-90,mXCenter,mYCenter);
        sweepGradient.setLocalMatrix(matrix);
        mRingPaint.setShader(sweepGradient);
      }
      canvas.drawArc(oval,-90,((float)mProgress / mTotalProgress) * 360,mRingPaint); //

      //字体
      String txt = mProgress + "%";
      mTxtWidth = mTextPaint.measureText(txt,txt.length());
      canvas.drawText(txt,mXCenter - mTxtWidth / 2,mYCenter + mTxtHeight / 4,mTextPaint);
    }
  }
  public void setText(String string){

  }

  //设置进度
  public void setProgress(int progress) {
    mProgress = progress;
    postInvalidate();//重绘
  }
}

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

以上是来客网为你收集整理的Android实现圆形渐变加载进度条全部内容,希望文章能够帮你解决Android实现圆形渐变加载进度条所遇到的程序开发问题。

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