يتيح هذا الخيار إمكانية عرض صور متحركة مدمَجة ومخصّصة مستندة إلى التوقّعات.

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

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

فيديو: صور متحركة توقّعية في الخلف

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

يمكنك أيضًا ترقية اعتمادية مكونات المواد إلى الإصدار 1.10.0 من MDC Android للحصول على صور متحركة لمكونات مادية مثل ما يلي:

يمكنك الاطّلاع على إرشادات مطوّري مكونات المواد على GitHub للحصول على مزيد من المعلومات.

يعرض الفيديو مثالاً موجزًا لصور متحركة تنبؤية للظهر من أجل النشاط المتبادل والعودة إلى المنزل باستخدام تطبيق "إعدادات Android".

  1. في الرسوم المتحركة، يمرر المستخدم سريعًا للخلف للعودة إلى شاشة الإعدادات السابقة - مثال على رسم متحرك متعدد الأنشطة.
  2. الآن على الشاشة السابقة، يبدأ المستخدم بالتمرير مرة أخرى مرة أخرى، مع عرض معاينة للشاشة الرئيسية مع خلفيتها - مثال على الرسوم المتحركة للعودة إلى الصفحة الرئيسية.
  3. يستمر المستخدم بالتمرير السريع إلى اليمين، مع عرض صورة متحركة للنافذة تتقلص إلى الأيقونة الموجودة على الشاشة الرئيسية.
  4. عاد المستخدم الآن بالكامل إلى الشاشة الرئيسية.

يمكنك الاطّلاع على مزيد من المعلومات حول إتاحة استخدام عبارات البحث المقترحة.

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

يمكنك إنشاء صور متحركة وانتقالات مخصّصة داخل التطبيق داخل التطبيق باستخدام طريقة Progress API وطريقة إنشاء الصور المتحركة المخصَّصة على جميع الأنشطة overrideActivityTransition.

إضافة عمليات انتقال مخصّصة باستخدام Progress API

في الإصدار 1.8.0-alpha01 أو الإصدارات الأحدث من نظام التشغيل AndroidX، يمكنك استخدام واجهات برمجة تطبيقات التقدم التنبؤية لتطوير رسوم متحركة مخصَّصة لإيماءة الرجوع إلى الخلف في تطبيقك. ضمن OnBackPressedCallback طرحنا طرق handleOnBackProgressed وhandleOnBackCancelled و handleOnBackStarted لتحريك العناصر أثناء تمرير المستخدم سريعًا للخلف. استخدم هذه الطرق إذا كنت بحاجة إلى شيء أكثر تخصيصًا من الرسوم المتحركة الافتراضية التي توفرها الرسوم المتحركة الجديدة للنظام أو الرسوم المتحركة لمكونات Material.

نتوقّع أن تستخدم معظم التطبيقات واجهات برمجة تطبيقات AndroidX المتوافقة مع الأنظمة القديمة، ولكن تتوفّر أيضًا واجهات برمجة تطبيقات مماثلة للأنظمة الأساسية في واجهة OnBackAnimationCallback متاحة للاختبار في إصدار "معاينة المطوِّر" 1 من نظام التشغيل Android 14 والإصدارات الأحدث.

استخدام واجهات برمجة تطبيقات التقدم مع عمليات النقل من AndroidX

يمكن استخدام واجهات برمجة تطبيقات التقدم مع إصدارات AndroidX Transitions 1.5.0-alpha01 أو الإصدارات الأحدث من نظام التشغيل Android 14 والإصدارات الأحدث لإنشاء الانتقالات التنبئية للخلف.

  1. يمكنك استخدام TransitionManager#controlDelayedTransition بدلاً من beginDelayedTransition لتشغيل الانتقالات أثناء تمرير المستخدم سريعًا للخلف.
  2. إنشاء عملية النقل ضمن handleOnBackStarted.
  3. يمكنك تشغيل عملية الانتقال مع الحدث الخلفي في handleOnBackProgressed من خلال ربط currentFraction بالحدث BackEvent.progress الذي يعرض المسافة التي مرّ بها المستخدم للخلف.
  4. يجب إكمال عملية النقل بعد تنفيذ المستخدم إيماءة الرجوع في handleOnBackPressed.
  5. وأخيرًا، عليك إعادة ضبط حالة النقل في غضون handleOnBackCancelled.

يوضّح الفيديو التالي ورمز Kotlin وXML انتقالاً مخصّصًا بين مربّعَين تم تنفيذهما باستخدام OnBackPressedCallback:

class MyFragment : Fragment() {

    val transitionSet = TransitionSet().apply {
        addTransition(Fade(Fade.MODE_OUT))
        addTransition(ChangeBounds())
        addTransition(Fade(Fade.MODE_IN))
    }
    ...
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        val callback = object : OnBackPressedCallback(enabled = false) {

            var controller: TransitionSeekController? = null

            @RequiresApi(34)
            override fun handleOnBackStarted(backEvent: BackEvent) {
                // Create the transition
                controller = TransitionManager.controlDelayedTransition(
                    binding.card,
                    transitionSet
                )
                changeTextVisibility(ShowText.SHORT)
            }

            @RequiresApi(34)
            override fun handleOnBackProgressed(backEvent: BackEvent) {
                // Play the transition as the user swipes back
                if (controller?.isReady == true) {
                    controller?.currentFraction = backEvent.progress
                }
            }

            override fun handleOnBackPressed() {
                // Finish playing the transition when the user commits back
                controller?.animateToEnd()
                this.isEnabled = false
            }

            @RequiresApi(34)
            override fun handleOnBackCancelled() {
                // If the user cancels the back gesture, reset the state
                transition(ShowText.LONG)
            }
        }

        binding.shortText.setOnClickListener {
            transition(ShowText.LONG)
            callback.isEnabled = true
        }

        this.requireActivity().onBackPressedDispatcher.addCallback(callback)
    }

    private fun transition(showText: ShowText) {
        TransitionManager.beginDelayedTransition(
            binding.card,
            transitionSet
        )
        changeTextVisibility(showText)
    }

    enum class ShowText { SHORT, LONG }
    private fun changeTextVisibility(showText: ShowText) {
        when (showText) {
            ShowText.SHORT -> {
                binding.shortText.isVisible = true
                binding.longText.isVisible = false
            }
            ShowText.LONG -> {
                binding.shortText.isVisible = false
                binding.longText.isVisible = true
            }
        }
    }
}
<?xml version="1.0" encoding="utf-8"?>
...
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/card"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        ...>

        <TextView
            android:id="@+id/short_text"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            ... />

        <TextView
            android:id="@+id/long_text"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:visibility="gone"
            .../>

    </androidx.constraintlayout.widget.ConstraintLayout>

لاحظ ما يلي عند التعامل مع الانتقالات التنبؤية إلى الخلف:

  • استخدِم isSeekingSupported للتأكّد مما إذا كانت عملية النقل متوافقة مع "إيماءة إظهار شاشة الرجوع".
  • يمكنك إلغاء isSeekingSupported لعرض "صحيح" لعمليات النقل المخصّصة.
  • يمكنك إنشاء وحدة تحكُّم واحدة لكل صورة متحركة.
  • إنّ عمليات الانتقال إلى الخلف التنبؤية متوافقة مع عمليات انتقال AndroidX، ولكن ليس مع انتقالات إطار العمل. لذا ننصح بالابتعاد عن الانتقالات ضمن أُطر العمل
  • تتوفّر عمليات الانتقال إلى الخلف التنبؤية على الأجهزة التي تعمل بالإصدار 14 من Android والإصدارات الأحدث، وهي غير متوافقة مع الأنظمة القديمة.
  • تتوفّر أيضًا الانتقالات التي تم إنشاؤها باستخدام مشاهد XML. في handleOnBackStarted، اضبط TransitionSeekController على نتيجة TransitionManager.createSeekController بدلاً من نتيجة controlDelayedTransition.

إضافة عمليات انتقال مخصّصة للأنشطة على نظام التشغيل Android 14 والإصدارات الأحدث

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

لتقديم مثال حول كيفية عمل ذلك، تخيل سيناريو يكون فيه النشاط "ب" أعلى النشاط "أ" في الحزمة الخلفية. ستتعامل مع الرسوم المتحركة للنشاط المخصص بالطريقة التالية:

  • استدعِ انتقالات الفتح أو الإغلاق ضمن طريقة onCreate في النشاط ب.
  • عندما ينتقل المستخدم إلى النشاط "ب"، استخدم OVERRIDE_TRANSITION_OPEN. عندما يمرر المستخدم سريعًا للرجوع إلى النشاط "أ"، استخدم OVERRIDE_TRANSITION_CLOSE.
  • عند تحديد OVERRIDE_TRANSITION_CLOSE، تكون enterAnim هي حركة الدخول في النشاط "أ" وexitAnim هي حركة الخروج في النشاط "ب".