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

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

पहला वीडियो: पीछे जाने पर झलक दिखाने वाला ऐनिमेशन

इस सुविधा का इस्तेमाल करने पर, आपको होम पेज पर वापस जाने, ऐप्लिकेशन में मौजूद अलग-अलग गतिविधि देखने, और अलग-अलग ऐप्लिकेशन पर काम करने से जुड़े ऐनिमेशन दिखते हैं.

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

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

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

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

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

Jetpack Compose में कस्टम ट्रांज़िशन जोड़ना

ऐप्लिकेशन में अपनी पसंद के मुताबिक ट्रांज़िशन बनाने के लिए, Jetpack Compose में पीछे जाने पर झलक दिखाने की सुविधा को मैनेज करने के लिए, PredictiveBackHandler का इस्तेमाल किया जा सकता है. यह सुविधा androidx.activity:activity-compose:1.8.0-alpha01 या उसके बाद के वर्शन में उपलब्ध है.

PredictiveBackHandler एक कॉलबैक लैम्डा उपलब्ध कराता है. यह Flow<BackEventCompat> को दिखाता है. यह तब इवेंट भेजता है, जब उपयोगकर्ता किनारे से वापस स्वाइप करता है. इन इवेंट से, उपयोगकर्ता के टच की पोज़िशन, स्वाइप एज, और सबसे अहम progress के बारे में जानकारी मिलती है. इसका इस्तेमाल, बैक जेस्चर को हैंडल करने के लिए कॉम्पोनेंट को ऐनिमेट करने के लिए किया जा सकता है.

इस स्निपेट में, PredictiveBackHandler का इस्तेमाल करके Surface को ऐनिमेट करने का एक उदाहरण दिखाया गया है. इसमें, जेस्चर की प्रोग्रेस के साथ-साथ Surface को छोटा किया जा रहा है और दूर ले जाया जा रहा है:

@Composable
fun DetailScreen(onBack: () -> Unit) {
    var scale by remember { mutableFloatStateOf(1f) }
    var xOffset by remember { mutableFloatStateOf(0f) }
    val scope = rememberCoroutineScope()

    PredictiveBackHandler { progressFlow ->
        try {
            progressFlow.collectLatest { backEvent ->
                scale = 1f - backEvent.progress
                xOffset = backEvent.progress * 100f
            }
            // User completed gesture
            onBack()
        } catch (e: CancellationException) {
            // User cancelled gesture
            // Animate scale and xOffset back to 1f and 0f respectively
            scope.launch {
                animate(scale, 1f) { value, _ -> scale = value }
            }
            scope.launch {
                animate(xOffset, 0f) { value, _ -> xOffset = value }
            }
        }
    }
    Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
        Surface(
            modifier = Modifier
                .size(200.dp)
                .scale(scale)
                .offset(x = xOffset.dp, y = 0.dp),
            color = Color.Blue
        ) {}
    }
}