نقل طرق العرض باستخدام صورة متحركة سريعة

تجربة طريقة ComposeAllowed

Jetpack Compose هي مجموعة أدوات واجهة المستخدم التي ننصح بها لنظام التشغيل Android. تعرَّف على كيفية استخدام "الصور المتحركة" في Compose.

Spring AnimationSpec →

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

للتعرّف على مواضيع ذات صلة، اطّلِع على الأدلة التالية:

• حركة مستنِدة إلى الفيزياء
• تحريك الحركة باستخدام فيزياء الربيع

إضافة مكتبة AndroidX

لاستخدام الصور المتحركة المستندة إلى الفيزياء، يجب إضافة مكتبة AndroidX إلى مشروعك على النحو التالي:

1. افتح ملف build.gradle الخاص بوحدة تطبيقك.
2. إضافة مكتبة AndroidX إلى قسم dependencies

   رائع

           dependencies {
               implementation 'androidx.dynamicanimation:dynamicanimation:1.0.0'
           }
           

   Kotlin

           dependencies {
               implementation("androidx.dynamicanimation:dynamicanimation:1.0.0")
           }
           

إنشاء صورة متحركة متحرّكة

تتيح لك الفئة FlingAnimation إنشاء صورة متحركة سريعة لأحد العناصر. لإنشاء صورة متحركة سريعة، يمكنك إنشاء مثيل للفئة FlingAnimation وتقديم كائن وسمة الكائن الذي تريد تحريكه.

val fling = FlingAnimation(view, DynamicAnimation.SCROLL_X)

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);

ضبط السرعة

تحدِّد سرعة البدء السرعة التي تتغيّر بها خاصية الصورة المتحركة في بداية الصورة المتحركة. ويتم ضبط سرعة البدء التلقائية على صفر بكسل في الثانية. وبالتالي، عليك تحديد سرعة بدء لضمان عدم انتهاء الصورة المتحركة على الفور.

يمكنك استخدام قيمة ثابتة كسرعة البداية، أو يمكنك تحديدها استنادًا إلى سرعة إيماءة اللمس. إذا اخترت تقديم قيمة ثابتة، عليك تحديد القيمة بالبكسل المضمّنة في الثانية، ثم تحويلها إلى وحدات بكسل في الثانية. من خلال تحديد القيمة بالبكسل دبية في الثانية، تكون السرعة مستقلة عن كثافة الجهاز وعوامل الشكل. لمزيد من المعلومات حول تحويل السرعة الأولية إلى وحدات بكسل في الثانية، راجِع القسم تحويل وحدات بكسل مستقلة الكثافة في الثانية إلى وحدات بكسل في الثانية في صورة متحركة Spring.

لضبط السرعة، يجب استدعاء الطريقة setStartVelocity() وتمرير السرعة بالبكسل في الثانية. تعرض الطريقة الكائن المائل الذي تم تعيين السرعة عليه.

ملاحظة: استخدِم الفئتَين GestureDetector.OnGestureListener وVelocityTracker لاسترداد وحساب سرعة إيماءات اللمس على التوالي.

ضبط نطاق لقيمة الصورة المتحركة

يمكنك ضبط الحد الأدنى والأقصى لقيم الحركة عندما تريد حصر قيمة السمة على نطاق معيّن. يُعدّ عنصر التحكّم هذا في النطاق مفيدًا بشكل خاص عند إضافة تأثيرات حركية إلى سمات ذات نطاق أساسي، مثل ألفا (من 0 إلى 1).

ملاحظة: عندما تصل قيمة الرسم المتحرك المتحرك إلى الحد الأدنى أو الأقصى للقيمة، تنتهي الصورة المتحركة.

لضبط الحدّ الأدنى والأقصى للقيم، اطلب الطريقتَين setMinValue() وsetMaxValue() على التوالي. تُرجع كلتا الطريقتين كائن الرسوم المتحركة الذي تم تعيين القيمة له.

ضبط مدى الاحتكاك

تتيح لك الطريقة setFriction() تغيير معاناة الصورة المتحركة. يحدد مدى سرعة انخفاض السرعة في الرسوم المتحركة.

ملاحظة: إذا لم تضبط الاحتكاك في بداية الصورة المتحركة، ستستخدم الحركة القيمة 1 التلقائية للاحتكاك.

تُرجع الطريقة الكائن الذي تستخدم صورته المتحركة قيمة الاحتكاك التي تقدمها.

نموذج التعليمات البرمجية

يوضح المثال التالي انحدارًا أفقيًا. والسرعة التي تم تسجيلها من أداة تتبُّع السرعة هي velocityX، وتم ضبط حدود الانتقال على 0 وmaxScroll. تم ضبط قيمة الاحتكاك على 1.1.

FlingAnimation(view, DynamicAnimation.SCROLL_X).apply {
    setStartVelocity(-velocityX)
    setMinValue(0f)
    setMaxValue(maxScroll)
    friction = 1.1f
    start()
}

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);
fling.setStartVelocity(-velocityX)
        .setMinValue(0)
        .setMaxValue(maxScroll)
        .setFriction(1.1f)
        .start();

ضبط الحد الأدنى للتغيير المرئي

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

ليس من الضروري استدعاء هذه الطريقة عند تحريك DynamicAnimation.ViewProperty لأنّ الحد الأدنى للتغيير المرئي يتم اشتقاقه من السمة. على سبيل المثال:

• الحد الأدنى التلقائي لقيمة التغيير المرئية هو وحدة بكسل واحدة لسمات الملف الشخصي، مثل TRANSLATION_X وTRANSLATION_Y وTRANSLATION_Z وSCROLL_X وSCROLL_Y.
• بالنسبة إلى الصور المتحركة التي تستخدم التدوير، مثل ROTATION وROTATION_X وROTATION_Y، يكون أقل تغيير مرئي هو MIN_VISIBLE_CHANGE_ROTATION_DEGREES أو 1/10 بكسل.
• بالنسبة إلى الصور المتحركة التي تستخدم التعتيم، سيكون الحد الأدنى للتغيير المرئي هو MIN_VISIBLE_CHANGE_ALPHA، أو 1/256.

لضبط الحد الأدنى للتغيير المرئي لإحدى الصور المتحركة، يمكنك استدعاء طريقة setMinimumVisibleChange() وتمرير إما أحد الحد الأدنى للثوابت المرئية أو قيمة يجب احتسابها لخاصية مخصصة. لمزيد من المعلومات عن احتساب هذه القيمة، يمكنك الرجوع إلى القسم احتساب الحد الأدنى لقيمة التغيير المرئية.

anim.minimumVisibleChange = DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE

anim.setMinimumVisibleChange(DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE);

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

جارٍ حساب الحد الأدنى لقيمة التغيير المرئية

لاحتساب الحد الأدنى لقيمة التغيير المرئية للسمة المخصّصة، استخدِم الصيغة التالية:

الحد الأدنى للتغيير المرئي = نطاق قيمة السمة المخصّصة / نطاق الرسوم المتحركة بالبكسل

على سبيل المثال، تنتقل السمة التي تريد تحريكها من 0 إلى 100. ويتجاوب هذا مع تغيير بمقدار 200 بكسل. وفقًا للصيغة، الحد الأدنى لقيمة التغيير المرئية هو 100 / 200 يساوي 0.5 بكسل.