Android Animations知识点

转载：

http://www.cnblogs.com/qiengo/archive/2012/05/03/2480386.html#Animations

篇幅有点长，但是读起来还是通俗易懂，比较顺畅，并且有实用价值，所以转载，感谢分享！

一直以来，看各种各样的apk，大家在布局方面是千差万别，总体两大类：一、喜欢用代码来实现，这种的话，方便调试。

二、xml来实现，这种脉络清晰，方面阅读，如果布局的层次感很强的话，修改起来也非常方便。

总的来说，我还是喜欢第二种方式。

 Animations

一、Animations介绍

Animations是一个实现android UI界面动画效果的API，Animations提供了一系列的动画效果，可以进行旋转、缩放、淡入淡出等，这些效果可以应用在绝大多数的控件中。 

二、Animations的分类

Animations从总体上可以分为两大类：

1.Tweened Animations：该类Animations提供了旋转、移动、伸展和淡出等效果。Alpha——淡入淡出，Scale——缩放效果，Rotate——旋转，Translate——移动效果。

2.Frame-by-frame Animations：这一类Animations可以创建一个Drawable序列，这些Drawable可以按照指定的时间间歇一个一个的显示。

 

三、Animations的使用方法（代码中使用）

Animations extends Object implements Cloneable 

 使用TweenedAnimations的步骤：

1.创建一个AnimationSet对象（Animation子类）；

2.增加需要创建相应的Animation对象；

3.更加项目的需求，为Animation对象设置相应的数据；

4.将Animatin对象添加到AnimationSet对象当中；

5.使用控件对象开始执行AnimationSet。

　　Tweened Animations的分类
　　１、Alpha：淡入淡出效果
　　２、Scale：缩放效果
　　３、Rotate：旋转效果
　　４、Translate：移动效果

 

Animation的四个子类：
　　AlphaAnimation、TranslateAnimation、ScaleAnimation、RotateAnimation

四、具体实现

1、main.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >     <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:orientation="horizontal" >         <Button            android:id="@+id/rotateButton"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="旋转" />         <Button            android:id="@+id/scaleButton"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="缩放" />         <Button            android:id="@+id/alphaButton"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="淡入淡出" />         <Button            android:id="@+id/translateButton"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:text="移动" />    </LinearLayout>     <LinearLayout        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:orientation="vertical" >         <ImageView            android:id="@+id/image"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerInParent="true"            android:src="@drawable/an" />    </LinearLayout> </LinearLayout>

2、.java文件

importandroid.app.Activity;importandroid.os.Bundle;importandroid.view.View;importandroid.view.View.OnClickListener;import android.view.animation.AlphaAnimation;import android.view.animation.Animation;importandroid.view.animation.AnimationSet;importandroid.view.animation.RotateAnimation;importandroid.view.animation.ScaleAnimation;import android.view.animation.TranslateAnimation;importandroid.widget.Button;importandroid.widget.ImageView;public class Animation1Activity extends Activity {    private Button rotateButton = null;    private Button scaleButton = null;    private Button alphaButton = null;    private Button translateButton = null;    private ImageView image = null;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);               rotateButton = (Button)findViewById(R.id.rotateButton);        scaleButton = (Button)findViewById(R.id.scaleButton);        alphaButton = (Button)findViewById(R.id.alphaButton);        translateButton = (Button)findViewById(R.id.translateButton);        image = (ImageView)findViewById(R.id.image);             rotateButton.setOnClickListener(newRotateButtonListener());        scaleButton.setOnClickListener(newScaleButtonListener());        alphaButton.setOnClickListener(newAlphaButtonListener());        translateButton.setOnClickListener(           new TranslateButtonListener());    }    class AlphaButtonListener implementsOnClickListener{       public void onClick(View v) {           //创建一个AnimationSet对象，参数为Boolean型，           //true表示使用Animation的interpolator，false则是使用自己的           AnimationSet animationSet = new AnimationSet(true);           //创建一个AlphaAnimation对象，参数从完全的透明度，到完全的不透明           AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);           //设置动画执行的时间           alphaAnimation.setDuration(500);           //将alphaAnimation对象添加到AnimationSet当中           animationSet.addAnimation(alphaAnimation);           //使用ImageView的startAnimation方法执行动画           image.startAnimation(animationSet);       }    }    class RotateButtonListener implementsOnClickListener{       public void onClick(View v) {           AnimationSet animationSet = 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);           animationSet.addAnimation(rotateAnimation);           image.startAnimation(animationSet);       }    }    class ScaleButtonListener implementsOnClickListener{       public void onClick(View v) {           AnimationSet animationSet = 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);           animationSet.addAnimation(scaleAnimation);           image.startAnimation(animationSet);       }    }    class TranslateButtonListener implementsOnClickListener{       public void onClick(View v) {           AnimationSet animationSet = 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);           animationSet.addAnimation(translateAnimation);           image.startAnimation(animationSet);       }    }}

Tween Animations的通用方法

　　１、setDuration(long durationMills)
　　设置动画持续时间（单位：毫秒）
　　２、setFillAfter(Boolean fillAfter)
　　如果fillAfter的值为true,则动画执行后，控件将停留在执行结束的状态
　　３、setFillBefore(Boolean fillBefore)
　　如果fillBefore的值为true，则动画执行后，控件将回到动画执行之前的状态
　　４、setStartOffSet(long startOffSet)
　　设置动画执行之前的等待时间
　　５、setRepeatCount(int repeatCount)
　　设置动画重复执行的次数

 

在代码中使用Animations可以很方便的调试、运行，但是代码的可重用性差，重复代码多。同样可以在xml文件中配置Animations，这样做可维护性变高了，只不过不容易进行调试。

一、在xml中使用Animations步骤

       1.在res文件夹下建立一个anim文件夹；

       2.创建xml文件，并首先加入set标签，更改标签如下：

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

3.在该标签当中加入rotate，alpha，scale或者translate标签；

<alpha        android:fromAlpha="1.0"        android:toAlpha="0.0"        android:startOffset="500"        android:duration="500"/>

4.在代码当中使用AnimationUtils当中装载xml文件，并生成Animation对象。因为Animation是AnimationSet的子类，所以向上转型，用Animation对象接收。

Animation animation = AnimationUtils.loadAnimation(                  Animation1Activity.this, R.anim.alpha);           // 启动动画           image.startAnimation(animation);

二、具体实现

 1、  alpha.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/accelerate_interpolator">    <!-- fromAlpha和toAlpha是起始透明度和结束时透明度 -->    <alpha        android:fromAlpha="1.0"        android:toAlpha="0.0"        android:startOffset="500"        android:duration="500"/></set>

2、  rotate.xml

 

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/accelerate_interpolator">    <!--        fromDegrees:开始的角度        toDegrees：结束的角度，+表示是正的        pivotX：用于设置旋转时的x轴坐标        例           1)当值为"50"，表示使用绝对位置定位           2)当值为"50%"，表示使用相对于控件本身定位           3)当值为"50%p"，表示使用相对于控件的父控件定位        pivotY：用于设置旋转时的y轴坐标      -->    <rotate        android:fromDegrees="0"        android:toDegrees="+360"        android:pivotX="50%"        android:pivotY="50%"        android:duration="1000"/></set>

3、  scale.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/accelerate_interpolator">   <!--       起始x轴坐标           止x轴坐标           始y轴坐标           止y轴坐标           轴的坐标           轴的坐标     -->   <scale       android:fromXScale="1.0"       android:toXScale="0.0"       android:fromYScale="1.0"       android:toYScale="0.0"       android:pivotX="50%"       android:pivotY="50%"       android:duration="1000"/></set>

4、  translate.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/accelerate_interpolator">    <!--           始x轴坐标           止x轴坐标           始y轴坐标           止y轴坐标      -->    <translate        android:fromXDelta="0%"        android:toXDelta="100%"        android:fromYDelta="0%"        android:toYDelta="100%"        android:duration="2000"/></set>

5、  .java文件

importandroid.app.Activity;importandroid.os.Bundle;importandroid.view.View;importandroid.view.View.OnClickListener;import android.view.animation.Animation;importandroid.view.animation.AnimationUtils;import android.widget.Button;import android.widget.ImageView; public class Animation1Activity extends Activity {    private Button rotateButton = null;    private Button scaleButton = null;    private Button alphaButton = null;    private Button translateButton = null;    private ImageView image = null;     @Override    public void onCreate(Bundle savedInstanceState) {       super.onCreate(savedInstanceState);       setContentView(R.layout.main);        rotateButton = (Button) findViewById(R.id.rotateButton);       scaleButton = (Button) findViewById(R.id.scaleButton);       alphaButton = (Button) findViewById(R.id.alphaButton);       translateButton = (Button) findViewById(R.id.translateButton);       image = (ImageView) findViewById(R.id.image);        rotateButton.setOnClickListener(newRotateButtonListener());       scaleButton.setOnClickListener(newScaleButtonListener());       alphaButton.setOnClickListener(newAlphaButtonListener());       translateButton.setOnClickListener(newTranslateButtonListener());    }     class AlphaButtonListener implementsOnClickListener {       public void onClick(View v) {           // 使用AnimationUtils装载动画配置文件           Animation animation = AnimationUtils.loadAnimation(                  Animation1Activity.this, R.anim.alpha);           // 启动动画           image.startAnimation(animation);       }    }     class RotateButtonListener implementsOnClickListener {       public void onClick(View v) {           Animation animation = AnimationUtils.loadAnimation(                  Animation1Activity.this, R.anim.rotate);           image.startAnimation(animation);       }    }     class ScaleButtonListener implementsOnClickListener {       public void onClick(View v) {           Animation animation = AnimationUtils.loadAnimation(                  Animation1Activity.this, R.anim.scale);           image.startAnimation(animation);       }    }     class TranslateButtonListener implementsOnClickListener {       public void onClick(View v) {           Animation animation = AnimationUtils.loadAnimation(Animation1Activity.this, R.anim.translate);           image.startAnimation(animation);       }    }}

AnimationSet的具体使用方法

 

       1.AnimationSet是Animation的子类；

 

       2.一个AnimationSet包含了一系列的Animation；

 

       3.针对AnimationSet设置一些Animation的常见属性（如startOffset，duration等），可以被包含在AnimationSet当中的Animation集成；

 

例：一个AnimationSet中有两个Animation，效果叠加

 

第一种方法：

 

doubleani.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/accelerate_interpolator"    android:shareInterpolator="true">    <!-- fromAlpha和toAlpha是起始透明度和结束时透明度 -->    <alpha        android:fromAlpha="1.0"        android:toAlpha="0.0"        android:startOffset="500"        android:duration="500"/>    <translate        android:fromXDelta="0%"        android:toXDelta="100%"        android:fromYDelta="0%"        android:toYDelta="100%"        android:duration="2000"/></set>

.java文件中

class DoubleButtonListener implements OnClickListener {       public void onClick(View v) {           // 使用AnimationUtils装载动画配置文件           Animation animation = AnimationUtils.loadAnimation(                  Animation2Activity.this, R.anim.doubleani);           // 启动动画           image.startAnimation(animation);       }    }

第二种方法：

class DoubleButtonListener implements OnClickListener {       public void onClick(View v) {           AnimationSet animationSet = new AnimationSet(true);           AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);           RotateAnimation rotateAnimation = new RotateAnimation(0, 360,                  Animation.RELATIVE_TO_SELF,0.5f,                  Animation.RELATIVE_TO_SELF,0.5f);           rotateAnimation.setDuration(1000);           animationSet.addAnimation(rotateAnimation);           animationSet.addAnimation(alphaAnimation);           image.startAnimation(animationSet);       }    }

Interpolator的具体使用方法

 

       Interpolator定义了动画变化的速率，在Animations框架当中定义了一下几种Interpolator

Ø         AccelerateDecelerateInterpolator：在动画开始与结束的地方速率改变比较慢，在中间的时候速率快。

Ø         AccelerateInterpolator：在动画开始的地方速率改变比较慢，然后开始加速

Ø         CycleInterpolator：动画循环播放特定的次数，速率改变沿着正弦曲线

Ø         DecelerateInterpolator：在动画开始的地方速率改变比较慢，然后开始减速

Ø         LinearInterpolator：动画以均匀的速率改变

分为以下几种情况：

1、在set标签中

<set xmlns:android="http://schemas.android.com/apk/res/android"    android:interpolator="@android:anim/accelerate_interpolator"/>

2、如果在一个set标签中包含多个动画效果，如果想让这些动画效果共享一个Interpolator。

  android:shareInterpolator="true"

3、如果不想共享一个interpolator，则设置android:shareInterpolator="true"，并且需要在每一个动画效果处添加interpolator。

<alpha        android:interpolator="@android:anim/accelerate_decelerate_interpolator"        android:fromAlpha="1.0"        android:toAlpha="0.0"        android:startOffset="500"        android:duration="500"/>

4、如果是在代码上设置共享一个interpolator，则可以在AnimationSet设置interpolator。

AnimationSet animationSet = new AnimationSet(true);animationSet.setInterpolator(new AccelerateInterpolator());

<p style="color: rgb(51, 51, 51); font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height: 21px; margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px; background-color: rgb(254, 254, 242);"> </p><p style="margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px;"><span lang="EN-US" style="color: rgb(51, 51, 51); font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; line-height: 21px; background-color: rgb(254, 254, 242); margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">5</span><span style="color: rgb(51, 51, 51); font-family: 宋体; font-size: 13px; line-height: 21px; background-color: rgb(254, 254, 242); margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">、</span><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">如</span><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">果不设置共享一个</span><span lang="EN-US" style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">interpolator</span><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">则可以在每一个</span><span lang="EN-US" style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">Animation</span><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">对象上面设置</span><span lang="EN-US" style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">interpolator</span><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;">。</span></p><p style="margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px;"><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;"></span></p><p style="margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px;"><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;"></span></p><p style="margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px;"><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;"></span></p><p style="margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px;"><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;"></span></p><p style="margin-top: 0px; margin-bottom: 5px; padding-top: 0px; padding-bottom: 0px; list-style-type: none; word-wrap: normal; word-break: normal; border-width: 0px;"><span style="margin: 0px; padding: 0px; word-wrap: normal; word-break: normal;"></span></p>