Android 动画详解（一）之Animation

“基本功不扎实，功力永远无法登峰造极”
又是一个学习的好时间，这次和大家一起学习但是Android开发中经常用到的动画。首先，我先介绍一下在Android开发中，经常会有各种各样的动态效果开发需要用到Android中的动画实现。所以，早在Android3.0系统之前，Android给我们提供了逐帧动画Frame Animation和补间动画Tween Animation两种动画：

逐帧动画：
逐帧动画的原理很简单，就是将一个完整的动画拆分成一张张单独的图片，然后将它们连贯起来进行播放；

当点击的时候，多个图片的切换，相当于GIF图一贞贞的播放，Android的ImageView是不支持GIF的播放的。
在这里使用的是xml的实现方式。

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false"
    >
    <item
        android:drawable="@mipmap/red_wars1"
        android:duration="50"/>
    <item
        android:drawable="@mipmap/red_wars2"
        android:duration="50"/>
  ……….
    <item
        android:drawable="@mipmap/red_wars17"
        android:duration="50"/>
</animation-list>

java 代码中的设置:

    private ImageView animationimg;
    private AnimationDrawable animationDrawable;
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.animation_layout);
        initView();
    }

    private void initView() {
        animationimg = findViewById(R.id.animation_img);
        animationDrawable = (AnimationDrawable) animationimg.getDrawable();
        //start()方法开始动画的播放
        //stop()方法停止播放
        animationDrawable.start();
    }

这样就可以实现一个简单帧动画。

有静态实现，当然也有动态方式:

        frameAnim =new AnimationDrawable();
        // 为AnimationDrawable添加动画帧
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img0), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img1), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img2), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img3), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img4), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img5), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img6), 50);
        frameAnim.addFrame(getResources().getDrawable(R.drawable.img7), 50);

        // 设置为循环播放
        frameAnim.setOneShot(false);

        // 设置ImageView的背景为AnimationDrawable
        iv_frame.setBackgroundDrawable(frameAnim);

当然，为了代码的美观和简洁，动态方式不推荐。

补间动画：
补间动画是专门为View提供的动画，可以实现View的透明度、缩放、平移和旋转四种效果。

如图所示，有四种效果，同样是静态方式
首先是透明度的alpha_anim：

<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromAlpha="1.0"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:toAlpha="0.0" />

缩放的scale_anim:

<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXScale="0.0"
    android:fromYScale="0.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="1.0"
    android:toYScale="1.0"/>

平移的translate_anim:

<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0"
    android:toXDelta="860"
    android:fromYDelta="0"
    android:toYDelta="0"
    android:fillAfter="true"
    android:repeatMode="reverse"
    android:repeatCount="1"
    android:duration="2000"/>

旋转的rotate_anim:

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:fromDegrees="0"
    android:toDegrees="720"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="2000"/>

java代码中的使用：

//按钮的实例化和点击事件的添加就不说了
    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.alpha_animation:
                Animation alphaanimation = AnimationUtils.loadAnimation(this, R.anim.alpha_anim);
                animationimg.startAnimation(alphaanimation);
                break;
            case R.id.scale_animation:
                Animation scaleanimation = AnimationUtils.loadAnimation(this, R.anim.scale_anim);
                animationimg.startAnimation(scaleanimation);
                break;
            case R.id.translate_animation:
                Animation translateanimation = AnimationUtils.loadAnimation(this, R.anim.translate_anim);
                animationimg.startAnimation(translateanimation);
                break;
            case R.id.rotate_animation:
                Animation rotateanimation = AnimationUtils.loadAnimation(this, R.anim.rotate_anim);
                animationimg.startAnimation(rotateanimation);
                break;

        }
    }

ok,搞定。
听到大兄弟的呼声，动态的方式来了：
上我的Java代码:

    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.frame_animation:
                animationDrawable = (AnimationDrawable) animationimg.getDrawable();
                animationDrawable.start();
                break;
            case R.id.alpha_animation:
                AnimationSet alphaanimationSet = new AnimationSet(true);
                //创建一个AlphaAnimation对象，参数从完全的透明度，到完全的不透明
                AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
                //设置动画执行的时间
                alphaAnimation.setDuration(500);
                //将alphaAnimation对象添加到AnimationSet当中
                alphaanimationSet.addAnimation(alphaAnimation);
                //使用ImageView的startAnimation方法执行动画
                animationimg.startAnimation(alphaanimationSet);
                break;
            case R.id.scale_animation:
             AnimationSet scaleanimationSet = new AnimationSet(true);
                //参数1：x轴的初始值
                //参数2：x轴收缩后的值
                //参数3：y轴的初始值
                //参数4：y轴收缩后的值
                //参数5：确定x轴坐标的类型
                //参数6：x轴的值，0.5f表明是以自身这个控件的一半长度为x轴
                //参数7：确定y轴坐标的类型
                //参数8：y轴的值，0.5f表明是以自身这个控件的一半长度为x轴
                ScaleAnimation scaleAnimation = new ScaleAnimation(
                        0, 0.1f,0,0.1f,
                        Animation.RELATIVE_TO_SELF,0.5f,
                        Animation.RELATIVE_TO_SELF,0.5f);
                scaleAnimation.setDuration(1000);
                scaleanimationSet.addAnimation(scaleAnimation);
                animationimg.startAnimation(scaleanimationSet);
                break;
            case R.id.translate_animation:
 AnimationSet translateanimationSet = new AnimationSet(true);
                //参数1～2：x轴的开始位置
                //参数3～4：y轴的开始位置
                //参数5～6：x轴的结束位置
                //参数7～8：x轴的结束位置
                TranslateAnimation translateAnimation = new TranslateAnimation(
                                Animation.RELATIVE_TO_SELF,0f,
                                Animation.RELATIVE_TO_SELF,0.5f,
                                Animation.RELATIVE_TO_SELF,0f,
                                Animation.RELATIVE_TO_SELF,0.5f);
                translateAnimation.setDuration(1000);
                translateanimationSet.addAnimation(translateAnimation);
                animationimg.startAnimation(translateanimationSet);
                break;
            case R.id.rotate_animation:
AnimationSet rotateanimationSet = new AnimationSet(true);
                //参数1：从哪个旋转角度开始
                //参数2：转到什么角度
                //后4个参数用于设置围绕着旋转的圆的圆心在哪里
                //参数3：确定x轴坐标的类型，有ABSOLUT绝对坐标、RELATIVE_TO_SELF相对于自身坐标、RELATIVE_TO_PARENT相对于父控件的坐标
                //参数4：x轴的值，0.5f表明是以自身这个控件的一半长度为x轴
                //参数5：确定y轴坐标的类型
                //参数6：y轴的值，0.5f表明是以自身这个控件的一半长度为x轴
                RotateAnimation rotateAnimation = new RotateAnimation(0, 360,
                        Animation.RELATIVE_TO_SELF,0.5f,
                        Animation.RELATIVE_TO_SELF,0.5f);
                rotateAnimation.setDuration(1000);
                rotateanimationSet.addAnimation(rotateAnimation);
                animationimg.startAnimation(rotateanimationSet);
                break;

        }
    }

大家可以试一试，当然，这些效果，也不是只能这样使用，也可以两个三个嵌套在一起，从而实现更好的效果。

其实对于补间动画，我也不喜欢xml实现，除非有复用的话。

本期的Android 动画详解（一）之animation先到这里，如果还觉得不够，就来看看animation相对高级的使用吧Android 动画详解（二）之animation组合使用