仿QQ郵箱載入動畫

摘要： 效果圖 效果圖 程式碼實現 /** * 建立時間: 2018/9/20 * * @author Liuzj * @description 仿QQ郵箱下拉重新整理動畫 */ public class LoadingView exten...

效果圖

程式碼實現

/**
 * 建立時間: 2018/9/20
 *
 * @author Liuzj
 * @description 仿QQ郵箱下拉重新整理動畫
 */
public class LoadingView extends View {

/**
* 小球數
*/
private List<Paint> mPaints;

/**
* 預設小球數
*/
private static int DEFAULT_NUM = 3;

/**
* 小球畫筆
*/
private Paint mPaint;
/**
* 預設小球半徑
*/
private float defaultRadius = 12f;
/**
* 預設小球顏色
*/
private int[] ballColors = {Color.RED, Color.YELLOW, Color.BLUE};

/**
* 小球起點位置
*/
private float x = -80f;
;

public LoadingView(Context context) {
super(context);
init();
}

public LoadingView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}

public LoadingView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}


private void init() {
mPaints = new ArrayList<>();
for (int i = 0; i < DEFAULT_NUM; i++) {
mPaint = new Paint();
mPaint.setColor(ballColors[i]);
mPaints.add(mPaint);
}
}

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
for (int i = 0; i < mPaints.size(); i++) {
//控制小球在80和-80之間運動
x += 40f;
if (x == 80f) {
x = -80f;
}
//控制小球大小在12至16之間徘徊
defaultRadius += 2f;
if (defaultRadius > 16f) {
defaultRadius = 12f;
}
canvas.drawCircle(getWidth() / 2 + x, getHeight() / 2, defaultRadius, mPaints.get(i));
}
postInvalidateDelayed(250);
}
}

後續

先初步實現效果後續再完善吧，謝謝觀看