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
    )
}
AnimationSnippets.kt

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

पीछे जाएं
वैल्यू के हिसाब से ऐनिमेशन
आगे बढ़ें
ऐनिमेशन को पसंद के मुताबिक बनाएं