عرض الصورة المتحركة

يمكنك استخدام نظام عرض الرسوم المتحركة لإجراء رسم متحرك متداخل على طرق العرض. صور متحركة ما قبل سن المراهقة بحساب الرسوم المتحركة باستخدام معلومات مثل نقطة البداية ونقطة النهاية والحجم والتدوير على الجوانب الشائعة الأخرى في الرسوم المتحركة.

يمكن للرسوم المتحركة في مرحلة ما قبل المراهقة إجراء سلسلة من التحولات البسيطة (الموضع والحجم والتدوير والشفافية) على محتويات كائن العرض. لذلك، إذا كان لديك عنصر TextView، يمكنك تحريك النص أو تدويره أو زيادته أو تصغيره. إذا كان يحتوي على الخلفية، سيتم تحويل صورة الخلفية مع النص. يوفّر animation package جميع الصفوف المستخدَمة في الصور المتحركة لمرحلة ما قبل سن المراهقة.

يحدد تسلسل تعليمات الرسوم المتحركة الحركة ما قبل سن المراهقة، التي يتم تحديدها باستخدام XML أو رمز Android. وكما هو الحال بالنسبة إلى تحديد التنسيق، يوصى باستخدام ملف XML لأنه أكثر سهولة في القراءة، وقابلة لإعادة الاستخدام وقابلة للتبديل من الرسوم المتحركة الثابتة. في المثال أدناه، نستخدم XML. (إلى لمعرفة المزيد حول تحديد حركة في رمز التطبيق، بدلاً من XML، راجع فئة AnimationSet وAnimation فئة فرعية أخرى).

تحدد تعليمات الرسوم المتحركة التحويلات التي تريد أن تحدث، ومتى يحدث، والمدة التي يجب أن تستغرقها للتطبيق. يمكن أن تكون عمليات التحويل متسلسلة أو متزامنة - على سبيل المثال، يمكنك نقل محتويات TextView من اليسار إلى اليمين، ثم تدويرها 180 درجة، أو يمكنك نقل النص وتدويره في آنٍ واحد. يستغرق كل تحويل مجموعة من المعلَمات الخاصة بهذا التحويل (الحجم المبدئي وحجم النهاية للحجم التغيير، وزاوية البداية وزاوية النهاية للدوران، وهكذا)، وكذلك مجموعة من (مثل وقت البدء والمدة). لإجراء العديد من التحويلات في الوقت نفسه، امنحهم نفس وقت البدء؛ لجعلها متسلسلة، احسب وقت البدء بالإضافة إلى مدة التحويل السابق.

ينتمي ملف XML للصور المتحركة إلى دليل res/anim/ في جهاز Android. مشروعك. يجب أن يحتوي الملف على عنصر جذر واحد: سيكون هذا العنصر عنصرًا واحدًا <alpha>، <scale>، <translate>، <rotate>، أو عنصر الاستيفاء، أو عنصر <set> الذي يحمل مجموعات من هذه العناصر (والتي قد تتضمن <set> أخرى). بشكل تلقائي، يتم تطبيق تعليمات الرسوم المتحركة في وقت واحد. لتنفيذها بشكل تسلسلي، يجب عليك حدِّد السمة startOffset كما هو موضّح في المثال أدناه.

يتم استخدام XML التالي من أحد ApiDemos للتمديد، ثم التدوير في وقت واحد يمكنك تدوير كائن "عرض".

<set android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set android:interpolator="@android:anim/decelerate_interpolator">
        <scale
           android:fromXScale="1.4"
           android:toXScale="0.0"
           android:fromYScale="0.6"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400"
           android:fillBefore="false" />
        <rotate
           android:fromDegrees="0"
           android:toDegrees="-45"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400" />
    </set>
</set>

إحداثيات الشاشة (غير المستخدمة في هذا المثال) هي (0,0) في الزاوية العلوية اليسرى، عند النزول إلى اليمين.

يمكن تحديد بعض القيم، مثل pivotX، بالنسبة إلى الكائن نفسه أو نسبةً إلى أحد الوالدين. تأكد من استخدام التنسيق الصحيح لما تريده ("50" بنسبة 50% بالنسبة إلى الأصل، أو "50%" بنسبة 50% بالنسبة إلى نفسه).

يمكنك تحديد كيفية تطبيق عملية تحويل بمرور الوقت من خلال تحديد Interpolator. يتضمن Android العديد من الفئات الفرعية لأداة Interpolator التي لتحديد منحنيات سرعة مختلفة: على سبيل المثال، AccelerateInterpolator عملية التحويل تبدأ ببطء وتسرّع. ولكل منها قيمة سمة يمكن المطبّقة في XML.

مع حفظ XML هذا باسم hyperspace_jump.xml في res/anim/ المشروع، سيشير الرمز التالي إليه ويطبقه على كائن ImageView من التنسيق.

AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump).also { hyperspaceJumpAnimation ->
    findViewById<ImageView>(R.id.spaceshipImage).startAnimation(hyperspaceJumpAnimation)
}

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
spaceshipImage.startAnimation(hyperspaceJumpAnimation);

بدلاً من startAnimation()، يمكنك تحديد وقت بدء باستخدام Animation.setStartTime()، ثم اضبط الحركة على "العرض" باستخدام View.setAnimation().

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

ملاحظة: بغض النظر عن كيفية نقل الرسم المتحرك أو تغيير حجمه، لن يتم ضبط حدود العرض الذي يحتفظ بالرسم المتحرك تلقائيًا لاستيعابها. ومع ذلك، سيستمر رسم الحركة خارج حدود "العرض" ولن يتم اقتصاصها. ومع ذلك، سيحدث الاقتصاص إذا تجاوزت الصورة المتحركة حدود طريقة العرض الرئيسية.