Home > database >  How to apply multiple animation in sequence using ViewProperty animator?
How to apply multiple animation in sequence using ViewProperty animator?

Time:03-27

I want to apply multiple scaleX animations on a view.

  binding.indicator
            .animate()
            .scaleX(2f)
            .start()

  binding.indicator
            .animate()
            .translationX(binding.indicator.width.toFloat())
            .setStartDelay(1000)
            .start()

  binding.indicator
            .animate()
            .scaleX(1f)
            .setStartDelay(2000)
            .start()

I thing the latest animator just overrides the animator on the view. How can I achieve this?

I want to do the following animations in sequence: scaleX -> translateX -> scaleX

End product I want to achieve: https://imgur.com/a/xfY8ujz

CodePudding user response:

Use an AnimatorSet and play the animations sequentially:

val anim1 = ObjectAnimator.ofFloat(view, "scaleX", 2f)
val anim2 = ObjectAnimator.ofFloat(view, "translationX", view.width.toFloat())
val anim3 = ObjectAnimator.ofFloat(view, "scaleX", 1f)
val animatorSet = AnimatorSet()
animatorSet.playSequentially(anim1, anim2, anim3)
animatorSet.duration = 3000
animatorSet.interpolator = AccelerateInterpolator()
animatorSet.start()
  • Related