好久没写博客了，每天都在不停的进步着，今天给大家带来的是仿菊花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的容器。