Conceptos básicos de animación de Android: animación de atributos

Prefacio

La animación de atributo es una característica recién agregada de API 11. A diferencia de la animación de vista, expande el objeto activo, la animación de atributo puede animar cualquier objeto, o incluso ningún objeto. La animación de propiedades puede animar las propiedades de cualquier objeto, no solo Ver. El intervalo de tiempo predeterminado de la animación es 300 ms y la velocidad de fotogramas predeterminada es 10 ms / fotograma. El efecto que puede lograr es completar el cambio de un objeto de un valor de atributo a otro dentro de un intervalo de tiempo. La biblioteca de animación de código abierto nineoldandroids es compatible con sistemas anteriores a API 11.

Varias clases de animación de uso común son: ValueAnimator , ObjectAnimator , AnimatorSet , donde ObjectAnimator hereda de ValueAnimator, y AnimatorSet es una colección de animación que puede definir un grupo de animaciones.

ObjectAnimator

ObjectAnimator es la clase de implementación más importante en el marco de animación de atributos. Para crear un ObjectAnimator, solo necesita devolver directamente un objeto ObjectAnimator a través de su clase de fábrica estática. Los parámetros incluyen: un objeto y el nombre de la propiedad del objeto, pero esta propiedad debe tener funciones get y set. La función set se llama internamente para modificar el valor de la propiedad del objeto a través del mecanismo de reflexión de Java. También puede llamar a setInterpolator para configurar el interpolador correspondiente.

  • Panorámica
val transObj=ObjectAnimator.ofFloat(btn,"translationY",btn.height.toFloat())
transObj.repeatCount=10
transObj.start()

Efecto :
Inserte la descripción de la imagen aquí

  • Animación de transparencia
val colorAnim=ObjectAnimator.ofInt(btn,"backgroundColor",0xFFFF8080.toInt(),0xFF8080FF.toInt())
colorAnim.duration=3000
colorAnim.repeatMode=ValueAnimator.REVERSE
colorAnim.repeatCount=ValueAnimator.INFINITE
colorAnim.setEvaluator(ArgbEvaluator())
colorAnim.start()

efecto:
Inserte la descripción de la imagen aquí

AnimatorSet

val set=AnimatorSet()
val colorAnim=ObjectAnimator.ofInt(btn,"backgroundColor",0xFFFF8080.toInt(),0xFF8080FF.toInt(),0xFFFF8080.toInt())

val rotateAnimatorX=ObjectAnimator.ofFloat(btn,"rotationX",0f,360f,0f)
val rotateAnimatorY=ObjectAnimator.ofFloat(btn,"rotationY",0f,180f,0f)

val translationAnimatorX=ObjectAnimator.ofFloat(btn,"translationX",0f,90f,0f)
val translationAnimatorY=ObjectAnimator.ofFloat(btn,"translationY",0f,90f,0f)

val scaleAnimatorX=ObjectAnimator.ofFloat(btn,"scaleX",1f,1.5f,1f)
val scaleAnimatorY=ObjectAnimator.ofFloat(btn,"scaleY",1f,0.5f,1f)

val alpha=ObjectAnimator.ofFloat(btn,"alpha",1f,0.25f,1f)
//使用playTogether
set.playTogether(rotateAnimatorX,rotateAnimatorY,translationAnimatorX,translationAnimatorY,scaleAnimatorX,scaleAnimatorY,alpha,colorAnim)
// 使用 after()、before()、with() 方法
set.play(colorAnim).with(rotateAnimatorY).with(translationAnimatorY).with(alpha).after(scaleAnimatorY)

set.duration=5000 
set.reverse()
set.start()

Efecto:
Use el efecto playTogether
Inserte la descripción de la imagen aquí
Use after (), before (), with () método efectos:
Inserte la descripción de la imagen aquí

método

  • Varios efectos de animación en el conjunto playTogether (Animator ... items) set set se ejecutan simultáneamente
  • después (Animator anim)
    inserta una animación existente en la animación entrante para ejecutar
  • después (retraso prolongado) retrasa
    la animación existente durante milisegundos especificados antes de la ejecución
  • antes (Animator anim)
    inserte la animación existente en la animación entrante antes de la ejecución
  • con (Animator anim)
    ejecuta la animación existente y la animación entrante al mismo tiempo

PropertyValuesHolder

En la animación de propiedades, si desea utilizar varias animaciones al mismo tiempo para varias propiedades del mismo objeto, puede utilizar PropertyValuesHolder para lograr

 val pvh1 = PropertyValuesHolder.ofFloat("translationX", 300f)
 val pvh2 = PropertyValuesHolder.ofFloat("scaleX", 1f, 0.1f)
 val pvh3 = PropertyValuesHolder.ofFloat("scaleY", 1f, 0.1f)
 ObjectAnimator.ofPropertyValuesHolder(button, pvh1, pvh2, pvh3).setDuration(1000).start()

Efecto :
Inserte la descripción de la imagen aquí

ValueAnimator

ValueAnimator en sí no afecta a ningún objeto, lo que significa que no hay efecto de animación cuando se usa directamente. Puede animar un valor y luego puede monitorear su proceso de animación y modificar el valor de propiedad de nuestro objeto durante el proceso de animación, lo que equivale a animar nuestro objeto.

Ejemplo de desplazamiento digital:

private fun valueAnimEx(btn: Button){
    
    
        val anim=ValueAnimator.ofFloat(0f, 100f)
        anim.addUpdateListener {
    
     animator->
            btn.text="¥${
      
      animator.animatedValue}"
        }
        anim.duration=3000
        anim.interpolator=LinearInterpolator()
        anim.start()
    }

efecto:
Inserte la descripción de la imagen aquí

Animar cualquier propiedad

El principio de la animación de propiedad: la animación de propiedad requiere que el objeto esté animado para proporcionar los métodos get y set de la propiedad. La animación de propiedad llama al método set varias veces con el efecto de la animación de acuerdo con el valor inicial y el valor final de la propiedad. propiedad pasada por el mundo exterior. Los valores pasados ​​al método set no son los mismos. Para ser precisos, a medida que pasa el tiempo, el valor pasado se acerca cada vez más al valor final.

Escenario : agregue una animación al botón para aumentar el ancho del botón al ancho especificado

Solución

  • Agregue métodos get y set a su objeto, si tiene permiso
  • Utilice una clase para envolver el objeto original y proporcionarle indirectamente los métodos set y get
  • Use ValueAnimator para monitorear el proceso de animación e implementar cambios de propiedad por su cuenta

El primer esquema no es factible en la mayoría de los casos, a menos que la premisa sea un permiso, este tipo no se repetirá. La segunda y tercera opciones a continuación

 private fun performAnimate(target: Button,start :Int,end :Int){
    
    
       // 采用ValueAnimator,监听动画过程,自己实现属性的改变
        val valueAnimator=ValueAnimator.ofInt(1,100)
        val mEvaluator=IntEvaluator()

        valueAnimator.addUpdateListener {
    
    animator->
            val fraction=animator.animatedFraction
            target.layoutParams.width=mEvaluator.evaluate(fraction,start,end)
            target.requestLayout()
        }

        valueAnimator.duration=5000
        valueAnimator.start()

        // 用一个类来包装原始对象,间接为其提供set 和get方法
        val viewWrapper=ViewWrapper(target)
        val  objectAnimator=ObjectAnimator.ofInt(viewWrapper,"width",start,end)
        objectAnimator.duration=5000
        objectAnimator.start()
    }
   inner class ViewWrapper{
    
    
        private var viewTarget: View?=null

        constructor(viewTarget: View?) {
    
    
           this.viewTarget = viewTarget
        }

        fun setWidth(width :Int){
    
    
            viewTarget?.layoutParams?.width=width
            viewTarget?.requestLayout()
        }

        fun getWidth():Int?{
    
    
            return viewTarget?.layoutParams?.width
        }
    }

efecto:
Inserte la descripción de la imagen aquí

API relacionada

  • Oyente de animación de propiedad
public static interface AnimatorListener {
    
    
 
     void onAnimationStart(Animator animation);
     
     void onAnimationEnd(Animator animation);
     
     void onAnimationCancel(Animator animation);
     
     void onAnimationRepeat(Animator animation);
 }
 
 public static interface AnimatorUpdateListener {
    
    
 
     void onAnimationUpdate(ValueAnimator animation);
 }
  • Atributos de diseño xml
 // set标签 对应 AnimatorSet
<set xmlns:android="http://schemas.android.com/apk/res/android"
    //together 表示动画集合中子动画同时播放
    //sequentially 表示动画集合中子动画 按照前后顺序依次播放
    android:ordering=["together"|"sequentially"]>

   // animator标签 对应 ValueAnimator
    <animator
        // 表示动画时长
        android:duration="int"
        //表示属性动画作用对象的属性的名称
        android:propertyName="string" 
        // 表示动画的重复 0默认值,-1逆向重复
        android:repeatCount="int"
         // 表示动画的重复模式 reverse逆向重复,restart连续重复
        android:repeatMode=["reverse"|"restart"]
        // 动画延时的时间
        android:startOffset="int"
        // 属性的起始值
        android:valueFrom="float|color|int"
        // 属性的结束值
        android:valueTo="float|color|int"
        // 表示android:propertyName所指定的属性的类型,如果所指定的属性值是颜色
        // 那么不需要指android:valueType,系统会自动对颜色类型的属性做处理
        android:valueType=["intType"|"floatType"]/>

   // objectAnimator标签 对应 ObjectAnimator
    <objectAnimator
        android:duration="int"
        android:propertyName="string"
        android:repeatCount="int"
        android:repeatMode=
        android:startOffset="int"["reverse"|"restart"]
        android:valueFrom="float|color|int"
        android:valueTo="float|color|int"
        android:valueType=["intType"|"floatType"] />
</set>

Supongo que te gusta

Origin blog.csdn.net/xufei5789651/article/details/113316163
Recomendado
Clasificación