Jetpack Compose infiniteRepeatable, repeats startDelay

Question

I want to create an infinite animation with a one-time start delay in Jetpack Compose.

I used infiniteRepeatable() with tween():

val value by rememberInfiniteTransition().animateFloat(
    initialValue = 0f,
    targetValue = 1f,
    animationSpec = infiniteRepeatable(
        animation = tween(
            durationMillis = 700,
            delayMillis = 200
        )
    )
)

in this case, the delayMillis will repeat:

*delay* 0..1, *delay* 0..1, *delay* 0..1 , *delay* 0..1  ...

but in ValueAnimator the start delay is one-time delay:

val animator = ValueAnimator.ofFloat(0f, 1f).apply {
    duration = 700
    startDelay = 200
    repeatCount = ValueAnimator.INFINITE
    addListener { /* value */ }
}
animator.start()

*delay* 0..1, 0..1, 0..1, 0..1, 0..1, 0..1, 0..1  ...

Is there any way to set a one-time start delay for InfiniteRepeatable in Jetpack Compose?

Thanks

score 7 · Accepted Answer · answered May 29 '21 at 11:53

Currently (1.0.0-beta07) non-repeated delays are not supported yet.

You can change the animation to somenthing like:

val animatedFloat = remember { Animatable(0f) }

LaunchedEffect(animatedFloat) {
    delay(200) // to avoid repeated delays
    animatedFloat.animateTo(
        targetValue = 1f, animationSpec = infiniteRepeatable(
            animation = tween(700, easing =  FastOutSlowInEasing),
            repeatMode = RepeatMode.Reverse
        )
    )
}

score 0 · Answer 2 · answered Apr 03 '22 at 09:41

In my case use the LaunchedEffect. I hope this helps you.

                val spin = animateFloatAsState(
            targetValue = if (rotation.value) 360F else 0F,
            animationSpec = infiniteRepeatable(
                animation = tween(durationMillis = 36_000),
                repeatMode = RepeatMode.Reverse
            ),
            /*finishedListener = {rotation.value = false}*/
        )
        LaunchedEffect(key1 = true) {
            delay(10_000)
            rotation.value = true
        }

Jetpack Compose infiniteRepeatable, repeats startDelay

2 Answers2