إتاحة الصور المتحركة القائمة على التوقّعات

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

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

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

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

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

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

يمكنك إنشاء صور متحركة وانتقالات مخصّصة للعناصر داخل التطبيق، وصور متحركة مخصّصة للانتقال بين الأنشطة، وصور متحركة مخصّصة للانتقال بين الأجزاء باستخدام إيماءات الرجوع التوقّعية.

إضافة انتقالات مخصّصة في Jetpack Compose

يمكنك استخدام PredictiveBackHandler للتعامل مع إيماءات الرجوع التوقّعية في Jetpack Compose من أجل إنشاء انتقالات مخصّصة داخل التطبيق. تتوفّر هذه الميزة في الإصدار androidx.activity:activity-compose:1.8.0-alpha01 أو الإصدارات الأحدث.

توفّر PredictiveBackHandler دالة lambda لعمليات معاودة الاتصال تعرض 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
        ) {}
    }
}