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

تجربة طريقة "الكتابة"

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

Spring AnimationSpec →

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

للاطّلاع على مواضيع ذات صلة، يُرجى قراءة الأدلة التالية:

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

إضافة مكتبة AndroidX

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

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

   Groovy

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

ضبط السرعة

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

يمكنك استخدام قيمة ثابتة كسرعة بدء، أو يمكنك استنادها إلى سرعة إيماءة اللمس. إذا اخترت تقديم قيمة ثابتة، عليك تحديد القيمة بوحدات dp في الثانية، ثم تحويلها إلى وحدات بكسل في الثانية. يسمح تحديد القيمة بوحدة dp في الثانية بأن تكون السرعة مستقلة عن كثافة الجهاز وعوامل الشكل. لمزيد من المعلومات حول تحويل السرعة الابتدائية إلى وحدات بكسل في الثانية، يُرجى الرجوع إلى القسم تحويل وحدات dp في الثانية إلى وحدات بكسل في الثانية في حركة الربيع.

لضبط السرعة، استدعِ الدالة 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 بكسل.