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

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

  • تنسيق ملف AnimatedVectorDrawable
  • ImageVector مع واجهات برمجة التطبيقات Compose Animation API، كما هو موضّح في مقالة 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
    )
}

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

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