يمكن للصور المتحركة إضافة إشارات مرئية لإعلام المستخدمين بما يحدث في تطبيقك. وهي مفيدة بشكل خاص عند تغيير حالة واجهة المستخدم، مثلاً عند تحميل محتوى جديد أو توفُّر إجراءات جديدة. تضيف الرسوم المتحرّكة أيضًا مظهرًا مصقولًا إلى تطبيقك، ما يمنحه مظهرًا وشعورًا بجودة أعلى.
يتضمّن Android واجهات برمجة تطبيقات مختلفة للصور المتحركة استنادًا إلى نوع الصورة المتحركة التي تريدها. تقدّم هذه المستندات نظرة عامة على الطرق المختلفة التي يمكنك من خلالها إضافة حركة إلى واجهة المستخدم.
لمعرفة متى يجب استخدام الصور المتحركة بشكل أفضل، يمكنك أيضًا الاطّلاع على دليل التصميم المتعدد الأبعاد حول الحركة.
تحريك الصور النقطية
الشكل 1: عنصر قابل للرسم متحرك
لإضافة حركة إلى رسم مخطّط بكسل، مثل رمز أو صورة توضيحية، استخدِم واجهات برمجة التطبيقات drawable animation. يتم عادةً تحديد هذه الصور المتحركة بشكل ثابت باستخدام مورد قابل للرسم، ولكن يمكنك أيضًا تحديد سلوك الصورة المتحركة أثناء التشغيل.
على سبيل المثال، من الطرق الرائعة لإعلام المستخدم بأنّ إجراءَين مرتبطَين هو إضافة تأثير متحرك إلى زر التشغيل يتحول إلى زر إيقاف مؤقت عند النقر عليه.
لمزيد من المعلومات، يُرجى الاطّلاع على مقالة تحريك الرسومات القابلة للرسم.
إضافة تأثيرات متحركة إلى مستوى ظهور واجهة المستخدم وحركة عناصرها
الشكل 2: إنّ استخدام صورة متحركة خفيفة عند ظهور مربّع حوار ومغادرته يجعل تغيير واجهة المستخدم أقلّ حدة.
عندما تحتاج إلى تغيير مستوى ظهور أو موضع طرق العرض في التنسيق، من الجيد تضمين صور متحركة بسيطة لمساعدة المستخدم في فهم كيفية تغيُّر واجهة المستخدم.
لنقل طرق العرض أو إظهارها أو إخفاؤها ضمن التنسيق الحالي، يمكنك استخدام
نظام صور الموقع المتحركة الذي توفره حزمة android.animation والمتوفر في الإصدار Android 3.0
(المستوى 11 من واجهة برمجة التطبيقات) والإصدارات الأحدث. تعمل واجهات برمجة التطبيقات هذه على تعديل خصائص عناصر View على مدار فترة زمنية، مع
إعادة رسم العرض باستمرار عند تغيير الخصائص. على سبيل المثال، عند تغيير
خصائص الموضع، ينتقل العرض على الشاشة. عند تغيير سمة alpha
، يظهر العرض تدريجيًا أو يختفي تدريجيًا.
للحصول على أبسط طريقة لإنشاء هذه الصور المتحركة، فعِّل الصور المتحركة في التنسيق لكي يتم تطبيق صورة متحركة تلقائيًا عند تغيير مستوى ظهور أحد العروض. لمزيد من المعلومات، يُرجى الاطّلاع على التأثيرات المتحرّكة التلقائية لتعديلات التنسيق.
للتعرّف على كيفية إنشاء صور متحركة باستخدام نظام الصور المتحركة للخصائص، يمكنك الاطّلاع على نظرة عامة على الصور المتحركة للخصائص. يمكنك أيضًا الاطّلاع على الصفحات التالية لإنشاء صور متحركة شائعة:
الحركة المستندة إلى الفيزياء
الشكل 3. صورة متحركة تم إنشاؤها باستخدام ObjectAnimator.
الشكل 4: صورة متحركة تم إنشاؤها باستخدام واجهات برمجة التطبيقات المستندة إلى قوانين الفيزياء
طبِّق قوانين الفيزياء في العالم الواقعي على الصور المتحركة كلما أمكن ذلك لكي تبدو طبيعية. على سبيل المثال، يجب الحفاظ على الزخم عند تغيُّر استهدافهم وإجراء انتقالات سلسة أثناء أي تغييرات.
لتقديم هذه السلوكيات، تتضمّن مكتبة Android Support واجهات برمجة تطبيقات متعلّقة بالرسوم المتحركة والمستندة إلى قوانين الفيزياء للتحكّم في كيفية تنفيذ الرسوم المتحركة.
هناك رسوم متحركة شائعة تستند إلى الفيزياء هما:
إنّ الصور المتحركة التي لا تستند إلى التأثيرات الفيزيائية، مثل تلك التي تم إنشاؤها باستخدام واجهات برمجة تطبيقات ObjectAnimator، تكون ثابتة إلى حدٍ كبير وتمتاز بمدة
ثابتة. في حال تغيّرت القيمة المستهدَفة، عليك إلغاء العرض المتحرك في
وقت تغيُّر القيمة المستهدَفة، وإعادة ضبط العرض المتحرك باستخدام قيمة جديدة كقيمة البدء الجديدة، وإضافة القيمة المستهدَفة الجديدة. من الناحية المرئية، تؤدي هذه العملية
إلى إيقاف مفاجئ للصورة المتحركة وحركة غير متّسقة بعد ذلك،
كما هو موضّح في الشكل 3.
إنّ الصور المتحركة التي تم إنشاؤها باستخدام واجهات برمجة التطبيقات المستندة إلى الفيزياء، مثل
DynamicAnimation، يتم تشغيلها باستخدام
القوة. يؤدّي التغيير في القيمة المستهدَفة إلى تغيير في القوة. تنطبق
القوة الجديدة على السرعة الحالية، ما يؤدي إلى انتقال مستمر إلى
الهدف الجديد. تؤدي هذه العملية إلى إنشاء صورة متحركة تبدو أكثر طبيعية، كما هو موضّح في الشكل 4.
إضافة تأثيرات متحركة إلى تغييرات التنسيق
الشكل 5: يمكن إنشاء صورة متحركة لعرض المزيد من التفاصيل من خلال تغيير التنسيق أو بدء نشاط جديد.
في الإصدار 4.4 من نظام التشغيل Android (المستوى 19 لواجهة برمجة التطبيقات) والإصدارات الأحدث، يمكنك استخدام إطار عمل الانتقالات لإنشاء رسوم متحركة عند تبديل التنسيق ضمن النشاط أو الجزء الحالي. ما عليك سوى تحديد تنسيقَي البداية والنهاية ونوع المؤثر المتحرك الذي تريد استخدامه. بعد ذلك، يحدّد النظام وينفّذ أثرًا متحركًا بين التنسيقَين. يمكنك استخدام هذه الطريقة لاستبدال واجهة المستخدم بالكامل أو لنقل بعض طرق العرض أو استبدالها فقط.
على سبيل المثال، عندما ينقر المستخدم على عنصر للاطّلاع على مزيد من المعلومات، يمكنك استبدال التنسيق بتفاصيل العنصر، مع تطبيق انتقال مثل الانتقال الموضَّح في الشكل 5.
يتم تخزين تنسيقَي البداية والنهاية في ملف
Scene، على الرغم من أنّه يتم تحديد المشهد الأول عادةً
تلقائيًا من التنسيق الحالي. يمكنك إنشاء Transition لإخبار النظام بنوع الصورة المتحركة الذي تريده، ثم استدعاء TransitionManager.go()
ويشغِّل النظام الصورة المتحركة لتبديل التنسيقات.
لمزيد من المعلومات، اطّلِع على مقالة إضافة تأثيرات متحركة إلى تغييرات التنسيق باستخدام انتقال. للحصول على نموذج للرمز، يمكنك الاطّلاع على BasicTransition .
أضِف تأثيرات متحركة بين الأنشطة
في الإصدار 5.0 من نظام التشغيل Android (المستوى 21 من واجهة برمجة التطبيقات) والإصدارات الأحدث، يمكنك أيضًا إنشاء صور متحركة تؤدي إلى التحوّل بين الأنشطة. ويستند هذا إلى نفس إطار العمل الانتقالي الموضح في القسم السابق، ولكنه يتيح لك إنشاء رسوم متحركة بين التنسيقات في أنشطة منفصلة.
يمكنك تطبيق رسوم متحركة بسيطة مثل تمرير النشاط الجديد من الجانب أو تلاشيه، ولكن يمكنك أيضًا إنشاء رسوم متحركة تنتقل بين طرق العرض المشتركة في كل نشاط. على سبيل المثال، عندما ينقر المستخدم على عنصر للاطّلاع على مزيد من المعلومات، يمكنك الانتقال إلى نشاط جديد باستخدام صورة متحركة تؤدي إلى تكبير هذا العنصر بسلاسة لملء الشاشة، مثل الصورة المتحركة الموضّحة في الشكل 5.
كالعادة، يمكنك استدعاء
startActivity()،
ولكن عليك تمرير حِزمة من الخيارات المقدَّمة من
ActivityOptions.makeSceneTransitionAnimation().
قد تتضمّن حزمة الخيارات هذه طرق العرض التي تتم مشاركتها بين
الأنشطة حتى يتمكّن إطار العمل الانتقالي من ربطها أثناء عرض الصورة المتحركة.
للحصول على مراجع إضافية، يُرجى الاطّلاع على: