Compose'da animasyonlu vektör resimler

Compose'da vektörlere animasyon eklemenin birkaç farklı yolu vardır. Aşağıdakilerden herhangi birini kullanabilirsiniz:

  • AnimatedVectorDrawable dosya biçimi
  • Bu Medium makalesinde olduğu gibi Compose animasyon API'leriyle ImageVector
  • Lottie gibi üçüncü taraf bir çözüm

Animasyonlu drawable vektörler (deneysel)

İçeriği canlandırılan ve dönen kum saati
Şekil 1. Oluşturma'da animasyonlu drawable vektör

AnimatedVectorDrawable kaynağı kullanmak için animatedVectorResource kullanarak çizilebilir dosyayı yükleyin ve çizilebilir öğenizin başlangıç ve bitiş durumu arasında geçiş yapmak için boolean ileterek animasyonu gerçekleştirin.

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

Çizilebilir dosyanızın biçimi hakkında daha fazla bilgi için Çizilebilir grafikleri canlandırma başlıklı makaleyi inceleyin.

  • Not: JavaScript devre dışı bırakıldığında bağlantı metni gösterilir.
  • Resim yükleme