Анимированные векторные изображения в Compose

Анимировать векторы в Compose можно несколькими способами. Вы можете использовать любое из следующих действий:

  • Формат файла AnimatedVectorDrawable
  • ImageVector с API-интерфейсами Compose анимации, как в этой статье на Medium.
  • Стороннее решение, такое как Lottie.

Анимированные векторные рисунки (экспериментальные)

Песочные часы анимируют свое содержимое и вращаются
Рисунок 1. Анимированный вектор, который можно нарисовать в Compose

Чтобы использовать ресурс AnimatedVectorDrawable , загрузите рисуемый файл с помощью animatedVectorResource и передайте boolean для переключения между начальным и конечным состоянием вашего рисуемого объекта, выполняя анимацию.

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

Дополнительные сведения о формате рисуемого файла см. в разделе Анимация рисуемой графики .

{% дословно %} {% дословно %} {% дословно %} {% дословно %}