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

تجربة طريقة الإنشاء

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);

ضبط السرعة

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

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

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

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

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

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

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

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

ضبط التمارين

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

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

تعرِض هذه الطريقة العنصر الذي تستخدِم صورته المتحركة قيمة الاحتكاك التي توفّرها.

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

يوضح المثال أدناه الانتقال الأفقي. والسرعة المسجَّلة من أداة تتبُّع السرعة هي velocityX، وتم ضبط حدود التمرير على 0 وmax Scroll. تم ضبط قيمة الاحتكاك على 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 لأنّ الحدّ الأدنى للتغيير المرئي يتم استنباطه من الموقع. مثلاً:

• الحد الأدنى التلقائي لقيمة التغيير المرئي هو 1 بكسل لخصائص العرض مثل 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 بكسل.