2020年9月27日 星期日

[Android] 動畫簡介

markdown 簡單介紹一下 Android 上面的動畫,主要分為兩類,第一種是 Android 一開始提供的 [View Animation](https://developer.android.com/guide/topics/resources/animation-resource#View),第二種是 Android 3.0 之後提供的 [Property Animation](https://developer.android.com/guide/topics/resources/animation-resource#Property)。 ## View Animation View Animation 又細分為兩種,Tween animation 跟 Frame animation。 大多數情況我們會使用 Tween animation,這種動畫可以用來做旋轉、淡入淡出、移動以及縮放,而且可以定義在 xml 中。 Frame animation 就是通過顯示一張張圖片而成的動畫,就像播放影片一樣,也可以定義再 xml 中,不過這種方式使用情境較少。 View animation 的 class 定義在 [android.view.animation](https://developer.android.com/reference/android/view/animation/package-summary) package 中,主要的 class 有 * [AlphaAnimation](https://developer.android.com/reference/android/view/animation/AlphaAnimation) * [AnimationSet](https://developer.android.com/reference/android/view/animation/AnimationSet) * [RotateAnimation](https://developer.android.com/reference/android/view/animation/RotateAnimation) * [ScaleAnimation](https://developer.android.com/reference/android/view/animation/ScaleAnimation) * [TranslateAnimation](https://developer.android.com/reference/android/view/animation/TranslateAnimation) 那既然 Android 已經支持了這些動畫功能,為什麼要在之後引入 Property Animation 呢?一個是因為 View Animation 如同它的名字一樣,只能作用在 View 上面,假如我們有一個 custom view,而它的繪製是基於某個物件,我們希望實現的動畫是去操作這個物件讓 custom view 重繪,這時 View Animation 就派不上用場。 另外就是 View Animation 的動畫顯示的改變沒有實際作用到 View 上面,例如 View Animation 的動畫把一個左側的 Button 平滑移動到右側,此時你去點擊右側的 Button,是沒有作用的,Button 實際上還在左側,只是在畫面上將它繪製在右側而已。 當然可能還有其它各種 View Animation 不好發揮用處的場景,於是後來 Android 推出了 Property Animation。 ## Property Animation Property Animation 如同名字一樣,在動畫中做的改變會實際影響到 View 的 property 例如位置,大小等等。 核心的 class 有 * [ObjectAnimator](https://developer.android.com/reference/android/animation/ObjectAnimator) * [ValueAnimator](https://developer.android.com/reference/android/animation/ValueAnimator) 可以看到,跟 View animation 相比,Property Animation 的 class 是以 animator 結尾,這可以讓人比較好一眼就分辨出現在在使用的是 View Animation 還是 Property Animation。 ValueAnimator 的使用,下面有一個簡單範例。
ValueAnimator anim = ValueAnimator.ofInt(1, 10);
anim.setDuration(1000);
anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        int v = (int) animation.getAnimatedValue();
        // Redraw the view according to the value...
    }
});
anim.start();
ValueAnimator 的最簡單用法,就是讓你指定一個的初始值跟結束值,還有時間長度,然後當 Animator 開始後,就會不斷呼叫你實作的 listener,讓你可以重繪 View 來達成動畫的效果。 不過 ValueAnimator 還要自己手刻重繪製的動作,有點麻煩,另一個 ObjectAnimator 可以更簡單的實現動畫效果,看下面的範例。
ObjectAnimator animator = ObjectAnimator.ofInt(button, "width", 200, 300);
animator.setDuration(1000);
animator.start();
ObjectAnimator 是繼承 ValueAnimator 的,所以像 ofInt 跟 ofFloat 這類的 函式,ObjectAnimator 也是有的,但跟 ValueAnimator 不一樣的是,ObjectAnimator 可以讓你傳入任意的 View 還有你想操作的 View 屬性, 讓 ObjectAnimator 自動幫你設定屬性。例如上面的範例,呼叫 start 後,就會看到為時 1 秒的動畫顯示 button 的 width 從 200 變成 300。 這些需要提一下的是,ObjectAnimator 不是去看 button 物件有沒有 width 這個屬性,而是去看 button 有沒有 setWidth、getWidth 方法,所以,只要你想操作的值在物件中有對應的 set、get 方法,就都可以使用 ObjectAnimator。 這些 ValueAnimator 跟 ObjectAnimator 的基本用法,可以了解 Property Animation 的概念,也可以實現很多簡單的動畫了,進階的用法,就等需要用到時再去研究。 --- * [属性动画 ValueAnimator 运行原理全解析](https://www.jianshu.com/p/46f48f1b98a9) * [Android属性动画完全解析(上),初识属性动画的基本用法](https://blog.csdn.net/sinyu890807/article/details/43536355)