Cómo acceder al progreso de forma manual

El elemento componible PredictiveBackHandler en Jetpack Compose te permite interceptar el gesto de atrás y acceder a su progreso. Puedes reaccionar al gesto de atrás del usuario en tiempo real, creando animaciones o comportamientos personalizados según la distancia que desliza el usuario.

Para usar PredictiveBackHandler, asegúrate de usar androidx.activity:activity:1.6.0 o una versión posterior.

PredictiveBackHandler proporciona un Flow<BackEventCompat> que emite eventos que representan el progreso del gesto de atrás. Cada evento contiene información como la siguiente:

  • progress: Es un valor de número de punto flotante entre 0 y 1 que indica el progreso del gesto de atrás (0 = gesto iniciado, 1 = gesto completado).
  • touchX y touchY: Son las coordenadas X e Y del evento táctil.

En el siguiente fragmento, se muestra el uso básico de PredictiveBackHandler:

PredictiveBackHandler(true) { progress: Flow<BackEventCompat> ->
    // code for gesture back started
    try {
        progress.collect { backEvent ->
            // code for progress
            boxScale = 1F - (1F * backEvent.progress)
        }
        // code for completion
        boxScale = 0F
    } catch (e: CancellationException) {
        // code for cancellation
        boxScale = 1F
        throw e
    }
}

Ejemplo: Integración con un panel lateral de navegación

En este ejemplo, se muestra cómo implementar una animación personalizada en la app con PredictiveBackHandler para crear una interacción fluida con un panel de navegación en respuesta a los gestos de atrás en JetLagged:

Figura 5: Panel lateral de navegación con compatibilidad con el gesto de atrás predictivo

En este ejemplo, se usa PredictiveBackHandler para lo siguiente:

  • Realizar un seguimiento del progreso del gesto de atrás
  • Actualizar el translationX del panel según el progreso del gesto
  • Usar un velocityTracker para abrir o cerrar el panel sin problemas según la velocidad del gesto cuando se completa o cancela