Animation 动画1

Android Animation    

Contents：

• Animations

• Tween Animations

• AnimationSet

• Interpolator

• Frame-By-Frame Animations

• LayoutAnimationsController

• AnimationListener

 

---

 Animations

1、Animations介绍

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

2、Animations的分类

Animations从整体上能够分为两大类：

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

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

 

3、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

4、具体实现

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，这样作可维护性变高了，只不过不容易进行调试。

1、在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);

2、具体实现

 一、  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>

二、  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>

三、  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>

 

四、  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>

 

五、  .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);

       }

    }

}