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的容器。
相关文章推荐
- android仿ios菊花LoadingView
- android高分段进阶攻略(3)旋转等待UI界面设计
- Android 和 iOS LoadingView单例模式的实现
- IOS&Android通用屏幕控制(移动旋转缩放)
- Android 自定义View练习:风扇吹花瓣加载中loading进度条绘制
- [置顶] 【Android】Android开发之常用的loading等待效果实现,仿微博等待动画。两种实现方式详解
- Android 自动旋转提示对话框,可用于提示等待
- Android 自定义View(四)IOS LoadingView
- CSS3组件化之ios版菊花loading
- 针对android&ios yuv旋转、镜像、格式转换、裁剪 算法实现
- 【Android】Android开发之常用的loading等待效果实现,仿微博等待动画。两种实现方式详解
- Android实现加载(loading)图片旋转的三种方式
- IOS系统中网络等待的Loading的实现方法 等待加载
- Android 转菊花控件:loading加载常用
- android 360度图片翻转、旋转动画等待框
- Android ProgressBar ImageLoading 旋转进度值
- android开发步步为营之52:AsyncTask处理过程中自定义旋转的菊花
- Android粘性菊花—-粘性LoadingView你所知道的一切
- 取原图旋转角度(IOS和Android相机拍的照片) 自动旋转
- 【Android自定义View实战】之自定义项目通用的加载等待对话框LoadingDialog