InfiniteRepeatableSpec

Class

Common
public class InfiniteRepeatableSpec<T>(
    public val animation: DurationBasedAnimationSpec<T>,
    public val repeatMode: RepeatMode = RepeatMode.Restart,
    public val initialStartOffset: StartOffset = StartOffset(0),
) : AnimationSpec<T>

InfiniteRepeatableSpec repeats the provided animation infinite amount of times. It will never naturally finish. This means the animation will only be stopped via some form of manual cancellation. When used with transition or other animation composables, the infinite animations will stop when the composable is removed from the compose tree.

For non-infinite repeating animations, consider RepeatableSpec.

initialStartOffset can be used to either delay the start of the animation or to fast forward the animation to a given play time. This start offset will not be repeated, whereas the delay in the animation (if any) will be repeated. By default, the amount of offset is 0.

Parameters

animationthe AnimationSpec to be repeated
repeatModewhether animation should repeat by starting from the beginning (i.e. RepeatMode.Restart) or from the end (i.e. RepeatMode.Reverse)
initialStartOffsetoffsets the start of the animation

Secondary Constructors

public constructor(
    animation: DurationBasedAnimationSpec<T>,
    repeatMode: RepeatMode = RepeatMode.Restart,
) : this(animation, repeatMode, StartOffset(0))

Code Examples

InfiniteProgressIndicator

@Composable
fun InfiniteProgressIndicator() {
    // This is an infinite progress indicator with 3 pulsing dots that grow and shrink.
    @Composable
    fun Dot(scale: State<Float>) {
        Box(
            Modifier.padding(5.dp)
                .size(20.dp)
                .graphicsLayer {
                    scaleX = scale.value
                    scaleY = scale.value
                }
                .background(Color.Gray, shape = CircleShape)
        )
    }
    val infiniteTransition = rememberInfiniteTransition()
    val scale1 =
        infiniteTransition.animateFloat(
            0.2f,
            1f,
            // No offset for the 1st animation
            infiniteRepeatable(tween(600), RepeatMode.Reverse),
        )
    val scale2 =
        infiniteTransition.animateFloat(
            0.2f,
            1f,
            infiniteRepeatable(
                tween(600),
                RepeatMode.Reverse,
                // Offsets the 2nd animation by starting from 150ms of the animation
                // This offset will not be repeated.
                initialStartOffset = StartOffset(offsetMillis = 150, StartOffsetType.FastForward),
            ),
        )
    val scale3 =
        infiniteTransition.animateFloat(
            0.2f,
            1f,
            infiniteRepeatable(
                tween(600),
                RepeatMode.Reverse,
                // Offsets the 3rd animation by starting from 300ms of the animation. This
                // offset will be not repeated.
                initialStartOffset = StartOffset(offsetMillis = 300, StartOffsetType.FastForward),
            ),
        )
    Row {
        Dot(scale1)
        Dot(scale2)
        Dot(scale3)
    }
}