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

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

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

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

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

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

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

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

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

Jetpack Compose में, अपनी पसंद के मुताबिक ट्रांज़िशन जोड़ना

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

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

नीचे दिए गए स्निपेट में, PredictiveBackHandler का इस्तेमाल करके, जेस्चर की प्रोग्रेस के साथ, 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
        ) {}
    }
}