安卓补间动画的详解

     夜深人静了，也许对大多数的程序员来说也只有在这个时候才是思维最活跃的时候吧，一杯咖啡一根烟，机械键盘放手边，程序员的标配。废话不多说，接着上篇写，下面来详细的介绍安卓的补间动画，让自己也让大家有个更加清楚地认识补间动画。

   上篇已经介绍过补间动画分4中： 1 alpha：透明度的变化；

                                                               2 scale：控件尺寸缩放的变化（大小的改变）；

                                                               3  translate：平移变化（位置的改变）；

                                                               4 rotate： 旋转的变化（角度的改变）；

    四中动画的相关属性值以及用法差不多都是一样的，我拿其中的一种来具体的说明一下，那我们就拿缩放动画来说明吧，因为缩放动画里面的属性值最多：

    大家先看下GIF的缩放的效果：

  

大家有没有想多看几眼？先看下xml中的代码：

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.5"
    android:fromYScale="0.0"
    android:toYScale="1.5"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="500" 
    android:fillBefore="true"
    android:repeatCount="1"
    android:repeatMode="restart"
/>

下面一一给大家介绍属性值的意思：

    fromXScale 浮点型值，属性为动画起始时 X坐标上的伸缩尺寸；

    toXScale 浮点型值，  属性为动画结束时 X坐标上的伸缩尺寸    ;

    fromYScale 浮点型值，属性为动画起始时Y坐标上的伸缩尺寸  ; 

    toYScale  浮点型值， 属性为动画结束时Y坐标上的伸缩尺寸   ;

    pivotX  缩放起点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p，当为数值时，表示在当前View的左上角，即原点处加上50px，做为起始缩放点；如果是50%，表示在当前控件的左上角加上自己宽度的50%做为起始点；如果是50%p，那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标；

    pivotY 缩放起点Y轴坐标，取值及意义跟android:pivotX一样；

    duration  毫秒值，动画执行的时间；

    fillBefore 如果设置为true,控件动画结束时，还原到开始动画前的状态；

   当然还对应一个属性 fillAfter 如果设置为true，控件动画结束时，将保持动画最后时的状态；

   repeatCount  动画执行的次数；

 （属性值很多，由于时间原因就不一个个改变给大家看效果了）

  repeatMode 重复类型，有reverse和restart两个值，reverse表示倒序回放，restart表示重新放一遍，必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型，即回放时的动作；

   还有最后一个属性就是插值器interpolator  设定插值器，其实就是指定的动作效果，比如弹跳效果,加速减速效果等，这个没什么好讲的大家只需要记住有哪几种可以用就ok了主要是给执行的动画锦上添花；给大家看一种插值器的效果：

         

是不是有一种弹动的效果？

代码具体的变化如下：

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.4"
    android:fromYScale="0.0"
    android:toYScale="1.4"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="700" 
    android:fillBefore="true"
    android:repeatCount="1"
    android:repeatMode="restart"
    android:interpolator="@android:anim/bounce_interpolator"
/>

  和上面的代码相比较只是多了最后一行，其实插值器还有很多种，具体的就不细讲大家自己研究。

  说了这么多还没告诉大家，具体怎么用，不要急。

  1 现在你工程的res文件夹下建一个anim文件夹，然后在这个文件下写你的xml动画。

 

   2 看MAinActivity中如何使用：

public class MainActivity extends Activity {

	Button scaleBtn	;
	Animation scaleAnimation;
	
	ImageView iv_animation;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scaleanim);
		scaleBtn = (Button)findViewById(R.id.btn_animation);
		iv_animation =(ImageView)findViewById(R.id.iv_animation);
		
		scaleBtn.setOnClickListener(new View.OnClickListener() {
			
			@Override
			public void onClick(View v) {
				iv_animation.startAnimation(scaleAnimation);
			}
		});
		
	}

}

  其实就两句关键的代码：

 1 找到资源 scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scaleanim);
 2 使用资源 iv_animation.startAnimation(scaleAnimation);

 看到这大家是不是觉得非常的简单，其实别的平移 旋转 透明度的使用和这个是大同小异的，我就不一一举例了，大家没事的时候可以自己随便写着玩玩，当你自己写过一遍的时候你的印象就会更加的深刻了。

  前面我说过万丈高楼平地起，大家都觉得这动画很简单是吧？那么我们就用一个简单的动画来实现炫酷的功能吧！

 下面是我们项目中用到的加入购物车的一个小动画，ui设计不是很好看在加上模拟器录制比较卡大家不要介意，只看动画效果就可以了：

给大家看一下实现的代码：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <set>
        <scale
            android:duration="300"
            android:fromXScale="1.0"
            android:fromYScale="1.0"
            android:pivotX="50.0%"
            android:pivotY="50.0%"
            android:toXScale="1.4"
            android:toYScale="1.4" />
        <scale
            android:duration="300"
            android:fromXScale="1.4"
            android:fromYScale="1.4"
            android:pivotX="50.0%"
            android:pivotY="50.0%"
            android:startOffset="300"
            android:toXScale="1.0"
            android:toYScale="1.0" />
    </set>
    <set>
        <translate
            android:duration="700"
            android:fromXDelta="0.0"
            android:fromYDelta="0.0"
            android:startOffset="600"
            android:toXDelta="75.0%p"
            android:toYDelta="-110%p" />

        <alpha
            android:duration="700"
            android:fromAlpha="1.0"
            android:startOffset="600"
            android:toAlpha="0.1" />

        <scale
            android:duration="700"
            android:fromXScale="1.0"
            android:fromYScale="1.0"
            android:pivotX="50.0%"
            android:pivotY="50.0%"
            android:startOffset="600"
            android:toXScale="0.4"
            android:toYScale="0.4" />
    </set>

</set>

  这个动画的实现是一套简单的补间动画的组合，当你刚看到动画的时候也许你还要几分钟的时间来想一想改怎么实现，当你看到源代码的时候，你就会想，妈的，这不是我天天用的东西吗？的确是你天天用的东西，但是你在用的时候要知其然也要知其所以然，那样你才能闲庭信步，信手拈来。

 当然关于补间动画还有很多的知识以及用法，也有很多炫酷的效果，比如常见的扇形展开啊都可以用补间动画实现的，这就需要大家去慢慢研究了，当然补间动画有一定的缺陷的，我前篇也介绍过，因为控件的实际位置并未发生改变，你不好去捕捉控件的点击事件的。我们项目之所以用的补间动画来实现加入购物车的效果，是因为我们不需要点击事件，所以这个大家自己去分情况弄清楚。

  好了，今天的博客就到这，下一篇会介绍下属性动画 。仅自勉，不喜勿喷！