发生这个错误百思不得其解,最后发现是绘制调用问题
有三个构造方法,
第一个构造方法时在代码中创建view的时候可以使用的
而第二个构造方法则是在xml中创建view的时候使用的。
我使用了第三个构造方法,因此Paint为空,出现这个问题,将其放在第二个构造方法中,问题解决
全部代码
attrs
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="QQstepView">
<attr name="outerColor" format="color"/>
<attr name="innerColor" format="color"/>
<attr name="borderWidth" format="dimension"/>
<attr name="stepTextSize" format="dimension"/>
<attr name="stepTextColor" format="color"/>
</declare-styleable>
</resources>
QQStepView .class
package com.example.qq_step;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;
public class QQStepView extends View {
private int mOuterColor = Color.RED;
private int mInnerColor = Color.BLUE;
private int mBorderWidth = 20;
private int mStepTextSize;
private int mStepTextColor;
private Paint mOutPaint, mInnerPaint,mTextPaint;
private int mStepMax = 0;
private int mCurrentStep = 0;
public QQStepView(Context context) {
super(context,null);
}
public QQStepView(Context context, AttributeSet attrs) {
super(context, attrs,0);
TypedArray array = context.obtainStyledAttributes(attrs,R.styleable.QQstepView);
mOuterColor = array.getColor(R.styleable.QQstepView_outerColor,mOuterColor);
mInnerColor = array.getColor(R.styleable.QQstepView_innerColor,mInnerColor);
mBorderWidth = (int) array.getDimension(R.styleable.QQstepView_borderWidth,mBorderWidth);
mStepTextSize = array.getDimensionPixelSize(R.styleable.QQstepView_stepTextSize,mStepTextSize);
mStepTextColor = array.getColor(R.styleable.QQstepView_stepTextColor,mStepTextColor);
array.recycle();//用完以后将array回收
mOutPaint = new Paint();
mOutPaint.setAntiAlias(true);
mOutPaint.setStrokeWidth(mBorderWidth);
mOutPaint.setColor(mOuterColor);
mOutPaint.setStrokeCap(Paint.Cap.ROUND);
mOutPaint.setStyle(Paint.Style.STROKE);
mInnerPaint = new Paint();
mInnerPaint.setAntiAlias(true);
mInnerPaint.setStrokeWidth(mBorderWidth);
mInnerPaint.setColor(mInnerColor);
mInnerPaint.setStrokeCap(Paint.Cap.ROUND);
mInnerPaint.setStyle(Paint.Style.STROKE);
mTextPaint = new Paint();
mTextPaint.setAntiAlias(true);
mTextPaint.setColor(mStepTextColor);
mTextPaint.setTextSize(mStepTextSize);
}
public QQStepView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//1.分析效果
//2.确定自定义属性,编写attrs.xml
//3.在布局中使用
//4.在自定义View中获取自定义属性
//5.onMeasure()
//6.画外圆弧、内圆弧、文字
//7.其它
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//获取 考虑宽度和高度不一样的情况
int width = MeasureSpec.getSize(widthMeasureSpec);
int height = MeasureSpec.getSize(heightMeasureSpec);
setMeasuredDimension(width>height?height:width,width>height?height:width);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// int center = getWidth()/2;
// int radius = getWidth()/2 - mBorderWidth/2;
//6.1 画外圆弧 顺序左上右下
RectF rectF = new RectF(mBorderWidth/2,mBorderWidth/2,getWidth()-mBorderWidth/2,getHeight()-mBorderWidth/2);
//从135度开始画到270度,剩下90度
canvas.drawArc(rectF,135,270,false,mOutPaint);
if (mStepMax == 0) {
return;//防止第一次进入时为0,引起错误
}
float sweepAngle = (float) mCurrentStep / mStepMax;
canvas.drawArc(rectF, 135, sweepAngle * 270, false, mInnerPaint);
//6.2画内圆弧
//6.3 画文字
//画文字
String stepText = mCurrentStep + "";
Rect textBounds = new Rect();
mTextPaint.getTextBounds(stepText, 0, stepText.length(), textBounds);
int dx = getWidth() / 2 - textBounds.width() / 2;//文字的起始位置
//基线
Paint.FontMetricsInt fontMetricsInt = mTextPaint.getFontMetricsInt();
int dy = (fontMetricsInt.bottom - fontMetricsInt.top)/2 - fontMetricsInt.bottom;
int baseLine = getHeight() / 2 + dy;
canvas.drawText(stepText, dx, baseLine, mTextPaint);
}
public synchronized void setStepMax(int stepMax) {
this.mStepMax = stepMax;
}
// synchronized,防止多线程操作出错
public synchronized void setCurrentStep(int currentStep) {
this.mCurrentStep = currentStep;
//不断绘制
invalidate();
}
}
activity_main
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity">
<com.example.qq_step.QQStepView
android:id="@+id/step_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:borderWidth="10dp"
app:innerColor="@color/colorAccent"
app:outerColor="@color/colorPrimary"
app:stepTextColor="@color/colorAccent"
app:stepTextSize="30sp" />
</RelativeLayout>
mainactivity
package com.example.qq_step;
import androidx.appcompat.app.AppCompatActivity;
import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.os.Bundle;
import android.view.View;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final QQStepView qqStepView = findViewById(R.id.step_view);
qqStepView.setStepMax(20000);
final ValueAnimator valueAnimator = ObjectAnimator.ofFloat(0, 12450);
valueAnimator.setDuration(1000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
float value = (float) valueAnimator.getAnimatedValue();
qqStepView.setCurrentStep((int)value);
}
});
qqStepView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
valueAnimator.start();
}
});
}
}
效果