Android 逐帧(Frame)动画

来源：互联网发布：数控车凹圆弧编程实例编辑：程序博客网时间：2024/05/16 17:39

逐帧(Frame)动画

在安卓中有属性（Property ）动画,补间（Tween）动画和逐帧（Frame）动画,其中的逐帧动画是较容易理解的，就像我们看电影一样，利用了人眼的视觉暂留，逐帧动画实际上是一张张的图片依次放映。

我们将动画中需要放映的一张图片称作一帧，定义逐帧动画很简单，动画一般都在xml文件里面定义，这个也不例外，只需要将每一帧包含在一个<item>元素里面，然后将一个动画内的所有帧用<animation-list>元素囊括起来，就完成了定义。大致的格式如下：

<?xml version="1.0" encoding="utf-8" ?><animation-list xmlns:android="http://schemas.android.com/apk/res/android"    android:oneshot="true" >    <item android:drawable="@mipmap/explosion_1" android:duration="80" />    <item android:drawable="@mipmap/explosion_2" android:duration="80" />    <item android:drawable="@mipmap/explosion_3" android:duration="80" />    <item android:drawable="@mipmap/explosion_4" android:duration="80" />    <item android:drawable="@mipmap/explosion_5" android:duration="80" />    <item android:drawable="@mipmap/explosion_6" android:duration="80" />    <item android:drawable="@mipmap/explosion_7" android:duration="80" />    <item android:drawable="@mipmap/explosion_8" android:duration="80" /></animation-list>

可以看得很清楚，这个帧动画中包含着8张图片，每张图片的放映时间为80ms，在<animation-list>中有一个onshot属性，如果设置为true则只放映一遍，如果是false则该动画会循环播放。

下面结合一个小实例来看看如何使用定义了的动画。动画也就是上面的8张图片，是一个爆炸的动画，手指在屏幕上点击后，在点击处播放爆炸的动画。

public class MainActivity extends Activity {    /**     * 动画播放的位置     */    private float ex;    private float ey;    /**     * 自定义的View     */    private MyView myView;    /**     * animationDrawable对象     */    private AnimationDrawable anim;    /**     * 播放声音的类     */    private MediaPlayer bomb;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        /**         * 这个demo没有用xml定义布局         * Framelayout中的控件可以通过setFrame来控制自己的位置         */        FrameLayout frameLayout = new FrameLayout(this);        setContentView(frameLayout);        frameLayout.setBackgroundColor(Color.BLACK);        /**         * 预备声音文件         */        bomb = MediaPlayer.create(this, R.raw.sound);        myView = new MyView(this);        myView.setVisibility(View.GONE);        /**         * 从这里开始使用了前面定义的动画         * 利用setBackgroundResource函数将动画设为View的背景         * 设置之后只会将该动画的第一帧作为背景         * 不会直接播放动画         *         * 如果是在xml布局文件中直接设置，就会直接触发动画         */        myView.setBackgroundResource(R.drawable.explosion);        /**         * 将动画的实例取出         * 在需要开始播放动画的地方调用anim.start()即可         */        anim = (AnimationDrawable)myView.getBackground();        FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(66,66);        frameLayout.addView(myView,layoutParams);        /**         * 给整个layout添加一个触摸监听器         * 在手指点击后，捕捉到x,y坐标，传给view         * 再定位view在整个屏幕上的位置         * 调用anim.start()和bomb.start()播放动画和声音         */        frameLayout.setOnTouchListener(new View.OnTouchListener() {            @Override            public boolean onTouch(View source, MotionEvent event) {                if (event.getAction() == MotionEvent.ACTION_DOWN) {                    anim.stop();                    ex = event.getX();                    ey = event.getY();                    myView.setLocation((int) ey - 40, (int) ex - 20);                    myView.setVisibility(View.VISIBLE);                    anim.start();                    bomb.start();                }                return false;            }        });    }    class MyView extends ImageView {        public MyView(Context context) {            super(context);        }        public void setLocation(int top, int left) {            this.setFrame(left,top,left + 66, top + 66);        }        @Override        protected void onDraw(Canvas canvas) {            try {                /**                 * 下面几行代码是在view不停的绘制时                 * 获取到正在绘制的是第几帧                 * 如果是最后一帧，则绘制完成后将view隐藏                 */                Field field = AnimationDrawable.class.getDeclaredField("mCurFrame");                field.setAccessible(true);                int curFrame = field.getInt(anim);                if(curFrame == anim.getNumberOfFrames() - 1) {                    setVisibility(GONE);                }            }            catch(Exception e) {                e.printStackTrace();            }            super.onDraw(canvas);        }    }}

最后上传一张效果图，基本上就是这个样子的。

0 0