1.思路:
1.自定义中间的圆形,
2.自定义中间显示的文字;
3.自定义外圈的弧线。
2.代码实现:
package com.best.keke.circleprogressdemo;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
/**
* Created by keke on 2016/5/29.
*/
public class CircleProgressView extends View {
private int widthMeasure;
private int heightMeasure;
private RectF arcRect; // 弧线的矩形区域
private float sweepAngle; //圆弧扫过的角度
private float sweepValues = ;
private Paint arcPaint; // 创建圆弧的画笔样式
private float circleXY; // 圆的x/y坐标
private float radius; // 圆的半径
private Paint circlePaint; // 画圆的画笔
private String drawText; // 写的文字
private float textSize; // 文字的大小
private Paint textPaint; // 文字的画笔
public CircleProgressView(Context context) {
super(context);
}
public CircleProgressView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CircleProgressView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
widthMeasure = MeasureSpec.getSize(widthMeasureSpec);
heightMeasure = MeasureSpec.getSize(heightMeasureSpec);
Log.e("tag","宽:"+widthMeasure + "高:" + heightMeasure + "");
setMeasuredDimension(widthMeasure, heightMeasure);
// 初始化数据
initView();
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
/**
* 弧线
* @param oval 指定圆弧的外轮廓矩形区域
* @param startAngle 圆弧起始角度,单位为度
* @param sweepAngle 圆弧扫过的角度,顺时针方向,单位为度
* @param useCenter true 表示在绘制圆弧的时候将圆心包括在内,可以用来绘制扇形,false类似空心圆管状
* @param paint 画笔
*/
canvas.drawArc(arcRect, , sweepAngle, false, arcPaint);
/**
* 圆
* @param cx 圆心x坐标
* @param cy 圆心y坐标
* @param radius 半径
* @param paint 画笔
*/
canvas.drawCircle(circleXY, circleXY, radius, circlePaint);
/**
* 文字
* @param text 显示的文字
* @param start 第一个文字的起始位置
* @param end 最后一个文字结束的位置
* @param x 文字的X坐标
* @param y 文字基线的y坐标
* @param paint 画笔
*/
canvas.drawText(drawText, , drawText.length(), circleXY,
circleXY + (textSize / ), textPaint);
}
private void initView() {
float length = ;
if (heightMeasure >= widthMeasure) {
length = widthMeasure;
} else {
length = heightMeasure;
}
// 定义弧形的外接矩形的坐标
arcRect = new RectF(
(float) (length * ),
(float) (length * ),
(float) (length * ),
(float) (length * ));
sweepAngle = (sweepValues / f) * f;
Log.i("tag","角度:"+String.valueOf(sweepAngle));
arcPaint = new Paint();
arcPaint.setAntiAlias(true); // 消除锯齿
arcPaint.setStrokeWidth((float) (length * )); // 设置划线的线宽
arcPaint.setColor(Color.BLUE);
arcPaint.setStyle(Paint.Style.STROKE); // 设置画笔空心
circleXY = length / ;
Log.i("tag","length:"+String.valueOf(length));
Log.i("tag","圆心坐标:"+String.valueOf(circleXY));
radius = (float) ((length * ) / );
Log.i("tag","半径:"+String.valueOf(radius));
circlePaint = new Paint();
circlePaint.setAntiAlias(true);
circlePaint.setColor(Color.GREEN);
drawText = setText();
textSize = setTextSize();
textPaint = new Paint();
textPaint.setTextSize(textSize);
textPaint.setTextAlign(Paint.Align.CENTER);
}
/**
* 设置显示的文字的大小
*
* @return
*/
private float setTextSize() {
this.invalidate();
return ;
}
/**
* 设置显示的文字
*
* @return
*/
private String setText() {
this.invalidate(); // 更新显示
return "keke_come on";
}
/**
* 给扇形的大小进行赋值
* @param sweepValues
*/
public void setSweepValues(float sweepValues) {
if (sweepValues != ) {
sweepValues = sweepValues;
} else {
sweepValues = ;
}
this.invalidate();
}
}
public class MainActivity extends AppCompatActivity {
private CircleProgressView circleProgress;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
circleProgress = (CircleProgressView) findViewById(R.id.circleProgress);
circleProgress.setSweepValues();
}
}
3.效果展示:
自定义CircleProgressView控件