BallAnimator

這次我們打算來實作 Animator 看看

ValueAnimator

我們可以透過使用 ValueAnimator 來設定動畫

class ValueAnimatorActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_value_animator)

        goBtn.setOnClickListener { ValueAnimator.ofFloat(0f, -800f, 0f).apply {
            duration = 3000
            addUpdateListener {
                valueImageView.translationY = it.animatedValue as Float
            }
            start()
        }
        }
    }
}

讓我來看看裡面發生了什麼事吧！
我們使用了 ValueAnimator.ofFloat 裡面設定的值來告訴 Android 我的動畫要怎麼做呈現。
這裡面的 Value 能夠設很多組來達到你想要的效果(例如你想要物件一直上上下下)。
然後我們還需要設置 duration 來設定動畫的時間長度。
由於 ValueAnimator 是沒有設定對象，我們需要透過 addUpdateListener 來指定對象以及要針對哪個參數作數值的變換。
這裡我們就可以看到我們是針對一個 ImageView 的 translationY 來做變換。這樣 ImageView 就可以上下移動了。

ObjectAnimator

class ObjectAnimatorActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_object_animator)

        objectGoBtn.setOnClickListener {
            ObjectAnimator.ofFloat(objectImageView, "rotationY", 0f, 360f).apply {
                duration = 3000
                start()
            }
        }
    }
}

除了使用 ValueAnimator 之外，Android 還提供了一個 ObjectAnimator 這個方便的類別。
這個類別可以讓你直接指定目標與參數。
從程式碼中可以很清楚的看到我希望 objectImageView 在 3 秒內針對 Y 軸做一個 360 度的旋轉。

AnimatorSet

除了這些，Android 還提供了一些有趣的 function 。
例如 after, playtogether 可以讓你自訂順序或者讓兩個動畫一起動作。

private val oneClickHandler = View.OnClickListener {
        val animator1 = ObjectAnimator.ofFloat(animator1ImageView,"translationY",0f, -800f, 0f)
        val animator2 = ObjectAnimator.ofFloat(animator2ImageView,"translationY",0f, -800f, 0f)

        val animatorSet = AnimatorSet()
        animatorSet.duration = 2000
        animatorSet.play(animator1).after(animator2)
        animatorSet.start()
    }

    private val sameClickHandler = View.OnClickListener {
        val animator1 = ObjectAnimator.ofFloat(animator1ImageView,"translationY",0f, -800f, 0f)
        val animator2 = ObjectAnimator.ofFloat(animator2ImageView,"translationY",0f, -800f, 0f)

        val animatorSet = AnimatorSet()
        animatorSet.duration = 2000
        animatorSet.playTogether(animator1, animator2)
        animatorSet.start()
    }

Interpolator

Android 在動畫裡還提供了幾種有趣的效果器。
想看更多詳細的介紹可以透過參考文件中的 Property Animator 裡來了解。
那我們來看看是如何實作的吧

animator = ObjectAnimator.ofFloat(interImageView, "translationX", 0f, 600f , 0f)
animator.duration = 2000

animator.interpolator = AccelerateInterpolator()
animator.start()

我們實作一個 ObjectAnimator 後就可以使用 interpolator 來使用自己喜歡的效果器。

這裡有一個特別提醒一般 Animator 預設的效果器是 AccelerateDecelerateInterpolator

參考文件

Android Animator
Property Animator
Android ValueAnimator
Android ObjectAnimator