Android开发笔记（十四）圆弧进度动画CircleAnimation

一个好看的APP，都有不少精致的动画效果。熟练运用各种动画技术，可让我们的APP灼灼生辉。Android在技术上把动画分为了三类，分别是帧动画FrameAnimation、补间动画TweenAnimation、属性动画，其中补间动画又分做五种：深浅动画AlphaAnimation、平移动画TranslateAnimation、缩放动画ScaleAnimation、旋转动画RotateAnimation、组合动画AnimationSet。网上对这些动画的说明资料有不少，所以博主就不打算介绍它们的基本用法了，还是说说另外的一些常用动画。

首先介绍的是圆弧进度动画，像我们下载文件或者是做其他什么事情，都想知道当前到什么进度了。在Windows下常用来表达的是细长的进度条，但在手机上因为屏幕限制，我们更喜欢展示圆形或弧形的进度圈。所以接下来说的便是这个进度圆圈的动画，同时也正好与上一节自定义视图的绘制方法结合起来，复习复习加深巩固。

绘制圆弧动画，主要思路在一段指定的时间内，持续间隔地绘制一个扇形或圆弧，如同放电影的原理那样，每秒连续播放二三十张图片，连起来整个画面就动了。
其次还要进行一些参数的设置，如设置该圆圈的位置、开始和结束的角度，以及转动的速率等等，还有画笔的颜色、粗细、样式等等。
另外为了区分处理背景和动画，我们还要处理背景视图（用于衬托动画）、前景视图（用于展示动画）。
剩下的就是在绘制的时候做好每帧之间的延迟时间，重绘视图可用invalidate和postInvalidate方法，延迟可用Thread.sleep和Handler.postDelayed方法。

实现代码不难，直接贴出来了

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Paint.Style;
import android.os.Handler;
import android.util.Log;
import android.view.View;
import android.widget.RelativeLayout;public class CicleAnimation extends RelativeLayout {private final static String TAG = "CicleAnimation";private RectF mRect = new RectF(10, 10, 160, 160);private int mBeginAngle = 0;private int mEndAngle = 270;private int mFrontColor = 0xff00ff00;private float mFrontLine = 5;private Style mFrontStyle = Style.STROKE;private int mShadeColor = 0xffeeeeee;private float mShadeLine = 5;private Style mShadeStyle = Style.STROKE;private ShadeView mShadeView;private FrontView mFrontView;private int mRate = 2;private int mDrawTimes;private int mInterval = 70;private int mFactor;private Context mContext;private int mSeq = 0;private int mDrawingAngle = 0;public CicleAnimation(Context context) {super(context);mContext = context;}public CicleAnimation render() {mShadeView = new ShadeView(mContext);this.addView(mShadeView);mFrontView = new FrontView(mContext);this.addView(mFrontView);refresh();return this;}public void refresh() {mSeq = 0;mDrawingAngle=0;mDrawTimes = mEndAngle/mRate;mFactor = mDrawTimes/mInterval + 1;Log.d(TAG, "mDrawTimes="+mDrawTimes+",mInterval="+mInterval+",mFactor="+mFactor);mFrontView.invalidateView();}public void setRect(int left, int top, int right, int bottom) {mRect = new RectF(left, top, right, bottom);}public void setAngle(int begin_angle, int end_angle) {mBeginAngle = begin_angle;mEndAngle = end_angle;}//speed:每次移动几个度数   frames:每秒移动几帧public void setmRate(int speed, int frames) {mRate = speed;mInterval = 1000/frames;}public void setFront(int color, float line, Style style) {mFrontColor = color;mFrontLine = line;mFrontStyle = style;}public void setShade(int color, float line, Style style) {mShadeColor = color;mShadeLine = line;mShadeStyle = style;}class ShadeView extends View {Paint paint;public ShadeView(Context context) {super(context);paint = new Paint();paint.setAntiAlias(true);paint.setDither(true);paint.setColor(mShadeColor);paint.setStrokeWidth(mShadeLine);paint.setStyle(mShadeStyle);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);canvas.drawArc(mRect, mBeginAngle, 360, false, paint);}}class FrontView extends View {Paint paint;public FrontView(Context context) {super(context);paint = new Paint();paint.setAntiAlias(true);         //设置画笔为无锯齿paint.setDither(true);            //防抖动paint.setColor(mFrontColor);       //设置画笔颜色paint.setStrokeWidth(mFrontLine);  //线宽paint.setStyle(mFrontStyle);       //画笔类型 STROKE空心 FILL 实心//paint.setStrokeJoin(Paint.Join.ROUND); //画笔接洽点类型 如影响矩形直角的外轮廓paint.setStrokeCap(Paint.Cap.ROUND);  画笔笔刷类型 如影响画笔的始末端}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);canvas.drawArc(mRect, mBeginAngle, (float) (mDrawingAngle), false, paint);}public void invalidateView(){handler.postDelayed(drawRunnable, 0);}private Handler handler = new Handler();Runnable drawRunnable = new Runnable() {@Overridepublic void run() {if (mDrawingAngle >= mEndAngle) {mDrawingAngle = mEndAngle;invalidate();//移除当前Runnablehandler.removeCallbacks(drawRunnable);} else {mDrawingAngle = mSeq*mRate;mSeq++;handler.postDelayed(drawRunnable, (long) (mInterval-mSeq/mFactor));invalidate();}}};}}

调用的代码如下

     Button btn_play = (Button) findViewById(R.id.btn_play);btn_play.setOnClickListener(this);LinearLayout ll_layout = (LinearLayout) findViewById(R.id.ll_layout);mCircle = new CicleAnimation(this);ll_layout.addView(mCircle);mCircle.render();

下面是圆弧动画的效果图

点击下载本文用到的圆弧进度动画代码

点此查看Android开发笔记的完整目录

Android开发笔记（十四）圆弧进度动画CircleAnimation相关推荐

Android开发笔记（四十九）异步任务处理AsyncTask
AsyncTask异步任务 Thread+Handler方式虽然能够实现多线程的通信处理,但是写起代码来颇为繁琐,所以Android提供了AsyncTask这样一个轻量级的异步任务类,其内部封装好Th ...
Android开发笔记（四十八）Thread类实现多线程
Thread概述 Thread类是真正的线程,查看源码可见Thread也实现了Runnable接口,但它内部有创建新的工作线程,所以Thread对象运行在与主线程不一样的分线程上. 因为Thread对 ...
Android开发笔记（四十七）Runnable接口实现多线程
Runnable概述 Runnable接口可声明一连串的事务,常用于多线程处理.但是实现Runnable接口并不意味着开启了一个新线程,只是定义了接下来要做的事情,至于说这些事情要在主线程处理,还是在 ...
Android开发笔记（四十三）点击事件
按钮点击常用按钮点击 1.单击事件,主要用于Button和ImageButton控件,布局视图与TextView.ImageView控件用的也比较多.相关类名与方法说明如下: 监听器类名 : Vie ...
Android开发笔记（十七）GIF动画的实现GifAnimation
GIF在Windows上是常见的图片格式,主要用来播放短小的动画.但在手机上由于系统资源紧张,所以Android并没有直接支持GIF格式,如果在ImageView中放入一张gif文件,你会发现显示出来 ...
Android开发笔记（四十四）动态UI事件
常用的几个事件动画事件动画事件主要用于Animation控件,可监控动画开始.结束.重播等行为.相关类名与方法说明如下: 监听器类名 : AnimationListener 设置监听器的方法 : ...
Android开发笔记（四十六）手机相关事件
手机定位有一类事件必须依赖于手机信号方能触发,如果把设备中的sim卡拔出,或者该设备本身不支持sim卡(如ipad),那么这类事件将永远不会被触发.在Android中,这类事件包括定位事件和手机信号 ...
Android开发笔记（四十五）手势事件
手势事件的流程基本手势事件基本的手势事件主要有如下三个方法: dispatchTouchEvent : 判断该事件是否需要下发.返回true表示需要下发给下级视图,返回false表示不需要下发(交 ...
Android开发笔记（四十二）Broadcast的生命周期
Broadcast是什么广播的特性广播(Broadcast)用于Android组件之间的灵活通信,它与Activity和Service的区别在于: 1.Activity和Service都只能一对一 ...

Android开发笔记（十四）圆弧进度动画CircleAnimation

Android开发笔记（十四）圆弧进度动画CircleAnimation相关推荐

最新文章

热门文章