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

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

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

فيديو: صور متحركة تظهر فيها توقّعات عند الرجوع إلى الصفحة السابقة

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

يمكنك أيضًا ترقية اعتمادية مكوّنات المواد إلى الإصدار 1.10.0 من MDC. في جهاز Android لتلقّي الصور المتحركة لمكوّنات المواد، على النحو التالي:

اطّلِع على إرشادات مطوّري المكوّنات الأساسية من GitHub لمعرفة المزيد. المعلومات.

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

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

اطّلِع على مزيد من المعلومات حول إتاحة ميزة الرجوع التنبؤي.

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

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

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

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

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

استخدام واجهات برمجة التطبيقات Progress API مع ميزة "الانتقالات في AndroidX"

يمكن استخدام "واجهات برمجة تطبيقات التقدم" مع الإصدار 1.5.0-alpha01 من AndroidX أو الإصدارات الأحدث في نظام التشغيل 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

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

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

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

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