Mueve las vistas con una animación de desplazamiento

Prueba hacerlo con Compose

Jetpack Compose es el kit de herramientas de IU recomendado para Android. Aprende a usar animaciones en Compose.

AnimationSpec de primavera →

La animación basada en gestos de deslizamiento rápido usa una fuerza de fricción que es proporcional a la velocidad de un objeto. Úsala para animar una propiedad de un objeto y finalizar la animación de forma gradual. Tiene un impulso inicial, que se recibe principalmente de la velocidad del gesto, y se ralentiza de forma gradual. La animación finaliza cuando su velocidad es lo suficientemente baja como para que no se produzca ningún cambio visible en la pantalla del dispositivo.

Para obtener más información sobre temas relacionados, consulta las siguientes guías:

• Movimiento basado en la física
• Cómo animar movimiento con física de resortes

Agrega la biblioteca de AndroidX

Para usar las animaciones basadas en la física, debes agregar la biblioteca de AndroidX a tu proyecto de la siguiente manera:

1. Abre el archivo build.gradle del módulo de tu app.
2. Agrega la biblioteca de AndroidX a la sección dependencies.

   Groovy

           dependencies {
               implementation 'androidx.dynamicanimation:dynamicanimation:1.0.0'
           }
           

   Kotlin

           dependencies {
               implementation("androidx.dynamicanimation:dynamicanimation:1.0.0")
           }
           

Cómo crear una animación de desplazamiento

La clase FlingAnimation te permite crear una animación de deslizamiento para un objeto. Para crear una animación de deslizamiento, crea una instancia de la clase FlingAnimation y proporciona un objeto y la propiedad del objeto que quieras animar.

val fling = FlingAnimation(view, DynamicAnimation.SCROLL_X)

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);

Cómo establecer la velocidad

La velocidad inicial define la velocidad a la que cambia una propiedad de animación al principio de la animación. La velocidad inicial predeterminada se establece en cero píxeles por segundo. Por lo tanto, debes definir una velocidad de inicio para asegurarte de que la animación no finalice de inmediato.

Puedes usar un valor fijo como velocidad inicial o basarla en la velocidad de un gesto táctil. Si decides proporcionar un valor fijo, debes definirlo en dp por segundo y, luego, convertirlo en píxeles por segundo. Definir el valor en dp por segundo permite que la velocidad sea independiente de la densidad y los factores de forma de un dispositivo. Para obtener más información sobre cómo convertir la velocidad inicial en píxeles por segundo, consulta la sección Cómo convertir dp por segundo en píxeles por segundo en Animación de resorte.

Para establecer la velocidad, llama al método setStartVelocity() y pasa la velocidad en píxeles por segundo. El método devuelve el objeto de deslizamiento en el que se establece la velocidad.

Nota: Usa las clases GestureDetector.OnGestureListener y VelocityTracker para recuperar y calcular la velocidad de los gestos táctiles, respectivamente.

Cómo establecer un rango de valores de la animación

Puedes establecer los valores de animación mínimo y máximo cuando quieras restringir el valor de la propiedad a un rango determinado. Este control de rango es particularmente útil cuando animas propiedades que tienen un rango intrínseco, como alfa (de 0 a 1).

Nota: Cuando el valor de una animación de deslizamiento rápido alcanza el valor mínimo o máximo, la animación finaliza.

Para establecer los valores mínimo y máximo, llama a los métodos setMinValue() y setMaxValue(), respectivamente. Ambos métodos muestran el objeto de animación para el que estableciste el valor.

Cómo establecer la fricción

El método setFriction() te permite cambiar la fricción de la animación. Este define qué tan rápido se disminuye la velocidad en una animación.

Nota: Si no estableces la fricción al comienzo de la animación, esta usará un valor de fricción predeterminado de 1.

El método devuelve el objeto cuya animación usa el valor de fricción que proporcionas.

Código de muestra

En el siguiente ejemplo, se demuestra un desplazamiento horizontal. La velocidad capturada del seguidor de velocidad es velocityX, y los límites de desplazamiento se establecen en 0 y maxScroll. La fricción se estableció en 1.1.

FlingAnimation(view, DynamicAnimation.SCROLL_X).apply {
    setStartVelocity(-velocityX)
    setMinValue(0f)
    setMaxValue(maxScroll)
    friction = 1.1f
    start()
}

FlingAnimation fling = new FlingAnimation(view, DynamicAnimation.SCROLL_X);
fling.setStartVelocity(-velocityX)
        .setMinValue(0)
        .setMaxValue(maxScroll)
        .setFriction(1.1f)
        .start();

Cómo establecer el cambio mínimo visible

Cuando animas una propiedad personalizada que no está definida en píxeles, debes establecer el cambio mínimo del valor de animación que es visible para los usuarios. Determina un umbral razonable para finalizar la animación.

No es necesario llamar a este método cuando se anima DynamicAnimation.ViewProperty, ya que el cambio visible mínimo se deriva de la propiedad. Por ejemplo:

• El valor predeterminado del cambio visible mínimo es de 1 píxel para las propiedades de la vista, como TRANSLATION_X, TRANSLATION_Y, TRANSLATION_Z, SCROLL_X y SCROLL_Y.
• En el caso de las animaciones que usan rotación, como ROTATION, ROTATION_X y ROTATION_Y, el cambio visible mínimo es MIN_VISIBLE_CHANGE_ROTATION_DEGREES, o 1/10 de píxel.
• En el caso de las animaciones que usan opacidad, el cambio visible mínimo es de MIN_VISIBLE_CHANGE_ALPHA o 1/256.

Para establecer el cambio mínimo visible de una animación, llama al método setMinimumVisibleChange() y pasa una de las constantes mínimas visibles o un valor que debas calcular para una propiedad personalizada. Para obtener más información sobre cómo calcular este valor, consulta la sección Cómo calcular un valor de cambio visible mínimo.

anim.minimumVisibleChange = DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE

anim.setMinimumVisibleChange(DynamicAnimation.MIN_VISIBLE_CHANGE_SCALE);

Nota: Solo debes pasar un valor cuando animas una propiedad personalizada que no está definida en píxeles.

Cómo calcular un valor de cambio mínimo visible

Para calcular el valor de cambio mínimo visible de una propiedad personalizada, usa la siguiente fórmula:

Cambio mínimo visible = Rango del valor de la propiedad personalizada / Rango de la animación en píxeles

Por ejemplo, la propiedad que deseas animar progresa de 0 a 100. Esto corresponde a un cambio de 200 píxeles. Según la fórmula, el valor mínimo de cambio visible es 100 / 200, que equivale a 0.5 píxeles.