Android项目实战(六十七):自定义圆形进度条
圆形进度条
支持设置:
1、圆环背景颜色
2、圆管背景宽度
3、进度圆环颜色
4、进度圆环宽度
5、圆环进度
6、开始角度
7、动画执行时间
自定义类:
package com.example.mainactivty; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.RectF; import android.util.AttributeSet; import android.util.TypedValue; import android.view.View; import android.view.animation.Animation; import android.view.animation.Transformation; import androidx.annotation.Nullable; public class ProgressBarView extends View { private Paint mPaint; // 画笔 private CircleBarAnim anim; // 动画 private float progressSweepAngle;//进度条圆弧扫过的角度 // 以下是自定义参数 private int mAnnulusWidth; // 圆环宽度 private int mProgressWidth; // 进度条宽度 private int mAnnulusColor; // 圆环颜色 private int mLoadColor; // 加载进度圆弧扫过的颜色 private int mProgress = 0; // 当前进度 private int maxProgress = 100; // 最大进度,默认100 public int startAngle = -90; // 开始圆点角度 public ProgressBarView(Context context) { this(context, null); } public ProgressBarView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public ProgressBarView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); // 获取自定义属性 TypedArray value = context.getTheme().obtainStyledAttributes(attrs, R.styleable.AnnulusCustomizeView, defStyleAttr, 0); int indexCount = value.getIndexCount(); for (int i = 0; i < indexCount; i++) { int parm = value.getIndex(i); switch (parm) { case R.styleable.AnnulusCustomizeView_startAngle: startAngle = value.getInt(parm, 90); break; case R.styleable.AnnulusCustomizeView_annulusWidth: mAnnulusWidth = value.getDimensionPixelSize(parm, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 10, getResources().getDisplayMetrics())); break; case R.styleable.AnnulusCustomizeView_progressWidth: mProgressWidth = value.getDimensionPixelSize(parm, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 10, getResources().getDisplayMetrics())); break; case R.styleable.AnnulusCustomizeView_annulusColor: mAnnulusColor = value.getColor(parm, Color.BLACK); break; case R.styleable.AnnulusCustomizeView_loadColor: mLoadColor = value.getColor(parm, Color.BLACK); break; case R.styleable.AnnulusCustomizeView_progress: mProgress = value.getInt(parm, 10); break; } } value.recycle(); // 动画 anim=new CircleBarAnim(); mPaint = new Paint(); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); // TODO:绘制圆环 // 获取圆形坐标 int centre = getWidth() / 2; // 获取半径 int radius = centre - mAnnulusWidth / 2-10; // 取消锯齿 mPaint.setAntiAlias(true); // 设置画笔宽度 mPaint.setStrokeWidth(mAnnulusWidth); // 设置空心 mPaint.setStyle(Paint.Style.STROKE); // 设置画笔颜色 mPaint.setColor(mAnnulusColor); canvas.drawCircle(centre, centre, radius, mPaint); // TODO:画圆弧,进度 // 获取进度条中心点 // 进度条半径 int progressRadius = centre - mAnnulusWidth /2-10; // 设置进度颜色 mPaint.setColor(mLoadColor); mPaint.setStrokeWidth(mProgressWidth); mPaint.setStyle(Paint.Style.STROKE); // 用于定义的圆弧的形状和大小的界限 RectF ovalStroke = new RectF(centre - progressRadius, centre - progressRadius, centre + progressRadius, centre + progressRadius); canvas.drawArc(ovalStroke, startAngle, progressSweepAngle, false, mPaint); } /** * 设置进度 * @param progress 进度值 * @param time 动画时间范围 */ public synchronized void setProgress(final int progress,int time) { anim.setDuration(time); this.startAnimation(anim); this.mProgress = progress; } // 动画 public class CircleBarAnim extends Animation { public CircleBarAnim() { } @Override protected void applyTransformation(float interpolatedTime, Transformation t) { super.applyTransformation(interpolatedTime, t); progressSweepAngle=interpolatedTime*(mProgress * 360 / maxProgress);//这里计算进度条的比例 postInvalidate(); } } public synchronized int getmProgress() { return mProgress; } }
属性值:
放在main->res->values->attr.xml文件
<?xml version="1.0" encoding="utf-8"?> <resources xmlns:tools="http://schemas.android.com/tools"> <attr name="annulusColor" format="color"/>//圆环颜色 <attr name="loadColor" format="color"/>//环形进度条加载颜色 <attr name="annulusWidth" format="dimension"/>//圆环宽度 <attr name="progressWidth" format="dimension"/>//圆环宽度 <attr name="startAngle" format="integer"/>//开始角度 <attr name="progress" format="integer"/>//圆环进度 <declare-styleable name="AnnulusCustomizeView"> <attr name="annulusColor"/> <attr name="loadColor"/> <attr name="annulusWidth"/> <attr name="progressWidth"/> <attr name="startAngle"/> <attr name="progress"/> </declare-styleable> </resources>
xml使用:
<com.example.mainactivty.ProgressBarView android:id="@+id/progressBar" android:layout_width="50dp" android:layout_height="50dp" android:padding="20dp" app:annulusColor="#F1EEE7" android:paddingVertical="6dp" android:paddingHorizontal="6dp" app:annulusWidth="4dp" app:loadColor="#BE9B79" app:progress="0" app:progressWidth="6dp" app:startAngle="-90" > </com.example.mainactivty.ProgressBarView>
progressBarView.setProgress(70,2000);
源码参考:
https://gitee.com/xqxacm/circleProgress
作者:听着music睡
出处:http://www.cnblogs.com/xqxacm/
Android交流群:38197636
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。