DevBytes: View Animations

簡介：

本文講解了，怎樣使用pre-3.0 API 創建多種多樣的動畫的效果，關於Property Animations 請參考上一講的內容 （DevBytes: Property Animations）。

https://www.youtube.com/watch?v=_UWXqFBF86U

public class ViewAnimations extends Activity {

    CheckBox mCheckBox;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_animations);

        mCheckBox = (CheckBox) findViewById(R.id.checkbox);
        final Button alphaButton = (Button) findViewById(R.id.alphaButton);
        final Button translateButton = (Button) findViewById(R.id.translateButton);
        final Button rotateButton = (Button) findViewById(R.id.rotateButton);
        final Button scaleButton = (Button) findViewById(R.id.scaleButton);
        final Button setButton = (Button) findViewById(R.id.setButton);

        // Fade the button out and back in
        final AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
        alphaAnimation.setDuration(1000);

        // Move the button over and then back
        final TranslateAnimation translateAnimation =
                new TranslateAnimation(Animation.ABSOLUTE, 0,
                Animation.RELATIVE_TO_PARENT, 1,
                Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 100);
        translateAnimation.setDuration(1000);

        // Spin the button around in a full circle
        final RotateAnimation rotateAnimation = new RotateAnimation(0, 360,
                Animation.RELATIVE_TO_SELF, .5f, Animation.RELATIVE_TO_SELF, .5f);
        rotateAnimation.setDuration(1000);

        // Scale the button in X and Y.
        final ScaleAnimation scaleAnimation = new ScaleAnimation(1, 2, 1, 2);
        scaleAnimation.setDuration(1000);

        // Run the animations above in sequence on the final button. Looks horrible.
        final AnimationSet setAnimation = new AnimationSet(true);
        setAnimation.addAnimation(alphaAnimation);
        setAnimation.addAnimation(translateAnimation);
        setAnimation.addAnimation(rotateAnimation);
        setAnimation.addAnimation(scaleAnimation);

        setupAnimation(alphaButton, alphaAnimation, R.anim.alpha_anim);
        setupAnimation(translateButton, translateAnimation, R.anim.translate_anim);
        setupAnimation(rotateButton, rotateAnimation, R.anim.rotate_anim);
        setupAnimation(scaleButton, scaleAnimation, R.anim.scale_anim);
        setupAnimation(setButton, setAnimation, R.anim.set_anim);

    }

    private void setupAnimation(View view, final Animation animation,
            final int animationID) {
        view.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                // If the button is checked, load the animation from the given resource
                // id instead of using the passed-in animation paramter. See the xml files
                // for the details on those animations.
                v.startAnimation(mCheckBox.isChecked() ?
                        AnimationUtils.loadAnimation(ViewAnimations.this, animationID) :
                        animation);
            }
        });
    }
}

應用的截圖和上一講（DevBytes: Property Animations） 是一樣的，只不過，在動畫實現的方式上是不一樣的。

具體API的使用的方法請參考API  DOC。

View Animation

作者：FireOfStar 轉載：http://www.2cto.com/kf/201207/139783.html
你能夠使用視圖動畫系統來執行View對象上的補間動畫。補間動畫是用諸如開始點、結束點、尺寸、旋轉以及一些其他的動畫特性來計算的動畫。

補間動畫能夠在View對象的內容上執行一個簡單的變換系列（位置、尺寸、旋轉和透明度）。因此，如果有一個TextView對象，就能夠移動、旋轉、放大或縮小文本。如果該TextView對象有一個背景圖片，那麼這個背景圖片會跟文本一起變換。animation包提供了補間動畫中所使用的所有的類。

動畫指令序列定義了補間動畫，這些指令既可以用XML來定義，也可以用Android代碼來定義。跟佈局定義一樣，推薦使用XML來定義動畫，因爲它更加可讀、可重用、並且比應編碼的動畫更加可插拔。在下面的例子中，我們使用XML。（要學習更多的有關在應用程序代碼中定義動畫的知識，請閱讀AnimationSet類和其他的Animation子類。）

動畫指令定義了你想要的動畫變換，以及動畫發生的時機和動畫的播放的時長。動畫變換能夠是順序的或併發的，例如：有一個從左向右移動的TextView對象的內容，然後旋轉180度，或者在文本移動的同時旋轉。每種變換都需要一組參數來指定所要的變換（針對尺寸變換的開始尺寸和結束尺寸、針對旋轉的開始角度和結束角度等等），以及一組共同的參數（例如，開始時間和持續時長）。如果要是讓幾種變換同時發生，就要給它們設置相同的開始時間；如果要讓它們順序播放，就要用開始時間加上前面動畫變換的時長來計算下一個動畫播放的開始時間。


動畫XML文件要定義在你的Android工程的res/anim/目錄中。這個文件必須要有一個單獨的根元素：這個元素既可以是一個單獨的<alpha>、<scal>、<translate>、<rotate>的插值元素，也可以是擁有這些元素（包括<set>元素）組合的<set>元素。默認情況下，所有的動畫指令都是併發的。要讓它們順序的發生，就必須像下面的示例所示的那樣，指定startOffset屬性。


下面的XML來自於APIDemo中的一個用於拉伸，然後同時旋轉的View對象:

<set android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set android:interpolator="@android:anim/decelerate_interpolator">
        <scale
           android:fromXScale="1.4"
           android:toXScale="0.0"
           android:fromYScale="0.6"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400"
           android:fillBefore="false" />
        <rotate
           android:fromDegrees="0"
           android:toDegrees="-45"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400" />
    </set>
</set>

在左上角屏幕的座標（在上面的這個例子中沒有使用）是（0,0），並且向右下角逐漸增加。


有一些值，如pivotX，能夠相對於對象自己或它的父容器來指定。對於想要的值必須使用正確的格式（50是指相對它的父容器的左上角的50%，50%則是指相對於它自己的左上角的50%）。


通過分配一個Interpolator對象，能夠決定如何隨着時間的推移來進行一個動畫的變換。Android包括了幾種Interpolator子類，它們能夠指定各種速度的曲線，例如：AccelerateInterpolator會告訴系統執行一個開始慢，然後逐漸加速的變換。每種變換都會有一個屬性值被應用於XML中。


保存在工程的res/anim/目錄中的hyperspace_jump.xml文件，下列代碼會引用這個文件，並把它應用於一個來自佈局的ImageView對象。

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
spaceshipImage.startAnimation(hyperspaceJumpAnimation);

作爲startAnimation()方法的一個替代方法，你能夠用Animation.setStartTime()方法來定義動畫的開始時間，然後用View.setAnimation()方法把這個動畫對象分配給View對象。

注意：不管你的動畫如何移動或調整尺寸，擁有動畫的View對象的邊界都不會自動的調整來適應變化，即使動畫超出了View對象的邊界也不會被裁剪，但是如果動畫超出了它的父容器的的邊界，那麼它將會被裁剪。

參考：

View Animation 

https://developer.android.com/guide/topics/graphics/view-animation.html

http://blog.csdn.net/ajq1989/article/details/7246747

http://my.eoe.cn/90353/archive/4372.html