في بعض الحالات، تحتاج الصور إلى تأثيرات متحركة. ويكون هذا مفيدًا إذا كنت ترغب في عرض رسوم متحركة مخصصة للتحميل تتألف من عدة صور أو إذا كنت تريد أن تتحول الأيقونة بعد إجراء المستخدم. يوفّر Android خيارين لتحريك العناصر القابلة للرسم.
الخيار الأول هو استخدام AnimationDrawable. يتيح لك ذلك تحديد العديد من الملفات الثابتة القابلة للرسم التي تعرض ملفًا واحدًا في كل مرة لإنشاء صورة متحركة. الخيار الثاني هو استخدام AnimatedVectorDrawable، ما يتيح لك تحريك خصائص المتجه القابل للرسم.
استخدام AnimationDrawable
تتمثل إحدى طرق إنشاء رسوم متحركة في تحميل سلسلة من الموارد القابلة للرسم، مثل لفافة فيلم.
تستند الفئة AnimationDrawable إلى هذه الأنواع من الصور المتحركة القابلة للرسم.
يمكنك تحديد إطارات الصور المتحركة في رمزك باستخدام واجهة برمجة تطبيقات AnimationDrawable class API، ولكن من الأسهل تحديدها باستخدام ملف XML واحد يسرد الإطارات التي تشكِّل الصورة المتحركة. ينتمي ملف XML الخاص بهذا النوع من الصور المتحركة إلى دليل res/drawable/ الخاص بمشروع Android الخاص بك. في هذه الحالة، تعرض التعليمات ترتيب كل إطار في الصورة المتحركة ومدته.
يتألف ملف XML من عنصر <animation-list> كعقدة جذرية
وسلسلة من عُقد <item> الثانوية التي يحدّد كل منها إطارًا، وهو مورد قابل للرسم
ومدته. في ما يلي مثال على ملف XML لصور متحركة Drawable:
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
<item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
<item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>
يتم تشغيل هذه الصورة المتحركة لثلاثة إطارات. وعند ضبط السمة android:oneshot للقائمة على true، يتم التبديل مرة واحدة، ثم توقُّفها مع الاستمرار
على الإطار الأخير. في حال ضبط السمة android:oneshot على false،
يتم تكرار الرسم المتحرك.
إذا حفظت ملف XML هذا باسم rocket_thrust.xml في دليل res/drawable/ الخاص بالمشروع، يمكنك إضافته كصورة خلفية إلى View ثم طلب start() لتشغيله. في ما يلي مثال على نشاط تتم فيه إضافة الصورة المتحركة إلى علامة ImageView ثم تحريكها عند لمس الشاشة:
Kotlin
private lateinit var rocketAnimation: AnimationDrawable
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.main)
val rocketImage = findViewById<ImageView>(R.id.rocket_image).apply {
setBackgroundResource(R.drawable.rocket_thrust)
rocketAnimation = background as AnimationDrawable
}
rocketImage.setOnClickListener({ rocketAnimation.start() })
}
Java
AnimationDrawable rocketAnimation;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
rocketImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
rocketAnimation.start();
}
});
}
تجدر الإشارة إلى أنّه لا يمكن استدعاء طريقة start() التي تم استدعاؤها في AnimationDrawable أثناء إجراء onCreate() في Activity لأنّ AnimationDrawable لم يتم إرفاقها بالكامل بعد بالنافذة. لتشغيل الصورة المتحركة في الحال بدون الحاجة إلى تفاعل، يمكنك استدعاؤها من خلال الطريقة
onStart()Activity، وهي تُسمى عندما يجعل Android العرض مرئيًا على الشاشة.
لمزيد من المعلومات حول بنية XML والعلامات والسمات المتاحة، يُرجى الاطّلاع على موارد الصور المتحركة.
استخدام ImageVectorDrawable
المتّجه القابل للرسم هو نوع من أنواع الرسومات القابلة للتوسّع بدون أن تتعرّض للتقطيع أو التمويه. تتيح لك فئة AnimatedVectorDrawable و
AnimatedVectorDrawableCompat للتوافق مع الأنظمة القديمة تحريك خصائص المتجه القابل للرسم، مثل تدويره أو تغيير بيانات المسار لتحويله إلى صورة مختلفة.
يمكنك عادةً تعريف العناصر المتحركة للمتجهات القابلة للرسم في ثلاثة ملفات XML:
- متّجه قابل للرسم مع العنصر
<vector>فيres/drawable/. - متّجه متحرّك قابل للرسم باستخدام العنصر
<animated-vector>فيres/drawable/. - تمثّل هذه السمة واحدًا أو أكثر من كائنات العناصر المتحركة التي تستخدم العنصر
<objectAnimator>فيres/animator/.
يمكن أن تؤدي العناصر القابلة للرسم والمتّجهات المتحركة إلى إضافة تأثيرات حركية إلى سمات العنصرين <group>
و<path>. يحدّد العنصر <group> مجموعة من المسارات أو
المجموعات الفرعية، ويحدِّد العنصر <path> المسارات المطلوب رسمها.
عند تحديد متّجه قابل للرسم تريد تحريكه، استخدِم السمة android:name لتحديد اسم فريد للمجموعات والمسارات، كي تتمكّن من الرجوع إليها من تعريفات مستخدمي الصور المتحركة. على سبيل المثال:
res/drawable/vectorable.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="600"
android:viewportWidth="600">
<group
android:name="rotationGroup"
android:pivotX="300.0"
android:pivotY="300.0"
android:rotation="45.0" >
<path
android:name="v"
android:fillColor="#000000"
android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
</group>
</vector>
يشير تعريف المتجه المتحرك القابل للرسم إلى المجموعات والمسارات في المتجه القابل للرسم من خلال أسمائها:
res/drawable/animator للحفاظ على هذا التنسيق
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/vectordrawable" >
<target
android:name="rotationGroup"
android:animation="@animator/rotation" />
<target
android:name="v"
android:animation="@animator/path_morph" />
</animated-vector>
تمثل تعريفات الصور المتحركة العنصرين ObjectAnimator أو AnimatorSet. يُجري أول مؤثر حركي في هذا المثال تدوير المجموعة المستهدفة بزاوية 360 درجة:
res/animator/rotation.xml
<objectAnimator
android:duration="6000"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="360" />
يحول صانع الرسوم المتحركة الثاني في هذا المثال مسار المتجه القابل للرسم من شكل إلى آخر. يجب أن تكون المسارات متوافقة مع عملية التحويل: يجب أن تحتوي على العدد نفسه من الأوامر ونفس عدد المعلمات لكل أمر.
res/animator/path_morph.xml
<set xmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="3000"
android:propertyName="pathData"
android:valueFrom="M300,70 l 0,-70 70,70 0,0 -70,70z"
android:valueTo="M300,70 l 0,-70 70,0 0,140 -70,0 z"
android:valueType="pathType" />
</set>
وفي ما يلي AnimatedVectorDrawable الناتج:
AnimatedVectorDrawable.معاينة الرسومات الموجّهة التي يمكن رسمها (AVD)
تتيح لك أداة متحرّكة الرسومات الموجّهة التي يمكن رسمها في "استوديو Android" معاينة الموارد القابلة للرسم المتحركة. تساعدك هذه الأداة في معاينة موارد <animation-list> و<animated-vector> و<animated-selector> في "استوديو Android" وتسهّل تحسين الصور المتحركة المخصّصة.
لمزيد من المعلومات، يمكنك الاطّلاع على مرجع واجهة برمجة التطبيقات لـ
AnimatedVectorDrawable.