Android動畫

動畫

幀動畫

直接可以參考這個博客
http://blog.csdn.net/aminfo/article/details/7847761

補間動畫(平移,旋轉,縮放,透明度動畫)

先來個佈局吧

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <Button 
            android:onClick="translate"
            android:layout_weight="1"
             android:layout_width="0dp"
            android:layout_height="wrap_content" 
            android:text="平移"
            />
        <Button 
            android:onClick="rotate"
            android:layout_weight="1"
             android:layout_width="0dp"
            android:layout_height="wrap_content" 
            android:text="旋轉"
            />
        <Button 
            android:onClick="scale"
            android:layout_weight="1"
             android:layout_width="0dp"
            android:layout_height="wrap_content" 
            android:text="縮放"
            />
        <Button 
            android:onClick="alpha"
            android:layout_weight="1"
             android:layout_width="0dp"
            android:layout_height="wrap_content" 
            android:text="透明"
            />
    </LinearLayout>

    <ImageView
        android:id="@+id/iv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:src="@drawable/ic_launcher" />

</RelativeLayout>

1.平移動畫

    public void translate(View v){

    //平移動畫
    /*TranslateAnimation animation = new TranslateAnimation(
                0, 100, //x方向移動
                0, 0); //y方向移動
                */      
/**
/這裏是三種type類型
*Animation.ABSOLUTE : 後面指定的數值，代表的是像素點
*Animation.RELATIVE_TO_SELF ： 後面的數值，代表的是自己的寬度或者高度的倍數
* Animation.RELATIVE_TO_PARENT : 後面的數值，代表的是控件的父元素寬度或者高度的倍數
* */

        TranslateAnimation animation = new TranslateAnimation(
                 Animation.RELATIVE_TO_PARENT, 0,
                 Animation.RELATIVE_TO_PARENT, 0.5f, 
                 Animation.RELATIVE_TO_PARENT, 0, 
                 Animation.RELATIVE_TO_PARENT, 0.5f);
        //指定動畫播放多少時間
        animation.setDuration(2000);

        //設置播放的次數
        animation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        animation.setRepeatMode(Animation.REVERSE);

        //讓控件播放這個動畫
        iv.startAnimation(animation);

    }

2.旋轉動畫

public void rotate(View v){
/**
*  三種Type
*  Animation.ABSOLUTE : 後面指定的數值，代表的是像素點
*  Animation.RELATIVE_TO_SELF ： 後面的數值，代表的是自己的寬度或者高度的倍數
*  Animation.RELATIVE_TO_PARENT : 後面的數值，代表的是控件的父元素寬度或者高度的倍數
* 
*/

        RotateAnimation animation = new RotateAnimation(
                0, 360,  //從什麼角度旋轉到什麼角度
                Animation.RELATIVE_TO_SELF , 0.5f, 
                Animation.RELATIVE_TO_SELF , 0.5f);

        //指定動畫播放多少時間
        animation.setDuration(2000);

        //設置播放的次數
        animation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        animation.setRepeatMode(Animation.REVERSE);

        //讓控件播放這個動畫
        iv.startAnimation(animation);
    }

3.縮放動畫

public void scale(View v){
/**
*Animation.ABSOLUTE : 後面指定的數值，代表的是像素點
*Animation.RELATIVE_TO_SELF ： 後面的數值，代表的是自己的寬 度或者高度的倍數
* Animation.RELATIVE_TO_PARENT : 後面的數值，代表的是控件的父元素寬度或者高度的倍數
* 
*/

        ScaleAnimation animation = new ScaleAnimation(
                1, -1,   //x 方向縮放從什麼倍數到什麼倍數 
                1, 1,  //y方向縮放從什麼倍數到什麼倍數
                Animation.RELATIVE_TO_SELF , 0.5f,  //縮放的中心點
                Animation.RELATIVE_TO_SELF , 0.5f);

        //指定動畫播放多少時間
        animation.setDuration(2000);

        //設置播放的次數
        animation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        animation.setRepeatMode(Animation.REVERSE);

        //讓控件播放這個動畫
        iv.startAnimation(animation);
    }

4.透明度動畫

public void alpha(View v){
/**
* Animation.ABSOLUTE : 後面指定的數值，代表的是像素點
* Animation.RELATIVE_TO_SELF ： 後面的數值，代表的是自己的寬度或者高度的倍數
* Animation.RELATIVE_TO_PARENT : 後面的數值，代表的是控件的父元素寬度或者高度的倍數
* 
*/

        AlphaAnimation animation = new AlphaAnimation(0.2f,1);

        //指定動畫播放多少時間
        animation.setDuration(2000);

        //設置播放的次數
        animation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        animation.setRepeatMode(Animation.REVERSE);

        //讓控件播放這個動畫
        iv.startAnimation(animation);
    }

5.如何通過xml文件去生成動畫(這裏就以平移動畫爲列)

1.在res文件下新建anim文件夾存放動畫xml文件

2.平移動畫代碼,其他都是類似的,這裏就不一一去寫了.

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0" 
    //1.這裏你如果直接寫具體數值,則相當於移動的具體數值像素
    //2.如果寫成 android:toXDelta="-50%",則說明相對於自己X移動自己的一半
    //3.如果寫成   android:toXDelta="-50%p" ,則說明相對於父容器距離的一半
   android:toXDelta="-50%p" 
    android:duration="2000"
    android:repeatCount="infinite"
    android:repeatMode="reverse">


  <!--   
        如果給的是數字： 移動的是絕對值的像素
        如果給的是百分比(100%) 代表的是移動自己的寬度或者高度的倍數 、、
        如果是百分比後面跟上個p  100%p 代表的是移動父元素的寬度或者高度倍數
    -->

</translate>

3.xml文件寫完,那麼我們應該如何讓他在代碼中加載呢?我就直接貼代碼了

public void translate(View v){

        //1. 導入動畫
        Animation anim = AnimationUtils.loadAnimation(this, R.anim.translate_demo);

        //2. 播放動畫
        iv.startAnimation(anim);
    }

6.基本的動畫說完了,那麼我們來說說動畫的集合吧
1.首先你需要把基本的動畫創建出來

AlphaAnimation animation = new AlphaAnimation(0.2f,1);

        //指定動畫播放多少時間
        animation.setDuration(2000);

        //設置播放的次數
        animation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        animation.setRepeatMode(Animation.REVERSE);


        //--------------------------

        ScaleAnimation sanimation = new ScaleAnimation(
                1, 3,   //x 方向縮放從什麼倍數到什麼倍數 
                1, 3,  //y方向縮放從什麼倍數到什麼倍數
                Animation.RELATIVE_TO_SELF , 0.5f,  //縮放的中心點
                Animation.RELATIVE_TO_SELF , 0.5f);

        //指定動畫播放多少時間
        sanimation.setDuration(2000);

        //設置播放的次數
        sanimation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        sanimation.setRepeatMode(Animation.REVERSE);

        //--------------------------

        RotateAnimation ranimation = new RotateAnimation(
                0, 360,  //從什麼角度旋轉到什麼角度
                Animation.RELATIVE_TO_SELF , 0.5f, 
                Animation.RELATIVE_TO_SELF , 0.5f);

        //指定動畫播放多少時間
        ranimation.setDuration(2000);

        //設置播放的次數
        ranimation.setRepeatCount(Animation.INFINITE);

        //設置播放的模式
        ranimation.setRepeatMode(Animation.REVERSE);

2.創建動畫集合

//shareInterpolator 是否共享插入器 ，
//      true , 集合中的子動畫都共用集合的插入器，
//      false ： 代表的是每個子動畫使用自己的插入器
        AnimationSet set = new AnimationSet(false);

        //給集合加入3個動畫
        set.addAnimation(animation);
        set.addAnimation(sanimation);
        set.addAnimation(ranimation);

3.接下來你只需要給你需要設置動畫的控件設置動畫就ok了

//讓控件播放集合中的動畫,我這裏的iv圖片
iv.startAnimation(set);

7.那我們來說說補間動畫的特點吧

補間動畫動畫只是我們看着動畫在動,其實控件還是在原來的位置,就像那句話說的”樹在動,不是你心在動”

屬性動畫

//平移
    public void translate(View v) {
        /**
         * 參數一：　誰取播放這個動畫 參數二：屬性名字：　 實現什麼動畫 參數三：動畫的數值　，　０　－　１　－２　－３　－４　－５　
         */

        ObjectAnimator animator = ObjectAnimator.ofFloat(iv, "translationX", 0,20,100);
        // 指定動畫播放多少時間
        animator.setDuration(2000);

        // 設置播放的次數
        animator.setRepeatCount(Animation.INFINITE);

        // 設置播放的模式
        animator.setRepeatMode(Animation.REVERSE);

        animator.start();

    }




--------------------華麗的分割線--------------------------------

    public void rotate(View v) {

//      iv.setRotation()


        /**
         * 參數一：　誰取播放這個動畫 參數二：屬性名字：　 實現什麼動畫 參數三：動畫的數值　，　０　－　１　－２　－３　－４　－５　
*/

//旋轉動畫
        ObjectAnimator animator = ObjectAnimator.ofFloat(iv, "rotationY", 0,360);
        // 指定動畫播放多少時間
        animator.setDuration(2000);

        // 設置播放的次數
        animator.setRepeatCount(Animation.INFINITE);

        // 設置播放的模式
        animator.setRepeatMode(Animation.REVERSE);

        animator.start();
    }



--------------------華麗的分割線--------------------------------
//縮放動畫
    public void scale(View v) {

        /**
         * 參數一：　誰取播放這個動畫 參數二：屬性名字：　 實現什麼動畫 參數三：動畫的數值　，　０　－　１　－２　－３　－４　－５　
         */

        ObjectAnimator animator = ObjectAnimator.ofFloat(iv, "scaleX", 1,3);
        // 指定動畫播放多少時間
        animator.setDuration(2000);

        // 設置播放的次數
        animator.setRepeatCount(Animation.INFINITE);

        // 設置播放的模式
        animator.setRepeatMode(Animation.REVERSE);

        animator.start();
    }

--------------------華麗的分割線--------------------------------

//透明度動畫
    public void alpha(View v) {

        /**
         * 參數一：　誰取播放這個動畫 參數二：屬性名字：　 實現什麼動畫 參數三：動畫的數值　，　０　－　１　－２　－３　－４　－５　
         */

        ObjectAnimator animator = ObjectAnimator.ofFloat(iv, "alpha", 0.2f,1.0f);
        // 指定動畫播放多少時間
        animator.setDuration(2000);

        // 設置播放的次數
        animator.setRepeatCount(Animation.INFINITE);

        // 設置播放的模式
        animator.setRepeatMode(Animation.REVERSE);

        animator.start();
    }


--------------------華麗的分割線--------------------------------
//動畫集合
    public void set(View v) {
        ObjectAnimator animator = ObjectAnimator.ofFloat(iv, "translationX", 0,100);
        // 指定動畫播放多少時間
        animator.setDuration(2000);

        /*// 設置播放的次數
        animator.setRepeatCount(Animation.INFINITE);

        // 設置播放的模式
        animator.setRepeatMode(Animation.REVERSE);*/



        ObjectAnimator animatorY = ObjectAnimator.ofFloat(iv, "translationY", 0,100);
        // 指定動畫播放多少時間
        animatorY.setDuration(2000);

/*      // 設置播放的次數
        animatorY.setRepeatCount(Animation.INFINITE);

        // 設置播放的模式
        animatorY.setRepeatMode(Animation.REVERSE);*/

        //1. 定義一個集合
        AnimatorSet set = new AnimatorSet();

        //2. 往集合中添加動畫
//      set.playTogether(animator , animatorY);

        set.playSequentially(animatorY , animator  );

        //3. 讓集合中的動畫播放起來
        set.start();
    }

在xml文件中定義屬性動畫

1.在res中新建animator文件夾

//xml文件名字translate_demo
<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android" 
    android:propertyName="translationX"
    android:valueFrom="0"
    android:valueTo="200"
    android:duration="2000"
    android:repeatCount="infinite"
    android:repeatMode="reverse">

</objectAnimator>

2.代碼中加載xml屬性動畫

Animator animator = AnimatorInflater.loadAnimator(this, R.animator.translate_demo);

        animator.setTarget(iv);

        animator.start();