This class defines a start offset for repeatable and infiniteRepeatable. There are two types of start offsets: StartOffsetType.Delay and StartOffsetType.FastForward. StartOffsetType.Delay delays the start of the animation, whereas StartOffsetType.FastForward fast forwards the animation to a given play time and starts it right away.

import androidx.compose.animation.core.RepeatMode
import androidx.compose.animation.core.StartOffset
import androidx.compose.animation.core.StartOffsetType
import androidx.compose.animation.core.animateFloat
import androidx.compose.animation.core.infiniteRepeatable
import androidx.compose.animation.core.rememberInfiniteTransition
import androidx.compose.animation.core.tween
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.runtime.Composable
import androidx.compose.runtime.State
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.unit.dp

// 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)
}

Summary

Public constructors

StartOffset(offsetMillis: Int, offsetType: StartOffsetType)

This creates a start offset for repeatable and infiniteRepeatable.

Cmn

Public properties

Int

Returns the number of milliseconds to offset the start of the animation.

Cmn
StartOffsetType

Returns the offset type of the provided StartOffset.

Cmn

Public constructors

StartOffset

StartOffset(
    offsetMillis: Int,
    offsetType: StartOffsetType = StartOffsetType.Delay
)

This creates a start offset for repeatable and infiniteRepeatable. offsetType can be either of the following: StartOffsetType.Delay and StartOffsetType.FastForward. offsetType defaults to StartOffsetType.Delay.

StartOffsetType.Delay delays the start of the animation by offsetMillis, whereas StartOffsetType.FastForward starts the animation right away from offsetMillis in the animation.

Public properties

offsetMillis

val offsetMillisInt

Returns the number of milliseconds to offset the start of the animation.

offsetType

val offsetTypeStartOffsetType

Returns the offset type of the provided StartOffset.