100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > android自定义圆形进度条 实现动态画圆效果

android自定义圆形进度条 实现动态画圆效果

时间:2021-12-17 18:23:22

相关推荐

android自定义圆形进度条 实现动态画圆效果

自定义圆形进度条效果图如下:应用场景如动态显示分数等。

view的自定义属性如下attr.xml

<?xml version="1.0" encoding="UTF-8"?><resources><declare-styleable name="ArcProgressbar"><!-- 圆环起始角度--><attr name="startAngle" format="integer" /><attr name="radius" format="integer" /><!-- 圆环的宽度 默认115--><attr name="trokeWidth" format="integer" /><!-- 进度条进度颜色 --><attr name="arcColor" format="color" /></declare-styleable></resources>

view代码如下:

package com.gdmob.ui;import android.content.Context;import android.content.res.Resources;import android.content.res.TypedArray;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Paint.Cap;import android.graphics.RectF;import android.util.AttributeSet;import android.util.DisplayMetrics;import android.util.Log;import android.util.TypedValue;import android.view.View;import com.cwits.cex.picc.R;/*** 自定义圆形进度条* @author hai**/public class ArcProgressbar extends View {/*** 圆环半径*/private int mRadius = 115; // Diameter英文为直径,该常量表示小圆直径的dp值/*** 圆环的宽度*/private int mTrokeWidth = 15;/*** 起始角度*/private int mStartAngle = 135;/*** 进度条进度颜色*/private int mArcColor;private Paint mPaint;private int mProgress;// 表示进度private RectF mRect;private int mDiameter; // Diameter英文为直径,在该View中要绘制圆环,圆环由两个圆形确定(大圆和小圆),这个整形值表示小圆直径。private int mWidth;// 这个值表示圆环的宽度的2倍(大圆直径-小圆直径)private final int defaultColor; // 进度条背景颜色public ArcProgressbar(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);defaultColor = Color.TRANSPARENT;TypedArray ta = context.getTheme().obtainStyledAttributes(attrs, R.styleable.ArcProgressbar, defStyle, 0);int num = ta.getIndexCount();for (int i = 0; i < num; i++) {int attr = ta.getIndex(i);switch (attr) {case R.styleable.ArcProgressbar_startAngle:mStartAngle = ta.getInt(attr, 135);break;case R.styleable.ArcProgressbar_arcColor:mArcColor = ta.getColor(attr, Color.parseColor("#eed306"));break;case R.styleable.ArcProgressbar_trokeWidth:mTrokeWidth = ta.getInt(attr, 15);break;case R.styleable.ArcProgressbar_radius:mRadius = ta.getInt(attr, 115);break;}}init();}public ArcProgressbar(Context context, AttributeSet attrs) {this(context, attrs, 0);}public ArcProgressbar(Context context) {this(context, null);}private void init() {Resources res = getResources();// getDisplayMetrics()返回当前展示的metrics.DisplayMetrics metrics = res.getDisplayMetrics();// TypedValue.applyDimension(int unit, float value, DisplayMetrics// metrics)// 该方法中unit表示要转换成的单位,value表示数值,metrics表示当前的度量方式// DIAMETER是常量0x1E,十进制为30,下面语句就表示tmp的值为30dp换算成的像素数值float tmp = TypedValue.applyDimension(PLEX_UNIT_DIP, mRadius, metrics);// ceil函数表示向上取整mDiameter = (int) Math.ceil(tmp);tmp = TypedValue.applyDimension(PLEX_UNIT_DIP, mTrokeWidth, metrics);mWidth = (int) Math.ceil(tmp);Paint p = new Paint();p.setStyle(Paint.Style.STROKE);p.setAntiAlias(true);// setStrokeWidth()设置画笔宽度// p.setStrokeWidth(0.5F*mWidth+0.5F*mDiameter);p.setStrokeWidth(0.4F * mWidth);p.setStrokeCap(Cap.ROUND);p.setColor(defaultColor);mPaint = p;float rightTop = (float) (mWidth / 2.0);// 这个值就是圆环宽度(大圆半径-小圆半径)mRect = new RectF(rightTop, rightTop, mDiameter + rightTop, mDiameter + rightTop);mProgress = 0;}protected boolean clear = false;@Overrideprotected void onDraw(Canvas canvas) {// super.onDraw(canvas);// 如果mProgress<360,则圆形进度条还未旋转完成,则用0x7f的透明度绘制一个完整的圆形作为进度条背景// 注意要先绘制背景条,再绘制进度条,因为后绘制的会覆盖在先绘制的上面/** if (mProgress < 360) { paint.setAlpha(0x7f);* paint.setColor(defaultColor); canvas.drawArc(mRect, 135, 270, false,* paint); }*/if (clear) {mPaint.setColor(Color.TRANSPARENT);clear = false;return;}if (mProgress != 0) {Paint paint = mPaint;paint.setColor(mArcColor);float degree = (float) (360.0f * mProgress / 360);paint.setAlpha(0xff);paint.setColor(mArcColor);canvas.drawArc(mRect, mStartAngle, degree, false, paint);}}@Overrideprotected final void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {// mDiameter表示小圆直径,mWidth表示圆环宽度的2倍,所以meas表示大圆直径// 所以View的hight,width都为measfinal int meas = mDiameter + mWidth;setMeasuredDimension(meas, meas);}public void setProgress(int p) {mProgress = p;invalidate();}public void postProgress(final int p) {post(new Runnable() {@Overridepublic void run() {setProgress(p);}});}public void setmArcColor(int mArcColor) {this.mArcColor = mArcColor;}public void reset() {clear = true;invalidate();mProgress = 0;}}

如上要让分数和进度条动态从0变到90,思路:定义一个变量mProgress=0,new一个定时任务,让mProgress慢慢从0 加到90后停止,

ArcProgressbar不停地调用setProgress(int p)就可以了。

代码如下:

private void setGrade(final int g) {mProgress = 1;arcProgressbar.reset();final Handler handler = new Handler() {@Overridepublic void handleMessage(Message msg) {if (0 < (mProgress / 3.6) && (mProgress / 3.6) <= 59) {arcProgressbar.setmArcColor(Color.parseColor("#ff0000"));tv_grade.setTextColor(Color.parseColor("#ff0000"));} else if (60 < (mProgress / 3.6) && (mProgress / 3.6) <= 79) {arcProgressbar.setmArcColor(Color.parseColor("#f39700"));tv_grade.setTextColor(Color.parseColor("#f39700"));} else if (80 < (mProgress / 3.6) && (mProgress / 3.6) <= 100) {arcProgressbar.setmArcColor(Color.parseColor("#42ae7c"));tv_grade.setTextColor(Color.parseColor("#42ae7c"));}if (msg.what == 0x1223) {arcProgressbar.setProgress(mProgress * (1));tv_grade.setText("" + (int) (mProgress / 3.6));} else if (msg.what == 0x1224) {tv_grade.setText("" + g);}}};new Timer().schedule(new TimerTask() {@Overridepublic void run() {Message msg = new Message();if (mProgress < (int) (((float) 360 / 100) * g)) {msg.what = 0x1223;mProgress++;} else {msg.what = 0x1224;this.cancel();}handler.sendMessage(msg);}}, 0, 5);}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。