अनुमानित बैक ऐनिमेशन के लिए सहायता जोड़ें

सिस्टम बैक एपीआई का इस्तेमाल करते समय, इन-ऐप्लिकेशन ऐनिमेशन पाने के लिए ऑप्ट-इन किया जा सकता है और कस्टम ट्रांज़िशन का इस्तेमाल करना चाहिए.

वीडियो: प्रेडिक्टिव बैक ऐनिमेशन

ऑप्ट-इन करने के बाद, आपका ऐप्लिकेशन घर पर होने के दौरान, क्रॉस-ऐक्टिविटी, और अन्य बातचीत के लिए ऐनिमेशन दिखाता है साथ ही, एक साथ कई काम करना.

कॉन्टेंट कॉम्पोनेंट की डिपेंडेंसी को एमडीसी के v1.10.0 वर्शन पर भी अपग्रेड किया जा सकता है Android को, नीचे दिए गए मटीरियल कॉम्पोनेंट वाले ऐनिमेशन मिलेंगे:

GitHub पर मटीरियल कॉम्पोनेंट डेवलपर के लिए दिशा-निर्देश देखें ज़्यादा जानकारी देखें.

इस वीडियो में, पुराने ऐनिमेशन के पुराने ऐनिमेशन का छोटा सा उदाहरण दिखाया गया है Android Settings ऐप्लिकेशन का इस्तेमाल करके, क्रॉस-ऐक्टिविटी और बैक-टू-होम का इस्तेमाल करने की सुविधा देता है.

  1. ऐनिमेशन में उपयोगकर्ता पिछली सेटिंग पर वापस जाने के लिए पीछे की ओर स्वाइप करता है स्क्रीन—क्रॉस-ऐक्टिविटी ऐनिमेशन का उदाहरण.
  2. अब पिछली स्क्रीन पर, उपयोगकर्ता दूसरी बार स्वाइप करना शुरू करता है, वॉलपेपर के साथ होम स्क्रीन का पूर्वावलोकन दिखाता है—उदाहरण के लिए का ऐनिमेशन भी बनाया जा सकता है.
  3. उपयोगकर्ता, स्क्रीन पर दाईं ओर स्वाइप करके, विंडो का ऐनिमेशन दिखा रहा है छोटा करके होम स्क्रीन पर मौजूद आइकॉन तक.
  4. उपयोगकर्ता अब पूरी तरह से होम स्क्रीन पर वापस आ गया है.

बैक जेस्चर का सुझाव देने वाली सुविधा जोड़ने के तरीके के बारे में ज़्यादा जानें.

कस्टम इन-ऐप्लिकेशन ट्रांज़िशन और ऐनिमेशन जोड़ें

इन-ऐप्लिकेशन प्रॉपर्टी में, अपनी पसंद के मुताबिक ऐनिमेशन और ट्रांज़िशन बनाए जा सकते हैं क्रॉस-ऐक्टिविटी ऐनिमेशन और प्रेडिक्टिव के साथ कस्टम क्रॉस-फ़्रैगमेंट ऐनिमेशन का इस्तेमाल करें.

प्रोग्रेस एपीआई का इस्तेमाल करके, कस्टम ट्रांज़िशन जोड़ें

AndroidX Activity 1.8.0-alpha01 या इसके बाद के वर्शन के साथ, आप प्रेडिक्टिव बैक का इस्तेमाल कर सकते हैं प्रोग्रेस एपीआई, जिनके लिए कस्टम ऐनिमेशन तैयार करना है पिछले पेज पर वापस जाने के जेस्चर की सुविधा. प्रोग्रेस एपीआई, ऐनिमेट करने में मदद करता है व्यू, लेकिन फ़्रैगमेंट के बीच ट्रांज़िशन को ऐनिमेट करने की सीमाएं तय होती हैं. इतने समय में OnBackPressedCallback हमने यह फ़ैसला लिया है handleOnBackProgressed, handleOnBackCancelled और handleOnBackStarted स्क्रीन पर वापस स्वाइप करने पर ऑब्जेक्ट को ऐनिमेट करने के तरीके. इन तरीकों का इस्तेमाल तब करें, जब सिस्टम से मिले डिफ़ॉल्ट ऐनिमेशन के अलावा, ज़्यादा से ज़्यादा ऐनिमेशन को पसंद के मुताबिक बनाने की ज़रूरत हो या मटीरियल कॉम्पोनेंट ऐनिमेशन.

हमें उम्मीद है कि ज़्यादातर ऐप्लिकेशन, पुराने सिस्टम के साथ काम करने वाले AndroidX API का इस्तेमाल करेंगे. हालांकि, कुछ ऐप्लिकेशन ऐसे हैं साथ ही, एपीआई की मदद से, OnBackAnimationCallback ऐसा इंटरफ़ेस उपलब्ध है जिसे Android 14 Developer Preview 1 और इसके बाद के वर्शन में टेस्ट किया जा सकता है.

AndroidX ट्रांज़िशन के साथ प्रोग्रेस एपीआई का इस्तेमाल करना

प्रोग्रेस एपीआई का इस्तेमाल AndroidX ट्रांज़िशन 1.5.0-alpha01 या इसके बाद वाले वर्शन के साथ किया जा सकता है इस्तेमाल करें.

  1. इसके बजाय, TransitionManager#controlDelayedTransition का इस्तेमाल करें इस तौर पर ट्रांज़िशन चलाने के लिए beginDelayedTransition जब उपयोगकर्ता पीछे की ओर स्वाइप करता है.
  2. handleOnBackStarted में ट्रांज़िशन बनाएं.
  3. handleOnBackProgressed में, बैक इवेंट के साथ ट्रांज़िशन चलाएं BackEvent.progress से currentFraction से जुड़ी जानकारी जिससे पता चलता है कि कितनी दूर तक जब उपयोगकर्ता ने पीछे की ओर स्वाइप किया हो.
  4. उपयोगकर्ता के पिछले जेस्चर का इस्तेमाल करने के बाद, ट्रांज़िशन पूरा करें handleOnBackPressed.
  5. आखिर में, handleOnBackCancelled में ट्रांज़िशन की स्थिति रीसेट करें.

नीचे दिए गए वीडियो, Kotlin कोड, और एक्सएमएल में कस्टम ट्रांज़िशन को दिखाया गया है 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 ट्रांज़िशन के साथ, अनुमानित बैक ट्रांज़िशन की सुविधा काम करती है. लेकिन फ़्रेमवर्क ट्रांज़िशन के साथ नहीं. हमारा सुझाव है कि आप फ़्रेमवर्क से बाहर माइग्रेट करें ट्रांज़िशन हैं.
  • अनुमानित बैक ट्रांज़िशन की सुविधा, Android 14 और इसके बाद के वर्शन वाले डिवाइसों पर काम करती है भी ज़्यादा हो सकते हैं और पुराने सिस्टम के साथ काम नहीं कर सकते.
  • एक्सएमएल सीन की मदद से बनाए गए ट्रांज़िशन भी काम करते हैं. तय सीमा में handleOnBackStarted, नतीजे के लिए TransitionSeekController सेट करें इसके नतीजे के बजाय TransitionManager.createSeekController का controlDelayedTransition.

Android 14 और इसके बाद के वर्शन पर, अपनी पसंद के मुताबिक गतिविधि का ट्रांज़िशन जोड़ना

यह पक्का करने के लिए कि कस्टम गतिविधि ट्रांज़िशन, Android 14 पर प्रिडिक्टिव बैक के साथ काम करते हैं और बाद के वर्शन का इस्तेमाल करना है, तो आप इसके बजाय overrideActivityTransition का इस्तेमाल कर सकते हैं overridePendingTransition. इसका मतलब है कि ट्रांज़िशन ऐनिमेशन इस तरह से चलता है जब उपयोगकर्ता पीछे की ओर स्वाइप करता है.

यह कैसे काम कर सकता है, इसका उदाहरण देने के लिए एक ऐसी स्थिति की कल्पना करें जिसमें पिछली गतिविधि में, गतिविधि B को गतिविधि A के ऊपर दिखाया गया है. आपके पास कस्टम गतिविधि के ऐनिमेशन को इस तरह से दिखाया गया है:

  • गतिविधि B के onCreate में, ट्रांज़िशन के किसी भी हिस्से को चालू या बंद करने के लिए कॉल करें तरीका.
  • जब उपयोगकर्ता गतिविधि B पर जाए, तो OVERRIDE_TRANSITION_OPEN का इस्तेमाल करें. टास्क कब शुरू होगा जब उपयोगकर्ता गतिविधि A पर वापस जाने के लिए स्वाइप करता है, तो OVERRIDE_TRANSITION_CLOSE.
  • OVERRIDE_TRANSITION_CLOSE को तय करने पर, enterAnim, गतिविधि A की होती है ऐनिमेशन डालें और exitAnim, गतिविधि B का एग्ज़िट ऐनिमेशन है.

फ़्रैगमेंट वाले अनुमानित बैक के लिए सहायता जोड़ें

फ़्रैगमेंट के साथ अनुमानित बैक को लागू करने के दो तरीके हैं.

मौजूदा एपीआई का इस्तेमाल करें

हमारा सुझाव है कि आप मौजूदा एपीआई का इस्तेमाल करें. इन एपीआई की मदद से, आपको अलग-अलग प्लैटफ़ॉर्म के बगल में आपके Animator या Androidx ट्रांज़िशन में बदलाव करने के लिए, हाथ के जेस्चर. हाथ के जेस्चर को थ्रेशोल्ड से बाहर ले जाने पर, यह तय होता है कि जेस्चर पूरा हो जाता है और आप पिछले फ़्रैगमेंट पर वापस आ जाते हैं या उसे रद्द कर दिया जाता है और आप मौजूदा फ़्रैगमेंट पर बने रहें. ज़्यादा जानकारी के लिए, यह देखें ऐनिमेशन का इस्तेमाल करके फ़्रैगमेंट के बीच नेविगेट करें.

इन बातों का ध्यान रखें:

  • आयात करें ट्रांज़िशन 1.5.0 या बाद में और फ़्रैगमेंट 1.7.0 या बाद में. फ़्रैगमेंट में ज़्यादातर अनुमानित बैक सपोर्ट इन पर निर्भर करता है ऐनिमेशन खोजने में ट्रांज़िशन करना. ऐसा सिर्फ़ 1.5.0 या उसके बाद के वर्शन.
  • फ़्रैगमेंट का इस्तेमाल करें, जैसे कि FragmentManager या पिछली गतिविधियों को मैनेज करने के लिए, नेविगेशन कॉम्पोनेंट. अनुमानित अपनी पिछली गतिविधियों को मैनेज करने पर, 'वापस जाएं' सुविधा काम नहीं करती.
  • कुछ लाइब्रेरी में, प्रिडिक्टिव बैक सपोर्ट शामिल होता है. कोई दस्तावेज़ चुनें ज़रूर.
  • Animator क्लास और AndroidX Transition लाइब्रेरी समर्थित हैं.
  • Animation क्लास और फ़्रेमवर्क Transition लाइब्रेरी का इस्तेमाल नहीं किया जा सकता.
  • अनुमानित ऐनिमेशन, सिर्फ़ Android 14 या उसके बाद के वर्शन पर काम करने वाले डिवाइसों पर काम करते हैं.

इन स्थितियों में अनुमानित बैक क्रॉस-फ़्रैगमेंट का इस्तेमाल करें:

कुछ भौतिक गति इस तारीख के हिसाब से अनुमानित विज्ञापन दिखाने की सुविधा को चालू करें 1.12.02-alpha02 या उससे ज़्यादा. इसमें MaterialFadeThrough, MaterialSharedAxis और MaterialFade. ध्यान दें कि MaterialContainerTransform पर, अनुमान लगाने की सुविधा काम नहीं करती वापस.

कॉलबैक का इस्तेमाल करना

कॉलबैक का इस्तेमाल करके, क्रॉस-फ़्रैगमेंट ट्रांज़िशन बनाया जा सकता है. हालांकि, कॉलबैक का इस्तेमाल करते समय लागू सीमा, जहां उपयोगकर्ता पिछली कार्रवाई नहीं देख सकते फ़्रैगमेंट. क्रॉस-फ़्रैगमेंट शेयर किए गए एलिमेंट ट्रांज़िशन बनाने के लिए जो अनुमानित वापस से मेल खाता हो डिज़ाइन दिशा-निर्देश के साथ-साथ, फ़ॉलो किया जा रहा है:

OnBackPressedCallback बनाएं. handleOnBackProgressed के अंदर, स्केल और फ़्रैगमेंट को बदलें. इसके बाद, बैक स्टैक से पॉप-अप करें. इसके बाद, शेयर किए गए एलिमेंट को चलाएं कॉलबैक के बाहर setSharedElementReturnTransition का इस्तेमाल करके ट्रांज़िशन करें.

ज़्यादा जानकारी के लिए, GitHub पर कोड सैंपल देखें.

ज़रूरी शर्तें

नीचे दी गई टेबल का इस्तेमाल करके जानें कि डेवलपर के लिए सेटिंग और टूल किस तरह के होते हैं, targetSdkVersion और compileSdkVersion, डिवाइस का वर्शन, डिपेंडेंसी, और फ़्रैगमेंट फ़्लैग. पहली टेबल में, कोड से जुड़ी शर्तों की जानकारी दी गई है.

कैटगरी ऐनिमेशन कंपाइल्डके टारगेटएसडीके android:enableOnBackInvokedCallback निर्भर है
सिस्टम के ऐनिमेशन घर वापसी 33 कोई भी सही कोई नहीं
क्रॉस-ऐक्टिविटी 34 कोई भी सही कोई नहीं
क्रॉस-टास्क 34 कोई भी सही कोई नहीं
प्लैटफ़ॉर्म कस्टम क्रॉस-ऐक्टिविटी 34 कोई भी सही कोई नहीं
प्रोग्रेस एपीआई प्लैटफ़ॉर्म 34 कोई भी सही कोई नहीं
मटीरियल कॉम्पोनेंट बॉटम शीट 34 कोई भी सही मटीरियल कॉम्पोनेंट 1.10.0
साइड शीट 34 कोई भी सही मटीरियल कॉम्पोनेंट 1.10.0
नेविगेशन पैनल 34 कोई भी सही मटीरियल कॉम्पोनेंट 1.10.0
खोजें 34 कोई भी सही मटीरियल कॉम्पोनेंट 1.10.0
जेटपैक के ऐनिमेशन पसंद के मुताबिक बनाया गया AndroidX क्रॉस-फ़्रैगमेंट 34 कोई भी सही AndroidX फ़्रैगमेंट 1.7
कस्टम AndroidX ट्रांज़िशन 34 कोई भी सही AndroidX ट्रांज़िशन 1.5
प्रोग्रेस एपीआई जेटपैक 34 कोई भी सही AndroidX गतिविधि 1.8

नीचे दी गई टेबल में उन शर्तों के बारे में बताया गया है जिनके तहत उपयोगकर्ताओं को ऐनिमेशन देखने की अनुमति मिलती है.

कैटगरी ऐनिमेशन डेवलपर विकल्प चालू किया गया डिवाइस का वर्शन
सिस्टम के ऐनिमेशन घर वापसी सही 33
क्रॉस-ऐक्टिविटी सही 34
क्रॉस-टास्क सही 34
प्लैटफ़ॉर्म कस्टम क्रॉस-ऐक्टिविटी सही 34
प्रोग्रेस एपीआई प्लैटफ़ॉर्म गलत 34
मटीरियल कॉम्पोनेंट बॉटम शीट गलत 34
साइड शीट गलत 34
नेविगेशन पैनल गलत 34
खोजें गलत 34
जेटपैक के ऐनिमेशन पसंद के मुताबिक बनाया गया AndroidX क्रॉस-फ़्रैगमेंट गलत 34
कस्टम AndroidX ट्रांज़िशन गलत 34
प्रोग्रेस एपीआई जेटपैक गलत 34

अतिरिक्त संसाधन