刻度尺的间距一定要是能被整除的
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import androidx.annotation.Nullable;
/**
* @author : Lambert
* date : 2021/3/8 10:51 AM
*/
public class CircleProgressView extends View {
int mDiam = 800; //直径(环形背景)
int left = 100;
int top = 100;
int mDiam2 = 700; //直径(数字)
int left2 = 150;
int top2 = 150;
Path mPath;
Paint mPaintProgress;
Paint mPaintProgressColor;
RectF mRectF;
RectF mRectF2;
public CircleProgressView(Context context ) {
super(context, null);
}
public CircleProgressView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
initView();
}
private void initView(){
mPath = new Path();
mPath.reset();
mRectF = new RectF(left,top,left+ mDiam,top+ mDiam);
mRectF2 = new RectF(left2,top2,left2+ mDiam2,top2+ mDiam2);
mPaintProgress = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaintProgress.setStrokeWidth(40);
mPaintProgress.setColor(0xff454545);
mPaintProgress.setStyle(Paint.Style.STROKE);
mPaintProgress.setStrokeCap(Paint.Cap.ROUND);
mPaintProgress.setAlpha(40);
mPaintProgressColor = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaintProgressColor.setStrokeWidth(40);
mPaintProgressColor.setColor(0xffD7AE6B);
mPaintProgressColor.setStyle(Paint.Style.STROKE);
mPaintProgressColor.setStrokeCap(Paint.Cap.ROUND);
//绘制第一个环形背景
mPath.arcTo(mRectF,135,270);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawPath(mPath,mPaintProgress);
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xffeeeeee);
paintLine.setStrokeWidth(5);
canvas.drawLine(500,100,500,900,paintLine);
canvas.drawLine(100,500,900,500,paintLine);
int p1 = (int) (mDiam /2 * Math.sin(Math.PI* 45 /180));
int x1 = mDiam /2 - p1 + left;
int y1 = x1;
int x2 = mDiam /2 + p1 + left;
int y2 = x2;
int x3 = x2;
int y3 = y1;
int x4 = x1;
int y4 = y2;
canvas.drawLine(x1,y1,x2,y2,paintLine);
canvas.drawLine(x3,y3,x4,y4,paintLine);
//绘制带弧度的文字(学好了还能做盖章文案)
addTextPath(canvas);
//添加刻度尺
addKeDu1(canvas);
addKeDu2(canvas);
addKeDu3(canvas);
addKeDu4(canvas);
addKeDu5(canvas);
addKeDu6(canvas);
addEndKeDu(canvas);
//添加进度
addProgress(canvas);
}
private void addProgress(Canvas canvas){
Path mPathProgress = new Path();
mPathProgress.reset();
//70%的进度
float progress = 0.7f;
float sweepAngle = progress * 270;
mPathProgress.arcTo(mRectF,135,sweepAngle);
canvas.drawPath(mPathProgress,mPaintProgressColor);
}
//Android Canvas沿着Path绘制文字
private void addTextPath(Canvas canvas){
int startAngle = 135; //开始角度
int sweepAngle = 45; //总共 270度角,分6次则为 45度
String[] content={"0-10W","10-20W","20-30W","30-40W","40-50W","50W+"};
Paint mTextPaint = new Paint();
mTextPaint.setColor(Color.BLACK);
mTextPaint.setTextSize(40);
Path path=null;
for(int i=0;i<6;i++){
path=new Path();
path.addArc(mRectF2, startAngle, sweepAngle);
float textLength = mTextPaint.measureText(content[i]);//获得字体长度
float hOffset=(float)(mDiam2 *Math.PI*(sweepAngle*1.0/360)/2-textLength/2);//The distance along the path
float vOffset=(float)(mDiam2 /2/6); //垂直路径方向上的偏移
canvas.drawTextOnPath(content[i],path,hOffset,vOffset,mTextPaint);
Log.d("Circle","hOffset:"+hOffset +" vOffset: "+vOffset);
startAngle+=sweepAngle;
}
}
private void addKeDu1(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 45;
//刻度直径
int radius = 800 - 40;
int length = 80; //刻度线长度
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY+ py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY+ py_a2;
//绘制粗刻度线
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
//绘制细刻度线
int length2 = 50;
for(int i = 1;i<9;i++){
float angle2 = 45 - (i* 45 / 9);
int px_a3 = (int) (radius/2 * Math.cos(Math.PI* angle2 /180));
int py_a3 = (int) (radius/2 * Math.sin(Math.PI* angle2 /180));
int px_a_3 = pointX - px_a3;
int py_a_3 = pointY+ py_a3;
int radius3 = radius - length2;
int px_a4 = (int) (radius3/2 * Math.cos(Math.PI* angle2 /180));
int py_a4 = (int) (radius3/2 * Math.sin(Math.PI* angle2 /180));
int px_a_4 = pointX - px_a4;
int py_a_4 = pointY+ py_a4;
canvas.drawLine(px_a_3,py_a_3,px_a_4,py_a_4,paintLine2);
}
}
private void addKeDu2(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 0;
int radius = 800 - 40;
int length = 80;
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY+ py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY+ py_a2;
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
int length2 = 50;
for(int i = 1;i<9;i++){
float angle2 = angle + (i* 45 / 9);
int px_a3 = (int) (radius/2 * Math.cos(Math.PI* angle2 /180));
int py_a3 = (int) (radius/2 * Math.sin(Math.PI* angle2 /180));
int px_a_3 = pointX - px_a3;
int py_a_3 = pointY - py_a3;
int radius3 = radius - length2;
int px_a4 = (int) (radius3/2 * Math.cos(Math.PI* angle2 /180));
int py_a4 = (int) (radius3/2 * Math.sin(Math.PI* angle2 /180));
int px_a_4 = pointX - px_a4;
int py_a_4 = pointY - py_a4;
canvas.drawLine(px_a_3,py_a_3,px_a_4,py_a_4,paintLine2);
}
}
private void addKeDu3(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 45;
int radius = 800 - 40;
int length = 80;
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY - py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY - py_a2;
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
int length2 = 50;
for(int i = 1;i<9;i++){
float angle2 = angle + (i* 45 / 9);
int px_a3 = (int) (radius/2 * Math.cos(Math.PI* angle2 /180));
int py_a3 = (int) (radius/2 * Math.sin(Math.PI* angle2 /180));
int px_a_3 = pointX - px_a3;
int py_a_3 = pointY - py_a3;
int radius3 = radius - length2;
int px_a4 = (int) (radius3/2 * Math.cos(Math.PI* angle2 /180));
int py_a4 = (int) (radius3/2 * Math.sin(Math.PI* angle2 /180));
int px_a_4 = pointX - px_a4;
int py_a_4 = pointY - py_a4;
canvas.drawLine(px_a_3,py_a_3,px_a_4,py_a_4,paintLine2);
}
}
private void addKeDu4(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 90;
int radius = 800 - 40;
int length = 80;
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY - py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY - py_a2;
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
int length2 = 50;
for(int i = 1;i<9;i++){
float angle2 = angle + (i* 45 / 9);
int px_a3 = (int) (radius/2 * Math.cos(Math.PI* angle2 /180));
int py_a3 = (int) (radius/2 * Math.sin(Math.PI* angle2 /180));
int px_a_3 = pointX - px_a3;
int py_a_3 = pointY - py_a3;
int radius3 = radius - length2;
int px_a4 = (int) (radius3/2 * Math.cos(Math.PI* angle2 /180));
int py_a4 = (int) (radius3/2 * Math.sin(Math.PI* angle2 /180));
int px_a_4 = pointX - px_a4;
int py_a_4 = pointY - py_a4;
canvas.drawLine(px_a_3,py_a_3,px_a_4,py_a_4,paintLine2);
}
}
private void addKeDu5(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 135;
int radius = 800 - 40;
int length = 80;
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY - py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY - py_a2;
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
int length2 = 50;
for(int i = 1;i<9;i++){
float angle2 = angle + (i* 45 / 9);
int px_a3 = (int) (radius/2 * Math.cos(Math.PI* angle2 /180));
int py_a3 = (int) (radius/2 * Math.sin(Math.PI* angle2 /180));
int px_a_3 = pointX - px_a3;
int py_a_3 = pointY - py_a3;
int radius3 = radius - length2;
int px_a4 = (int) (radius3/2 * Math.cos(Math.PI* angle2 /180));
int py_a4 = (int) (radius3/2 * Math.sin(Math.PI* angle2 /180));
int px_a_4 = pointX - px_a4;
int py_a_4 = pointY - py_a4;
canvas.drawLine(px_a_3,py_a_3,px_a_4,py_a_4,paintLine2);
}
}
private void addKeDu6(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 180;
int radius = 800 - 40;
int length = 80;
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY - py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY - py_a2;
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
int length2 = 50;
for(int i = 1;i<9;i++){
float angle2 = angle + (i* 45 / 9);
int px_a3 = (int) (radius/2 * Math.cos(Math.PI* angle2 /180));
int py_a3 = (int) (radius/2 * Math.sin(Math.PI* angle2 /180));
int px_a_3 = pointX - px_a3;
int py_a_3 = pointY - py_a3;
int radius3 = radius - length2;
int px_a4 = (int) (radius3/2 * Math.cos(Math.PI* angle2 /180));
int py_a4 = (int) (radius3/2 * Math.sin(Math.PI* angle2 /180));
int px_a_4 = pointX - px_a4;
int py_a_4 = pointY - py_a4;
canvas.drawLine(px_a_3,py_a_3,px_a_4,py_a_4,paintLine2);
}
}
private void addEndKeDu(Canvas canvas){
int pointX = 500;
int pointY = 500;
Paint paintLine = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(12);
Paint paintLine2 = new Paint(Paint.ANTI_ALIAS_FLAG);
paintLine.setColor(0xff454545);
paintLine.setStrokeWidth(4);
float angle = 225;
int radius = 800 - 40;
int length = 80;
int px_a1 = (int) (radius/2 * Math.cos(Math.PI* angle /180));
int py_a1 = (int) (radius/2 * Math.sin(Math.PI* angle /180));
int px_a_1 = pointX - px_a1;
int py_a_1 = pointY - py_a1;
int radius2 = radius - length;
int px_a2 = (int) (radius2/2 * Math.cos(Math.PI* angle /180));
int py_a2 = (int) (radius2/2 * Math.sin(Math.PI* angle /180));
int px_a_2 = pointX - px_a2;
int py_a_2 = pointY - py_a2;
canvas.drawLine(px_a_1,py_a_1,px_a_2,py_a_2,paintLine);
}
}