[Android] Android Tweened Animations動畫使用詳解一

時間 2019-11-07

標籤 android tweened animations 動畫使用詳解欄目 Android 简体版

原文原文鏈接

Android 平臺提供了兩類動畫。一類是Tween動畫，就是對場景裏的對象不斷的進行圖像變化來產生動畫效果（旋轉、平移、放縮和漸變）。android

第二類就是 Frame動畫，即順序的播放事先作好的圖像，與gif圖片原理相似。canvas

下面就講一下Tweene Animations。ide

主要類：佈局

Animation 動畫動畫

AlphaAnimation 漸變透明度this

RotateAnimation 畫面旋轉code

ScaleAnimation 漸變尺寸縮放xml

TranslateAnimation 位置移動對象

AnimationSet 動畫集繼承

有了這些類，那麼咱們如何來實現動畫效果呢？

以自定義View爲例，該View很簡單，畫面上只有一個圖片。如今咱們要對整個View分別實現各類Tween動畫效果。

AlphaAnimation

經過代碼實現 AlphaAnimation，以下：

//初始化Animation alphaAnimation = new AlphaAnimation(0.1f, 1.0f);//設置動畫時間            alphaAnimation.setDuration(3000);
                this.startAnimation(alphaAnimation);

其中AlphaAnimation類第一個參數fromAlpha表示動畫起始時的透明度，第二個參數toAlpha表示動畫結束時的透明度。

setDuration用來設置動畫持續時間。

RotateAnimation

代碼：

1
2
3

Animation rotateAnimation = new RotateAnimation(0f, 360f);
                rotateAnimation.setDuration(1000);
                this.startAnimation(rotateAnimation);

其中RotateAnimation類第一個參數fromDegrees表示動畫起始時的角度，第二個參數toDegrees表示動畫結束時的角度。

另外還能夠設置伸縮模式pivotXType、pivotYType，伸縮動畫相對於x,y 座標的開始位置pivotXValue、pivotYValue等。

ScaleAnimation

代碼：

//初始化Animation scaleAnimation = new ScaleAnimation(0.1f, 1.0f,0.1f,1.0f);//設置動畫時間scaleAnimation.setDuration(500);
                this.startAnimation(scaleAnimation);

ScaleAnimation類中

第一個參數fromX ,第二個參數toX:分別是動畫起始、結束時X座標上的伸縮尺寸。

第三個參數fromY ,第四個參數toY:分別是動畫起始、結束時Y座標上的伸縮尺寸。

另外還能夠設置伸縮模式pivotXType、pivotYType，伸縮動畫相對於x,y 座標的開始位置pivotXValue、pivotYValue等。

TranslateAnimation

代碼：

//初始化Animation translateAnimation = new TranslateAnimation(0.1f, 100.0f,0.1f,100.0f);//設置動畫時間                translateAnimation.setDuration(1000);
                            this.startAnimation(translateAnimation);

TranslateAnimation類

第一個參數fromXDelta ,第二個參數toXDelta:分別是動畫起始、結束時X座標。

第三個參數fromYDelta ,第四個參數toYDelta:分別是動畫起始、結束時Y座標。

參數詳細說明：

以上都是單獨的使用某個動畫，那麼如何讓多個動畫同時生效呢？

答案是 AnimationSet。

初看整個類名，還覺得只是用來存放 Animation的一個Set，細看才發現，該類也是繼承自 Animation的。

下面咱們實現一個動畫，該動畫會讓圖片移動的同時，圖片透明度漸變，直接看代碼吧。

                //初始化 Translate動畫
                translateAnimation = new TranslateAnimation(0.1f, 100.0f,0.1f,100.0f);
                //初始化 Alpha動畫
                alphaAnimation = new AlphaAnimation(0.1f, 1.0f);

                //動畫集
                AnimationSet set = new AnimationSet(true);
                set.addAnimation(translateAnimation);
                set.addAnimation(alphaAnimation);

                //設置動畫時間 (做用到每一個動畫)
                set.setDuration(1000);
                this.startAnimation(set);

是否是以爲很簡單呢？

附上整個View類的代碼吧。

package com.yfz.view;import com.yfz.R;import android.content.Context;import android.graphics.Canvas;import android.graphics.drawable.BitmapDrawable;import android.util.Log;import android.view.KeyEvent;import android.view.View;import android.view.animation.AlphaAnimation;import android.view.animation.Animation;import android.view.animation.AnimationSet;import android.view.animation.RotateAnimation;import android.view.animation.ScaleAnimation;import android.view.animation.TranslateAnimation;public class TweenAnim extends View {

    //Alpha動畫 - 漸變透明度
    private Animation alphaAnimation = null;

    //Sacle動畫 - 漸變尺寸縮放
    private Animation scaleAnimation = null;

    //Translate動畫 - 位置移動
    private Animation translateAnimation = null;

    //Rotate動畫 - 畫面旋轉
    private Animation rotateAnimation = null;

    public TweenAnim(Context context) {
        super(context);
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Log.e("Tween", "onDraw");
        //加載一個圖片
        canvas.drawBitmap(((BitmapDrawable)getResources().getDrawable(R.drawable.gallery_photo_5)).getBitmap(), 0, 0, null);
    }
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        Log.e("Tween", "onKeyDown");
        return true;
    }
    @Override
    public boolean onKeyUp(int keyCode, KeyEvent event) {
        Log.e("Tween", "onKeyDown");
        switch (keyCode) {
            case KeyEvent.KEYCODE_DPAD_UP:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_UP");
                alphaAnimation = new AlphaAnimation(0.1f, 1.0f);
                //設置動畫時間
                alphaAnimation.setDuration(3000);
                this.startAnimation(alphaAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_DOWN:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_DOWN");
                rotateAnimation = new RotateAnimation(0f, 360f);
                rotateAnimation.setDuration(1000);
                this.startAnimation(rotateAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_LEFT:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_LEFT");
                //初始化
                scaleAnimation = new ScaleAnimation(0.1f, 1.0f,0.1f,1.0f);
                //設置動畫時間
                scaleAnimation.setDuration(500);
                this.startAnimation(scaleAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_RIGHT:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_RIGHT");
                //初始化
                translateAnimation = new TranslateAnimation(0.1f, 100.0f,0.1f,100.0f);
                //設置動畫時間
                translateAnimation.setDuration(1000);

                this.startAnimation(translateAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_CENTER:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_CENTER");
                //初始化 Translate動畫
                translateAnimation = new TranslateAnimation(0.1f, 100.0f,0.1f,100.0f);
                //初始化 Alpha動畫
                alphaAnimation = new AlphaAnimation(0.1f, 1.0f);

                //動畫集
                AnimationSet set = new AnimationSet(true);
                set.addAnimation(translateAnimation);
                set.addAnimation(alphaAnimation);

                //設置動畫時間 (做用到每一個動畫)
                set.setDuration(1000);
                this.startAnimation(set);
                break;
            default:
                break;
        }
        return true;
    }}

在Activity中調用該類時，須要注意必定setFocusable(true)，不然焦點在Activity上的話，onKeyUp方法是不會生效的。

調用該View的代碼：

1
2
3

                TweenAnim anim = new TweenAnim(Lesson_11.this);
                anim.setFocusable(true);
                setContentView(anim);

上面經過Java代碼，實現了4中不一樣的Tween動畫，其實在Android中徹底能夠經過 XML文件來實現動畫。這種方式可能更加簡潔、清晰，也更利於重用。

下面咱們分別對這幾種動畫改用xml來實現。

首先是**AlphaAnimation**。

alpha_anim.xml：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:fromAlpha="0.1"
        android:toAlpha="1.0"
        android:duration="2000"
    /></set>

不用解釋了吧。

RotateAnimation

rotate_anim.xml：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromDegrees="0"
        android:toDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="500"
    /></set>

ScaleAnimation

scale_anim.xml：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="0.0"
        android:toXScale="1.0"
        android:fromYScale="0.0"
        android:toYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="500"
    />  </set>

TranslateAnimation

translate_anim.xml：

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="10"
        android:toXDelta="100"
        android:fromYDelta="10"
        android:toYDelta="100"
    /></set>

局文件都已經寫完，那麼如何來使用這些文件呢？

其實也很簡單，此時須要用到AnimationUtils類。經過該類中 loadAnimation 方法來加載這些佈局文件。

如：

1	rotateAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.rotate_anim);

此次View類的代碼以下：

package com.yfz.view;import com.yfz.R;import android.content.Context;import android.graphics.Canvas;import android.graphics.drawable.BitmapDrawable;import android.util.Log;import android.view.KeyEvent;import android.view.View;import android.view.animation.AlphaAnimation;import android.view.animation.Animation;import android.view.animation.AnimationSet;import android.view.animation.AnimationUtils;import android.view.animation.RotateAnimation;import android.view.animation.ScaleAnimation;import android.view.animation.TranslateAnimation;public class TweenAnim2 extends View {

    //Alpha動畫 - 漸變透明度
    private Animation alphaAnimation = null;

    //Sacle動畫 - 漸變尺寸縮放
    private Animation scaleAnimation = null;

    //Translate動畫 - 位置移動
    private Animation translateAnimation = null;

    //Rotate動畫 - 畫面旋轉
    private Animation rotateAnimation = null;

    public TweenAnim2(Context context) {
        super(context);
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Log.e("Tween", "onDraw");
        //加載一個圖片
        canvas.drawBitmap(((BitmapDrawable)getResources().getDrawable(R.drawable.gallery_photo_5)).getBitmap(), 0, 0, null);
    }
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        Log.e("Tween", "onKeyDown");
        return true;
    }
    @Override
    public boolean onKeyUp(int keyCode, KeyEvent event) {
        Log.e("Tween", "onKeyDown");
        switch (keyCode) {
            case KeyEvent.KEYCODE_DPAD_UP:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_UP");

                alphaAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.alpha_anim);

                this.startAnimation(alphaAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_DOWN:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_DOWN");

                rotateAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.rotate_anim);

                this.startAnimation(rotateAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_LEFT:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_LEFT");

                scaleAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.scale_anim);

                this.startAnimation(scaleAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_RIGHT:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_RIGHT");

                translateAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.translate_anim);

                this.startAnimation(translateAnimation);
                break;
            case KeyEvent.KEYCODE_DPAD_CENTER:
                Log.e("Tween", "onKeyDown - KEYCODE_DPAD_CENTER");
                //初始化 Translate動畫
                translateAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.translate_anim);

                //初始化 Alpha動畫
                alphaAnimation = AnimationUtils.loadAnimation(this.getContext(), R.anim.alpha_anim);

                //動畫集
                AnimationSet set = new AnimationSet(true);
                set.addAnimation(translateAnimation);
                set.addAnimation(alphaAnimation);

                //設置動畫時間 (做用到每一個動畫)
                set.setDuration(1000);
                this.startAnimation(set);
                break;
            default:
                break;
        }
        return true;
    }}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。