Android 幀動畫 補間動畫 屬性動畫

Android 中動畫分爲三種：
  1 幀動畫
  2 補間動畫
  3 屬性動畫

1 幀動畫 FrameAnimation

先看圖

常用的爲xml資源文件方式
res/drawable下創建 animation.xml文件

<?xml version="1.0" encoding="utf-8"?>
<animation-list
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false"
    >
    <!--false  代表循環播放   true 代表只播放一次-->

    <item android:drawable="@drawable/animate_01" android:duration="150"/>
    <item android:drawable="@drawable/animate_02" android:duration="150"/>
    <item android:drawable="@drawable/animate_03" android:duration="150"/>
    <item android:drawable="@drawable/animate_04" android:duration="150"/>
    <item android:drawable="@drawable/animate_05" android:duration="150"/>
    <item android:drawable="@drawable/animate_06" android:duration="150"/>
    <item android:drawable="@drawable/animate_07" android:duration="150"/>
    <item android:drawable="@drawable/animate_08" android:duration="150"/>
    <item android:drawable="@drawable/animate_09" android:duration="150"/>
    <item android:drawable="@drawable/animate_10" android:duration="150"/>
    <item android:drawable="@drawable/animate_11" android:duration="150"/>
    <item android:drawable="@drawable/animate_12" android:duration="150"/>
    <item android:drawable="@drawable/animate_13" android:duration="150"/>
    <item android:drawable="@drawable/animate_14" android:duration="150"/>
</animation-list>

界面佈局中引入

<ImageView
    android:id="@+id/image_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/animation"
        />

運行就可得到圖中的效果。

代碼的方式

  ImageView imageView = (ImageView) findViewById(R.id.image_view);

        AnimationDrawable animationDrawable = new AnimationDrawable();
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_01),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_02),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_03),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_04),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_05),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_06),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_07),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_08),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_09),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_10),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_11),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_12),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_13),150);
        animationDrawable.addFrame(getResources().getDrawable(R.drawable.animate_14),150);


        imageView.setBackground(animationDrawable);
        //循環播放
        animationDrawable.setOneShot(false);
        //開始
        animationDrawable.start();
        //停止
//        animationDrawable.stop();

2 補間動畫 TweenAnimation

補間動畫主要分爲四種:

 1 AlphaAnimation  漸變動畫

 2 RotateAnimation 旋轉動畫

 3 ScaleAnimation  縮放動畫

 4 TranslateAnimation 平移動畫

#### AlphaAnimation 漸變動畫

    //從透明到不透明
    AlphaAnimation alphaAnimation = new AlphaAnimation(0,1);
    //時間
    alphaAnimation.setDuration(1500);
    //設置動畫執行完一次後再重複執行的次數
    alphaAnimation.setRepeatCount(0);
    mImageViewCat.startAnimation(alphaAnimation);

RotateAnimation 旋轉動畫

    //以左上角爲圓心順時針旋轉90度
    //RotateAnimation rotateAnimation = new RotateAnimation(0,90);
    //以圖片的中心爲圓心順時針旋轉90度
    RotateAnimation rotateAnimation = new RotateAnimation(0,90, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    rotateAnimation.setDuration(1500);
    //設置動畫執行完一次後再重複執行的次數
    rotateAnimation.setRepeatCount(2);
    //動畫執行完是否保存狀態  false 不保存  true 保存
    rotateAnimation.setFillAfter(false);
    mImageViewCat.startAnimation(rotateAnimation);

ScaleAnimation 縮放動畫

    //以圖片中心爲中心從0到1放大
    ScaleAnimation scaleAnimation = new ScaleAnimation(
            0,1.0f, 0, 1.0f,
            Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    scaleAnimation.setDuration(2000);
    mImageViewCat.startAnimation(scaleAnimation);

TranslateAnimation 平移動畫

    //x方向向右平移圖片的寬度 y方向向下平移圖片的高度
    TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 1f,
            Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 1f);
    translateAnimation.setDuration(2000);
    mImageViewCat.startAnimation(translateAnimation);

AnimationSet 動畫集合

    //漸變 旋轉 縮放 平移同時進行
    AnimationSet animationSet = new AnimationSet(false);
    AlphaAnimation alphaAnimationS = new AlphaAnimation(0,1);
    RotateAnimation rotateAnimationS = new RotateAnimation(0,90, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    ScaleAnimation scaleAnimationS = new ScaleAnimation(
            0,1.0f, 0, 1.0f,
            Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    TranslateAnimation translateAnimationS = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 1f,
            Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF, 1f);

    animationSet.addAnimation(alphaAnimationS);
    animationSet.addAnimation(rotateAnimationS);
    animationSet.addAnimation(scaleAnimationS);
    animationSet.addAnimation(translateAnimationS);
    animationSet.setDuration(3000);
    mImageViewCat.startAnimation(animationSet);

3 屬性動畫 PropertyAnimation

漸變

//第一個參數指定需要動畫的控件
//第二個參數指定控件的屬性
//第三個參數爲可變長參數
ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"alpha",1,0,1);
animator.setDuration(3000);
animator.start();

旋轉

         //旋轉，先順時針轉一圈，在逆時針轉一圈
                //以z方向爲軸旋轉
                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"rotation",0,360,0);
                //以x方向爲軸旋轉
//                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"rotationX",0,360,0);
                //以y方向爲軸旋轉
//                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"rotationY",0,360,0);
                animator.setDuration(3000);
                animator.start();

縮放

         //縮放 放大到2倍在縮小至原始大小
                // 寬度放大和縮小
                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"scaleX",1,2,1);
                //高度放大和縮小
//                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"scaleY",1,2,1);
                animator.setDuration(3000);
                animator.start();

平移

        //平移
                // x方向平移
                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"translationX",1,100,1);
                //y方向平移
//                ObjectAnimator animator = ObjectAnimator.ofFloat(mImageViewCat,"translationY",1,100,1);
                animator.setDuration(3000);
                animator.start();

集合

         ObjectAnimator alphaAnimator = ObjectAnimator.ofFloat(mImageViewCat,"alpha",1,0,1);
                ObjectAnimator rotaionAnimator = ObjectAnimator.ofFloat(mImageViewCat,"rotation",0,360,0);
                ObjectAnimator scaleXAnimator = ObjectAnimator.ofFloat(mImageViewCat,"scaleX",1,2,1);
                ObjectAnimator translationXAnimator = ObjectAnimator.ofFloat(mImageViewCat,"translationX",1,100,1);

                AnimatorSet animatorSet = new AnimatorSet();
                animatorSet.playTogether(alphaAnimator,rotaionAnimator,scaleXAnimator,translationXAnimator);
                animatorSet.setDuration(3000);
                animatorSet.start();