View Animation — ما هو، Tween Animation في Android

ما هو View Animation؟

View Animation هو نظام فرعي للرسوم المتحركة في Android يعمل على مستوى View (API 1+). يستخدم أربعة أنواع من Tween Animation: AlphaAnimation (الشفافية)، TranslateAnimation (الحركة)، ScaleAnimation (التحجيم) و RotateAnimation (الدوران). يتم وصف كل رسم متحرك في ملف XML في مجلد res/anim/ أو يتم إنشاؤه برمجياً في كود Kotlin.

آلية View Animation لا تغير الخصائص الحقيقية لـ View — تعيد رسم View في موضع جديد أو مقياس أو شفافية، لكن استدعاء onTouchEvent() يستقبل إحداثيات الموقع الأصلي. هذا قيد رئيسي يعرف بعدم تطابق النقر (click mismatch).

وفقاً لوثائق مطوري Android (2026)، صنفت Google View Animation كـ API قديم بدءاً من Android 3.0 (API 11). للمشاريع الجديدة، يُوصى باستخدام Property Animation — Animator و AnimatorSet و ObjectAnimator، التي تعمل مع الخصائص الحقيقية للكائنات من خلال طرق setter.

أنواع Tween Animation

Tween Animation هي رسوم متحركة «بين» الإطارات الرئيسية: تحدد الحالة الأولية والنهائية، ويحسب النظام الإطارات الوسيطة. يوفر Android أربعة أنواع قياسية، لكل منها مجموعة معلماته الخاصة.

AlphaAnimation

AlphaAnimation يغير شفافية View من fromAlpha إلى toAlpha. تتراوح القيم من 0.0 (شفاف تماماً) إلى 1.0 (مرئي تماماً). افتراضياً، تستمر الرسوم المتحركة 300 مللي ثانية. المعلمة fillAfter=true تترك View في حالة الشفافية النهائية.

<!-- res/anim/fade_out.xml -->
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"
    android:duration="500"
    android:fillAfter="true" />

TranslateAnimation

TranslateAnimation ينقل View من الموضع الأولي (fromXDelta, fromYDelta) إلى الموضع النهائي (toXDelta, toYDelta). تُحدد القيم بالبكسل أو النسب المئوية من الأصل أو النسب المئوية من View نفسه. على سبيل المثال، 100% تعني 100% من عرض View.

ScaleAnimation

ScaleAnimation يقيس View بالنسبة لنقطة pivotX/pivotY. fromXScale=1.0, toXScale=2.0 يضاعف العرض. تحدد المعلمة pivotType بالنسبة لماذا يُحسب المحور: self أو parent أو absolute. لا يغير تحجيم الرسوم المتحركة الأبعاد الحقيقية لـ View — فقط العرض.

RotateAnimation

RotateAnimation يدير View حول نقطة محور بزاوية من fromDegrees إلى toDegrees. تُقاس الزاوية بالدرجات: 0 هو الموضع الأصلي، 360 هو دوران كامل. للدوران اللانهائي، استخدم repeatCount=INFINITE.

View Animation مقابل Property Animation

الفرق بين View Animation و Property Animation (Animator) هو اختلاف جوهري في بنية الرسوم المتحركة في Android. View Animation يعمل فقط على العرض، بينما Property Animation يغير الخصائص الفعلية للكائن من خلال طرق setter، مما يؤدي إلى تحديث التخطيط.

تكوين XML للرسوم المتحركة

View Animation عادة ما يُعرف في ملفات XML في res/anim/ بعنصر جذر (AnimationSet) أو أحد الأنواع الأربعة. يسمح AnimationSet بدمج الرسوم المتحركة بمعلمات مشتركة مثل startOffset و duration و interpolator.

<!-- res/anim/bounce.xml -->
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/bounce_interpolator">

    <translate
        android:fromYDelta="0%"
        android:toYDelta="-100%"
        android:duration="600" />

    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.3"
        android:duration="600" />
</set>

يتم تحميل ملف XML عبر AnimationUtils.loadAnimation(). يحدد Interpolator كيفية تغير المعلمة بمرور الوقت: accelerate أو decelerate أو bounce أو overshoot. يتم إنشاء Interpolator مخصص عبر مورد XML @anim/interpolator_name.

السمات المشتركة

جميع رسوم Tween المتحركة تدعم السمات: duration (مللي ثانية)، startOffset (تأخير قبل البدء)، repeatCount، repeatMode (restart/reverse)، fillEnabled، fillBefore، fillAfter، interpolator. السمة fillAfter تحدد ما إذا كان View يبقى في الحالة النهائية للرسوم المتحركة بعد الانتهاء.

أمثلة كود في Kotlin

على الرغم من أن الرسوم المتحركة تُعرف عادة في XML، إلا أنه يمكن إنشاؤها برمجياً باستخدام Kotlin. النهج البرمجي مفيد للمعلمات الديناميكية: قيمة الشفافية تعتمد على حالة التطبيق بدلاً من أن تكون محددة بشكل ثابت.

// إنشاء AlphaAnimation برمجياً في Kotlin
import android.view.animation.AlphaAnimation
import android.view.animation.Animation
import android.view.View

fun View.fadeOut(duration: Long = 500L, onEnd: () -> Unit = {}) {
    val animation = AlphaAnimation(1.0f, 0.0f).apply {
        this.duration = duration
        fillAfter = true
        setAnimationListener(object : Animation.AnimationListener {
            override fun onAnimationEnd(animation: Animation?) { onEnd() }
            override fun onAnimationStart(animation: Animation?) {}
            override fun onAnimationRepeat(animation: Animation?) {}
        })
    }
    startAnimation(animation)
}

// تحميل الرسوم المتحركة من XML
val bounceAnim = AnimationUtils.loadAnimation(context, R.anim.bounce)
view.startAnimation(bounceAnim)

// AnimationSet — دمج الرسوم المتحركة
val set = AnimationSet(true).apply {
    addAnimation(TranslateAnimation(0f, 200f, 0f, 0f).apply { duration = 400 })
    addAnimation(RotateAnimation(0f, 360f).apply {
        duration = 400
        pivotX = view.width / 2f
        pivotY = view.height / 2f
    })
}
view.startAnimation(set)

الطريقة startAnimation() تضيف الرسوم المتحركة إلى قائمة عرض View. للإلغاء، استخدم clearAnimation(). مهم: fillAfter=true لا يغير LayoutParams — عند استدعاء startAnimation مرة أخرى، تبدأ الرسوم المتحركة من الحالة الأصلية لـ View، وليس من آخر حالة معروضة.

متى تستخدم View Animation؟

View Animation له نطاق تطبيق ضيق في 2026: دعم Android 4.x (API 16-19) حيث قد يعمل Property Animation بشكل غير مستقر؛ تأثيرات ظهور/اختفاء بسيطة لا تتطلب تغييرات LayoutParams؛ رسوم متحركة حيث عدم تطابق النقر ليس حرجاً (مثل عناصر الخلفية). لجميع الحالات الأخرى، توصي Google بالانتقال إلى ObjectAnimator أو AnimatorSet.

وفقاً لمطوري Android، Property Animation أكثر كفاءة في الذاكرة بنسبة 15-20% لأنه لا ينشئ إطارات canvas وسيطة. الانتقال من View Animation إلى Property Animation يزيل أيضاً مشكلة عدم تطابق النقر: View بعد الرسوم المتحركة يستقبل اللمسات في موضعه الجديد.