由于項(xiàng)目要求,需要寫一個(gè)加載動(dòng)畫,正在加載的時(shí)候轉(zhuǎn)圈,加載成功后出現(xiàn)笑臉,加載失敗后出現(xiàn)哭臉,于是寫了個(gè)自定義view,現(xiàn)在貼出來
public class FaceView extends View {
private int status = 0;//0 普通 1成功 2失敗
public static final int NORMAL = 0;
public static final int SUCCESS = 1;
public static final int FAILED = 2;
/**
* 畫筆對(duì)象的引用
*/
private Paint paintArc;
private Paint paintRing;//圓環(huán)
private Paint paintEye; //眼睛
private Paint paintMouth;//嘴巴
/**
* 圓環(huán)的顏色
*/
private int roundColor;
/**
* 圓環(huán)進(jìn)度的顏色
*/
private int roundProgressColor;
/**
* 圓環(huán)的寬度
*/
private float roundWidth;
/**
* 最大進(jìn)度
*/
private int max;
/**
* 當(dāng)前進(jìn)度
*/
private int progress = 0;
private boolean finish = false;
private int eyeRadius = 1;
private long maxTimer = 10;
private int mActionHeartbeat = 1 ;
private CountdownTimerListener mListener;
public FaceView(Context context) {
this(context, null);
}
public FaceView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public FaceView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
paintRing = new Paint();
paintArc = new Paint();
paintEye = new Paint();
paintMouth = new Paint();
TypedArray mTypedArray = context.obtainStyledAttributes(attrs,
com.qeebike.map.R.styleable.FaceView);
//獲取自定義屬性和默認(rèn)值
roundColor = mTypedArray.getColor(com.qeebike.map.R.styleable.FaceView_roundColor, Color.RED);
roundProgressColor = mTypedArray.getColor(com.qeebike.map.R.styleable.FaceView_roundProgressColor, Color.GREEN);
roundWidth = mTypedArray.getDimension(com.qeebike.map.R.styleable.FaceView_roundWidth, 5);
max = mTypedArray.getInteger(com.qeebike.map.R.styleable.FaceView_max, 100);
maxTimer = AppBaseConfigManager.getInstance().getmAppBaseConfigInfo().getBaseInfo().getUnlockTimeOut();
mTypedArray.recycle();
}
private void initPaint() {
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
/**
* 畫最外層的大圓環(huán)
*/
int centre = getWidth() / 2; //獲取圓心的x坐標(biāo)
int quarter = getWidth() / 4;
int third = getWidth() / 3;
int radius = (int) (centre - roundWidth / 2); //圓環(huán)的半徑
paintRing.setColor(roundColor); //設(shè)置圓環(huán)的顏色
paintRing.setStyle(Paint.Style.STROKE); //設(shè)置空心
paintRing.setStrokeWidth(roundWidth); //設(shè)置圓環(huán)的寬度
paintRing.setAntiAlias(true); //消除鋸齒
paintArc.setColor(roundColor); //設(shè)置圓環(huán)的顏色
paintArc.setStyle(Paint.Style.STROKE); //設(shè)置空心
paintArc.setStrokeWidth(roundWidth); //設(shè)置圓環(huán)的寬度
paintArc.setAntiAlias(true); //消除鋸齒
paintArc.setStrokeCap(Paint.Cap.ROUND);
if (status == FAILED) {
paintArc.setColor(roundColor); //設(shè)置進(jìn)度的顏色
} else {
paintArc.setColor(roundProgressColor); //設(shè)置進(jìn)度的顏色
}
if (status == FAILED) {
paintEye.setColor(roundColor);
} else {
paintEye.setColor(roundProgressColor);
}
paintEye.setStyle(Paint.Style.FILL);
paintEye.setAntiAlias(true);
if (status == FAILED) {
paintMouth.setColor(roundColor);
} else {
paintMouth.setColor(roundProgressColor);
}
paintMouth.setStyle(Paint.Style.STROKE); //設(shè)置空心
paintMouth.setStrokeWidth(roundWidth/2); //設(shè)置圓環(huán)的寬度
paintMouth.setAntiAlias(true);
paintMouth.setStrokeCap(Paint.Cap.ROUND);
//設(shè)置進(jìn)度是實(shí)心還是空心
RectF oval = new RectF(centre - radius, centre - radius, centre
+ radius, centre + radius); //用于定義的圓弧的形狀和大小的界限
RectF ovalMouthSuccess = new RectF((float) (centre - radius * 0.75), (float) (centre - radius * 0.70),
(float) (centre + radius * 0.70), (float) (centre + radius * 0.75));
RectF ovalMouthFailed = new RectF(centre - (int)(radius *0.65), (int)(centre+ radius*0.35),
centre + (int)(radius *0.65), getWidth());
int current = 360 * progress / max;
// int current = 270;
if (status == NORMAL) {
if (current >= 270) {
canvas.drawArc(oval, current - 270, 270, false, paintArc);
} else {
canvas.drawArc(oval, 0, current, false, paintArc); //根據(jù)進(jìn)度畫圓弧
}
postDelayed(new Runnable() {
@Override
public void run() {
progress++;
postInvalidate();
}
}, 1);
} else if (status == SUCCESS) {
canvas.drawCircle(centre, centre, radius, paintRing); //畫出圓環(huán)
canvas.drawArc(oval, 0, 360, false, paintArc);
canvas.drawCircle(quarter, third, eyeRadius, paintEye);
canvas.drawCircle(getWidth() - quarter, third, eyeRadius, paintEye);
canvas.drawArc(ovalMouthSuccess, 0, 10 * eyeRadius, false, paintMouth);
if (!finish) {
postDelayed(new Runnable() {
@Override
public void run() {
eyeRadius++;
if (eyeRadius == 18) {
finish = true;
}
postInvalidate();
}
}, 1);
}
} else if (status == FAILED) {
canvas.drawCircle(centre, centre, radius, paintRing); //畫出圓環(huán)
canvas.drawArc(oval, 0, 360, false, paintArc);
canvas.drawCircle(quarter, third, eyeRadius, paintEye);
canvas.drawCircle(getWidth() - quarter, third, eyeRadius, paintEye);
canvas.drawArc(ovalMouthFailed, -160, (float) (eyeRadius * 7.777777), false, paintMouth);
if (!finish) {
postDelayed(new Runnable() {
@Override
public void run() {
eyeRadius++;
if (eyeRadius == 18) {
finish = true;
}
postInvalidate();
}
}, 1);
}
}
}
public void setStatus(int status1) {
this.status = status1;
if (status1 == SUCCESS) {
postInvalidate();
} else if (status1 == FAILED) {
paintMouth.setColor(roundColor);
paintArc.setColor(roundColor);
paintEye.setColor(roundColor);
}
}
public void reset() {
maxTimer = AppBaseConfigManager.getInstance().getmAppBaseConfigInfo().getBaseInfo().getUnlockTimeOut();
status = NORMAL;
progress = 1000;
eyeRadius = 1;
postInvalidate();
finish = false;
mHandler.sendEmptyMessage(mActionHeartbeat);
}
/**
* 設(shè)置進(jìn)度的最大值
*
* @param max
*/
public synchronized void setMax(int max) {
if (max < 0) {
throw new IllegalArgumentException("max not less than 0");
}
this.max = max;
}
public void setmListener(CountdownTimerListener mListener) {
this.mListener = mListener;
}
public interface CountdownTimerListener{
//倒計(jì)時(shí)是否到達(dá)
public void onTimeArrive(boolean isArrive);
}
private Handler mHandler = new Handler() {
public void handleMessage(android.os.Message msg) {
if(msg.what == mActionHeartbeat){
maxTimer = maxTimer - 1000;
if (maxTimer > 0) {
mHandler.sendEmptyMessageDelayed(mActionHeartbeat,1000);
}else{
setStatus(FAILED);
if(mListener!=null){
mListener.onTimeArrive(false);
}
}
}
};
};
}
自定義屬性
<declare-styleable name="FaceView">
<!--圓環(huán)底色-->
<attr name="roundColor" format="color" />
<!--圓環(huán)進(jìn)度色-->
<attr name="roundProgressColor" format="color" />
<!--圓環(huán)寬度-->
<attr name="roundWidth" format="dimension"></attr>
<!--最大進(jìn)度-->
<attr name="max" format="integer"></attr>
</declare-styleable>
使用
1、XML
<***.FaceView
android:id="@id/loading_view"
android:layout_width="130dp"
android:layout_height="130dp"
android:layout_gravity="center"
app:roundProgressColor="@color/colorPrimary"
app:roundWidth="8dp"
app:roundColor="@color/text_gray_normal"
/>
2、Java
mFaceView= (FaceView) view.findViewById(R.id.loading_view);
//開始動(dòng)畫
mFaceView.reset();
//加載成功
mFaceView.setStatus(FaceView.SUCCESS);
//加載失敗
mFaceView.setStatus(FaceView.FAILED);
效果展示(靜圖展示三種狀態(tài)的樣式,實(shí)則是動(dòng)態(tài)動(dòng)畫)

91CA375B-BC75-4DDE-B00C-33636AC94DE5.png

AEEADCC4-C65E-49D2-AC8E-21EE27B0F9DB.png

FA5F30C4-0DDB-434E-8B6F-D857C2698A51.png