您的位置:首页 > 移动开发 > Android开发

android仿IOS 旋转菊花Loading、等待Loading、花瓣

2016-12-03 19:06 609 查看


    好久没写博客了,每天都在不停的进步着,今天给大家带来的是仿菊花loading,在百度看了许多,大部分都是通过图片的方式实现的,那么我现在是通过自定义view的方式实现的,废话也不多说了,就在代码中注释讲解。本文地址:http://blog.csdn.net/qq_29849667/article/details/53446911

/**
* Created by Sick on 2016/12/2.
*/
public class IOSLoadingView extends View {

private static final String TAG = IOSLoadingView.class.getSimpleName();
/**
* view宽度
*/
private int width;
/**
* view高度
*/
private int height;
/**
* 菊花的矩形的宽
*/
private int widthRect;
/**
* 菊花的矩形的宽
*/
private int heigheRect;
/**
* 菊花绘制画笔
*/
private Paint rectPaint;
/**
* 循环绘制位置
*/
private int pos = 0;
/**
* 菊花矩形
*/
private Rect rect;
/**
* 循环颜色
*/
private String[] color = {"#bbbbbb", "#aaaaaa", "#999999", "#888888", "#777777", "#666666",};

public IOSLoadingView(Context context) {
this(context, null);
}

public IOSLoadingView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}

public IOSLoadingView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}

private void init() {
rectPaint = new Paint(Paint.ANTI_ALIAS_FLAG);

}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int widthMode = MeasureSpec.getMode(widthMeasureSpec);
int heightMode = MeasureSpec.getMode(heightMeasureSpec);
//根据个人习惯设置  这里设置  如果是wrap_content  则设置为宽高200
if (widthMode == MeasureSpec.AT_MOST || heightMode == MeasureSpec.AT_MOST) {
width = 200;
} else {
width = MeasureSpec.getSize(widthMeasureSpec);
height = MeasureSpec.getSize(heightMeasureSpec);
width = Math.min(width, height);
}

widthRect = width / 12;   //菊花矩形的宽
heigheRect = 4 * widthRect;  //菊花矩形的高
setMeasuredDimension(width, width);
}

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//绘制部分是关键了,菊花花瓣矩形有12个,我们不可能去一个一个的算出所有的矩形坐标,我们可以考虑
//旋转下面的画布canvas来实现绘制,每次旋转30度
//首先定义一个矩形
if (rect == null) {
rect = new Rect((width - widthRect) / 2, 0, (width + widthRect) / 2, heigheRect);
}
//       0  1  2  3  4  5  6  7  8  9  10  11   i的值
        // ————————————————————————————————————————————————————————
        //  0   ‖ 0 | 1 | 2 | 3 | 4 | 5 | 5 | 5 | 5 | 5 | 5 | 5 ‖
        //  1   ‖ 5 | 0 | 1 | 2 | 3 | 4 | 5 | 5 | 5 | 5 | 5 | 5 ‖
        //  2   ‖ 5 | 5 | 0 | 1 | 2 | 3 | 4 | 5 | 5 | 5 | 5 | 5 ‖
        //  3   ‖ 5 | 5 | 5 | 0 | 1 | 2 | 3 | 4 | 5 | 5 | 5 | 5 ‖
        //  4   ‖ 5 | 5 | 5 | 5 | 0 | 1 | 2 | 3 | 4 | 5 | 5 | 5 ‖
        //  5   ‖ 5 | 5 | 5 | 5 | 5 | 0 | 1 | 2 | 3 | 4 | 5 | 5 ‖
        //  6   ‖ 5 | 5 | 5 | 5 | 5 | 5 | 0 | 1 | 2 | 3 | 4 | 5 ‖
        //  7   ‖ 5 | 5 | 5 | 5 | 5 | 5 | 5 | 0 | 1 | 2 | 3 | 4 ‖
        //  8   ‖ 4 | 5 | 5 | 5 | 5 | 5 | 5 | 5 | 0 | 1 | 2 | 3 ‖
        //  9   ‖ 3 | 4 | 5 | 5 | 5 | 5 | 5 | 5 | 5 | 0 | 1 | 2 ‖
        //  10   ‖ 2 | 3 | 4 | 5 | 5 | 5 | 5 | 5 | 5 | 5 | 0 | 1 ‖
        //  11   ‖ 1 | 2 | 3 | 4 | 5 | 5 | 5 | 5 | 5 | 5 | 5 | 0 ‖
//  pos的值
  
for (int i = 0; i < 12; i++) {
if (i - pos >= 5) {
rectPaint.setColor(Color.parseColor(color[5]));
} else if (i - pos >= 0 && i - pos < 5) {
rectPaint.setColor(Color.parseColor(color[i - pos]));
} else if (i - pos >= -7 && i - pos < 0) {
rectPaint.setColor(Color.parseColor(color[5]));
} else if (i - pos >= -11 && i - pos < -7) {
rectPaint.setColor(Color.parseColor(color[12 + i - pos]));
}

canvas.drawRect(rect, rectPaint);  //绘制
canvas.rotate(30, width / 2, width / 2);    //旋转
}

pos++;
if (pos > 11) {
pos = 0;
}

postInvalidateDelayed(100);  //一个周期用时1200

}

//    public void setStartAnimal() {
//        ValueAnimator valueAnimator = ValueAnimator.ofInt(0, 12);
//        valueAnimator.setDuration(1500);
//        valueAnimator.setRepeatCount(ValueAnimator.INFINITE);
//        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
//            @Override
//            public void onAnimationUpdate(ValueAnimator animation) {
//                pos = (int) animation.getAnimatedValue();
//                Log.d(TAG, "pos:" + pos);
//                invalidate();
//            }
//        });
//        valueAnimator.start();
//    }

}
到这里就结束了,下一篇 会重新写一个弹性recyclerview的容器。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: