Is it possible to create AnimatonSet from ValueAnimator?

Viewed 55

I have a custom view. In this view, I am drawing 4 circles. This view has drawCirclesWithAnim() function in which I would like to draw circles with animation one by one with sequence.

For example, first circle is drawn at first, then second, then third ... so on. How to achieve this with custom views?

Since it is custom view, I think my only option is ValueAnimator. Currently, to achieve what I need, I am creating 4 ValueAnimators. Check out the code below:

CustomView.kt

    private var mAnimValCircle1 = 0f //These values are used in "onDraw()". 
    private var mAnimValCircle2 = 0f
    private var mAnimValCircle3 = 0f
    private var mAnimValCircle4 = 0f

    ...

    fun drawCirclesWithAnim(): {
        ValueAnimator().apply {
            duration = 200
            addUpdateListener {
                mAnimValCircle1 = it.animatedValue as Float
                invalidate()
            }
            setFloatValues(0f, 1f)
            start()
        }

        ValueAnimator().apply {
            startDelay = 200
            duration = 150
            addUpdateListener {
                mAnimValCircle2 = it.animatedValue as Float
                invalidate()
            }
            setFloatValues(0f, 1f)
            start()
        }

        ValueAnimator().apply {
            startDelay = 350
            duration = 150
            addUpdateListener {
                mAnimValCircle3 = it.animatedValue as Float
                invalidate()
            }
            setFloatValues(0f, 1f)
            start()
        }

        ValueAnimator().apply {
            startDelay = 500
            duration = 150
            addUpdateListener {
                mAnimValCircle4 = it.animatedValue as Float
                invalidate()
            }
            setFloatValues(0f, 1f)
            start()
        }
    }

As you can see, I am manualy calculating the delays and making sure that each animation starts after the previous one finishes. Not only that but also I am creating ValueAnimator for each of the circles. It is working fine. But I reckon this is not perfect solution.

Is there a way to create AnimationSet from ValueAnimator? Or, are there any other solutions available to tackle such cases?

1 Answers

I don't know of a way to use AnimationSet and ValueAnimator and don't believe it is possible out-of-the-box, but what you could do is use parameters in your function and write one method to handle it all, and with that get rid of lots of unneccessary code, something like :

fun drawCircleWithAnim(mAnimValCircle: float, duration: Int, startDelay: Int) {

    ValueAnimator().apply {
        startDelay = startDelay
        duration = duration
        addUpdateListener {
            mAnimValCircle = it.animatedValue as Float
            invalidate()
        }
        setFloatValues(0f, 1f)
        start()
    }
}

And then call 4 times like this :

drawCircleWithAnim(mAnimValCircle1, 200, 0)
drawCircleWithAnim(mAnimValCircle2, 150, 200)
drawCircleWithAnim(mAnimValCircle3, 350, 150)
drawCircleWithAnim(mAnimValCircle4, 500, 150)

Creating 4 ValueAnimators should not be a problem unless you are looking for ultra-micro optimization.

Related