Android自定义view绘制圆环占比动画

概述一、实现效果图二、核心代码1.自定义MyProgressView.javapackagecom.czhappy.effectdemo.view;

一、实现效果图

二、核心代码

1.自定义MyProgressVIEw.java

package com.czhappy.effectdemo.vIEw;import androID.content.Context;import androID.content.res.TypedArray;import androID.graphics.Bitmap;import androID.graphics.BitmapFactory;import androID.graphics.Canvas;import androID.graphics.color;import androID.graphics.Paint;import androID.graphics.Paint.FontMetrics;import androID.graphics.Rect;import androID.graphics.RectF;import androID.os.Handler;import androID.os.Message;import androID.text.TextUtils;import androID.util.AttributeSet;import androID.vIEw.VIEw;import com.czhappy.effectdemo.R;import com.czhappy.effectdemo.utils.ScreenUtil;public class MyProgressVIEw extends VIEw { // 画实心圆的画笔 private Paint mCirclePaint; // 画圆环的画笔 private Paint mRingDefaultPaint; // 已用环的画笔 private Paint mUsePaint; // 画圆环的画笔 private Paint mRingPaint; // 画白线的画笔 private Paint mlinePaint; // 画字体的画笔 private Paint mTextPaint; // 圆形颜色 private int mCirclecolor; // 圆环颜色 private int mRingcolor; // 半径 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 int mShowProgress; // 已用流量 private String usedFlow; private Context mContext; private Handler circleHandler = new Handler(){  public voID handleMessage(Message msg) {   super.handleMessage(msg);   if(msg.what == 1){    int temp = (Integer)msg.obj;    setProgress(temp);   }  }; }; public MyProgressVIEw(Context context,AttributeSet attrs) {  super(context,attrs);  mContext = context;  // 获取自定义的属性  initAttrs(context,attrs);  ini@R_301_6672@iable(); } 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);  mRingRadius = mRadius + mstrokeWIDth / 2; } private voID ini@R_301_6672@iable() {  //画圆画笔设置  mCirclePaint = new Paint();  mCirclePaint.setAntiAlias(true);//防锯齿  mCirclePaint.setcolor(mCirclecolor);  mCirclePaint.setStyle(Paint.Style.FILL);  //“使用”字画笔设置  mUsePaint = new Paint();  mUsePaint.setAntiAlias(true);  mUsePaint.setStyle(Paint.Style.FILL);  mUsePaint.setcolor(getResources().getcolor(R.color.ticket_color));  mUsePaint.setTextSize(ScreenUtil.sp2px(mContext,10));  //圆环画笔设置  mRingDefaultPaint = new Paint();  mRingDefaultPaint.setAntiAlias(true);  mRingDefaultPaint.setcolor(getResources().getcolor(R.color.default_ring_color));  mRingDefaultPaint.setStyle(Paint.Style.stroke);  mRingDefaultPaint.setstrokeWIDth(mstrokeWIDth);  //已使用多少圆环画笔设置  mRingPaint = new Paint();  mRingPaint.setAntiAlias(true);  mRingPaint.setcolor(mRingcolor);  mRingPaint.setStyle(Paint.Style.stroke);  mRingPaint.setstrokeWIDth(mstrokeWIDth);  mTextPaint = new Paint();  mTextPaint.setAntiAlias(true);  mTextPaint.setStyle(Paint.Style.FILL);  mTextPaint.setcolor(color.BLACK);  mTextPaint.setTextSize(ScreenUtil.sp2px(mContext,22));  mlinePaint = new Paint();  mlinePaint.setcolor(color.WHITE);  //获取字体高度  FontMetrics fm = mTextPaint.getFontMetrics();  mTxtHeight = (int) Math.ceil(fm.descent - fm.ascent); } @OverrIDe protected voID onDraw(Canvas canvas) {  mXCenter = getWIDth() / 2;  mYCenter = getHeight() / 2;  //画圆  canvas.drawCircle(mXCenter,mYCenter,mRadius,mCirclePaint);  RectF oval = new RectF();  oval.left = (mXCenter - mRingRadius);  oval.top = (mYCenter - mRingRadius);  oval.right = mRingRadius * 2 + (mXCenter - mRingRadius);  oval.bottom = mRingRadius * 2 + (mYCenter - mRingRadius);  //画整圆弧  canvas.drawArc(oval,-90,360,false,mRingDefaultPaint);  //已使用多少圆弧  canvas.drawArc(oval,((float) mProgress / mTotalProgress) * 360,mRingPaint);  //文字绘制  String txt = mProgress + "%";  //文字的长度  mTxtWIDth = mTextPaint.measureText(txt,txt.length());  canvas.drawText(txt,mXCenter - mTxtWIDth / 2,mYCenter + mTxtHeight / 9,mTextPaint);  Rect _pb = new Rect();  String sup = "已用";  mUsePaint.getTextBounds(sup,sup.length(),_pb);  int perX = mXCenter - _pb.wIDth() / 2;  canvas.drawText(sup,perX,mYCenter / 2,mUsePaint);  if (!TextUtils.isEmpty(usedFlow)) {   mUsePaint.getTextBounds(usedFlow,usedFlow.length(),_pb);   perX = mXCenter - _pb.wIDth() / 2;   canvas.drawText(usedFlow,(float) (mYCenter + mYCenter / 1.7),mUsePaint);  }  //画横线图片  Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.mipmap.circle_bottom_bg);  perX = mXCenter - bitmap.getWIDth() / 2;  canvas.drawBitmap(bitmap,(float) (mYCenter + mYCenter / 5),mlinePaint); } /**  * 设置当前进度  * @param progress  */ public voID setProgress(int progress) {  mProgress = progress;  postInvalIDate(); } /**  * 实际展示总进度  * @param progress  */ public voID setmShowProgress(int progress) {  mShowProgress = progress;  new Thread(new CircleThread()).start(); } public voID setUsedFlow(String usedFlow) {  this.usedFlow = usedFlow; } private class CircleThread implements Runnable{  int m=0;  int i=0;  @OverrIDe  public voID run() {   // Todo auto-generated method stub   while(!Thread.currentThread().isInterrupted()){    try {     Thread.sleep(50);     m++;     Message msg = new Message();     msg.what = 1;     if(i < mShowProgress){      i += m;     }else{      i = mShowProgress;      return;     }     msg.obj = i;     circleHandler.sendMessage(msg);    } catch (InterruptedException e) {     // Todo auto-generated catch block     e.printstacktrace();    }   }  } }}

2.FlowActivity.java

package com.czhappy.effectdemo.activity;import androID.os.Bundle;import androID.support.annotation.Nullable;import androID.support.v7.app.AppCompatActivity;import androID.vIEw.VIEw;import com.czhappy.effectdemo.R;import com.czhappy.effectdemo.vIEw.MyProgressVIEw;/** * Description: * User: chenzheng * Date: 2017/1/21 0021 * Time: 17:17 */public class FlowActivity extends AppCompatActivity { private MyProgressVIEw mTasksVIEw; @OverrIDe protected voID onCreate(@Nullable Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentVIEw(R.layout.activity_flow);  initVIEw(); } private voID initVIEw() {  mTasksVIEw = (MyProgressVIEw) findVIEwByID(R.ID.flow_prgress_vIEw); } public voID beginAnim(VIEw vIEw){  mTasksVIEw.setUsedFlow("200.0M");  mTasksVIEw.setmShowProgress(60); }}

3.activity_flow.xml

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID" xmlns:tc="http://schemas.androID.com/apk/res-auto" androID:layout_wIDth="match_parent" androID:layout_height="match_parent" androID:padding="10dp" androID:background="#fff" androID:gravity="center_horizontal" androID:orIEntation="vertical"> <button  androID:layout_wIDth="match_parent"  androID:layout_height="wrap_content"  androID:onClick="beginAnim"  androID:text="开始动画"/> <com.czhappy.effectdemo.vIEw.MyProgressVIEw  androID:ID="@+ID/flow_prgress_vIEw"  androID:layout_wIDth="100dp"  androID:layout_height="100dp"  tc:circlecolor="@color/circle_color"  tc:radius="44dp"  tc:ringcolor="@color/ring_color"  tc:strokeWIDth="6dp"  androID:layout_margintop="10dp"/></linearLayout>

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

总结

以上是内存溢出为你收集整理的Android自定义view绘制圆环占比动画全部内容，希望文章能够帮你解决Android自定义view绘制圆环占比动画所遇到的程序开发问题。

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