صور متجهات متحركة في Compose

يمكن تحريك الرسومات المتجهة في Compose بعدة طرق مختلفة. يمكنك استخدام أيّ مما يلي:

  • تنسيق الملف AnimatedVectorDrawable
  • ImageVector باستخدام واجهات برمجة التطبيقات الخاصة بالصور المتحركة في 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
    )
}
AnimationSnippets.kt

لمزيد من المعلومات حول تنسيق ملف الرسومات القابلة للرسم، يُرجى الاطّلاع على تحريك الرسومات القابلة للرسم.

السابق
الصور المتحركة المستندة إلى القيمة
التالي
تخصيص الصور المتحركة