Compose में ऐनिमेशन वाली वेक्टर इमेज

Compose में वेक्टर को कई तरीकों से ऐनिमेट किया जा सकता है. इनमें से किसी भी तरीके का इस्तेमाल किया जा सकता है:

  • AnimatedVectorDrawable फ़ाइल फ़ॉर्मैट
  • ImageVector Compose Animation API के साथ, जैसे कि इस Medium लेख में बताया गया है
  • Lottie जैसे तीसरे पक्ष का समाधान

ऐनिमेटेड वेक्टर ड्रॉएबल (एक्सपेरिमेंट के तौर पर उपलब्ध)

घड़ी के आकार का ऐसा ऐनिमेशन जिसमें रेत गिरती हुई दिख रही है और घड़ी घूम रही है
पहली इमेज. 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
    )
}

ड्रॉएबल फ़ाइल के फ़ॉर्मैट के बारे में ज़्यादा जानने के लिए, ड्रॉएबल ग्राफ़िक को ऐनिमेट करना लेख पढ़ें.