पहले से मौजूद और पसंद के मुताबिक प्रिडिक्टिव बैक ऐनिमेशन के लिए सहायता जोड़ना

अगर आपने पहले ही अपने ऐप्लिकेशन को नए सिस्टम बैक एपीआई पर माइग्रेट कर लिया है, तो ऐप्लिकेशन में ऐनिमेशन अपने-आप पाने के लिए, अनुमानित बैक ट्रांज़िशन के लिए ऑप्ट-इन किया जा सकता है. साथ ही, कस्टम ट्रांज़िशन की सुविधा भी इस्तेमाल की जा सकती है.

ऐप्लिकेशन में पहले से मौजूद ऐनिमेशन के लिए सहायता जोड़ना

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

ऑप्ट-इन करने के बाद, आपका ऐप्लिकेशन होम स्क्रीन पर वापस जाने, एक गतिविधि से दूसरी गतिविधि पर जाने, और एक टास्क से दूसरे टास्क पर जाने के लिए ऐनिमेशन दिखाता है.

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

ज़्यादा जानकारी के लिए, GitHub पर मौजूद, मेटल कॉम्पोनेंट के लिए डेवलपर गाइड देखें.

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

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

अनुमानित बैकअप की सुविधा के बारे में ज़्यादा जानें.

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

इनका इस्तेमाल करके, कस्टम इन-ऐप्लिकेशन प्रॉपर्टी ऐनिमेशन और ट्रांज़िशन बनाए जा सकते हैं प्रोग्रेस एपीआई और कस्टम क्रॉस-ऐक्टिविटी ऐनिमेशन का तरीका overrideActivityTransition.

Progress API का इस्तेमाल करके कस्टम ट्रांज़िशन जोड़ना

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

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

AndroidX ट्रांज़िशन के साथ Progress API का इस्तेमाल करना

Android 14 और इसके बाद के वर्शन पर, अनुमानित बैक ट्रांज़िशन बनाने के लिए, Progress API का इस्तेमाल AndroidX Transitions 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 को controlDelayedTransition के नतीजे के बजाय, TransitionManager.createSeekController के नतीजे पर सेट करें.

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 का एग्ज़िट ऐनिमेशन है.