Android动画（一）之补间动画（Tween Animation）

一直都很喜欢 github 哪些看起来很炫酷的控件，其实主要就是动画效果看起来很棒，以前老以为动画很难，总是找现成的来用，但是其实原理很简单，抽空学习了下，在这里做一下记录。

Android 的动画分三种，补间动画（Tween Animation）、帧动画（Drawable Animation）、属性动画（Property Animation），有的面试题会问到 Android 动画分几种，有的答案是两种，但是其实是三种，属性动画在 API 11 的时候就诞生了，而且功能强大，所以属性动画是重点，前两种基本没什么难度。

补间动画是对View的内容进行一系列的图形变换（包括渐变、旋转、缩放、位移）来实现动画效果，通过Java代码或者xml代码实现。

随便找了个篮球图片，写一个渐变动画的xml文件（注意这个文件要放在 res/anim  目录下）：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:startOffset="500">
    <!-- 补间动画 Tween Animation 之渐变动画 -->

    <!-- duration 动画持续多少毫秒 -->
    <!-- startOffset 多少毫秒后开始运行动画 -->
    <!-- fromAlpha 动画开始时的透明度 -->
    <!-- toAlpha 动画结束时的透明度 -->
    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />

</set>

在客户端通过下面代码即可调用：

                Animation mAnimation = AnimationUtils.loadAnimation(this, R.anim.alpha);
                ivBasketball.startAnimation(mAnimation);

效果如下：

可以看到补间动画非常简单，就不多说，直接记录下其他效果：

旋转动画：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000">
    <!-- 补间动画 Tween Animation 之旋转动画 -->

    <!-- fromDegrees 旋转开始时的角度 -->
    <!-- pivotX 旋转时X轴中心坐标 -->
    <!-- pivotY 旋转时Y轴中心坐标 -->
    <!-- toDegrees 旋转结束时角度 -->
    <rotate
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="360" />
</set>

缩放动画：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000">
    <!-- 补间动画 Tween Animation 之缩放动画 -->

    <!-- fromXScale 缩放开始时X轴的坐标 -->
    <!-- fromYScale 缩放开始时Y轴的坐标 -->
    <!-- pivotX 缩放时X轴中心 -->
    <!-- pivotY 缩放时Y轴中心 -->
    <!-- toXScale 缩放结束时X轴的坐标 -->
    <!-- toYScale 缩放结束时Y轴的坐标 -->
    <scale
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.0"
        android:toYScale="0.0" />
</set>

位移动画：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000">
    <!-- 补间动画 Tween Animation 之位移动画 -->

    <!-- fromXDelta 位移开始时X轴坐标-->
    <!-- fromYDelta 位移开始时Y轴坐标-->
    <!-- toXDelta 位移结束时X轴坐标-->
    <!-- toYDelta 位移结束时Y轴坐标-->
    <translate
        android:fromXDelta="0%"
        android:fromYDelta="0%"
        android:toXDelta="100%"
        android:toYDelta="100%" />
</set>

这三个动画的效果如下：

上面说了补间动画可以通过xml代码实现也可以通过Java代码实现，就以渐变动画为例记录下，其余三个同理：

                AlphaAnimation mAlphaAnimation = new AlphaAnimation(1.0f, 0.0f);
                mAlphaAnimation.setDuration(1000);
                ivBasketball.startAnimation(mAlphaAnimation);

只是把xml中的属性改用Java代码实现了而已。

补间动画只能实现一些基本的动画效果，而且局限性很大，比如你看着这个View移动到其他位置了，但它其实还在原来的位置，你看着它变大变小了，它其实还是原来那么大，所以它只是视觉效果上变了，自身属性没有变，这就是属性动画出现的原因，后面再记录属性动画的用法。