Animierte Vektorbilder in Compose

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Es gibt verschiedene Möglichkeiten, Vektoren in Compose zu animieren. Sie haben folgende Möglichkeiten:

• AnimatedVectorDrawable-Dateiformat
• ImageVector mit Compose-Animations-APIs, wie in diesem Medium-Artikel
• Eine Drittanbieterlösung wie Lottie

Animierte Vektor-Drawables (experimentell)

Wenn Sie eine AnimatedVectorDrawable-Ressource verwenden möchten, laden Sie die drawable-Datei mit animatedVectorResource und geben Sie boolean ein, um zwischen dem Start- und Endzustand des drawable zu wechseln und die Animation auszuführen.

@Composable
fun AnimatedVectorDrawable() {
    val image = AnimatedImageVector.animatedVectorResource(R.drawable.ic_hourglass_animated)
    var atEnd by remember { mutableStateOf(false) }
    Image(
        painter = rememberAnimatedVectorPainter(image, atEnd),
        contentDescription = "Timer",
        modifier = Modifier.clickable {
            atEnd = !atEnd
        },
        contentScale = ContentScale.Crop
    )
}
AnimationSnippets.kt

Weitere Informationen zum Format Ihrer drawable-Datei finden Sie unter Zeichnen Sie animierte Grafiken.