Recursos de animação

Um recurso de animação pode definir um dos dois tipos de animações:

Animação de propriedades
Cria uma animação modificando os valores de propriedade de um objeto em um período definido com um Animator.
Animação de visualizações

É possível fazer dois tipos de animação com o framework para animação de visualizações:

Animação de propriedades

Uma animação definida em XML que modifica propriedades do objeto de destino, como cor do segundo plano ou valor Alfa, por um período definido.

Localização do arquivo:
res/animator/filename.xml
O nome do arquivo é usado como ID de recurso.
Tipo de dados do recurso compilado:
Ponteiro de recurso para um ValueAnimator, ObjectAnimator ou AnimatorSet.
Referência de recurso:
Em código Kotlin ou baseado em Java: R.animator.filename
Em XML: @[package:]animator/filename
Sintaxe:
<set
  android:ordering=["together" | "sequentially"]>

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

    <animator
        android:duration="int"
        android:valueFrom="float | int | color"
        android:valueTo="float | int | color"
        android:startOffset="int"
        android:repeatCount="int"
        android:repeatMode=["restart" | "reverse"]
        android:valueType=["intType" | "floatType"]/>

    <set>
        ...
    </set>
</set>

O arquivo precisa ter um único elemento raiz: <set>, <objectAnimator> ou <valueAnimator>. Você pode agrupar elementos de animação dentro do elemento <set>, incluindo outros elementos <set>.

Elementos:
<set>
Um contêiner que tem outros elementos de animação (<objectAnimator>, <valueAnimator> ou outros elementos <set>). Representa um AnimatorSet.

Você pode especificar tags <set> aninhadas para agrupar melhor as animações. Cada <set> pode definir o próprio atributo ordering.

Atributos:

android:ordering
Palavra-chave. Especifica a ordem de reprodução de animações nesse conjunto.
ValorDescrição
sequentiallyAbrir animações do conjunto em sequência.
together (padrão)Abrir animações do conjunto ao mesmo tempo.
<objectAnimator>
Anima uma propriedade específica de um objeto por um período específico. Representa um ObjectAnimator.

Atributos:

android:propertyName
String. Obrigatório. A propriedade do objeto que será animada, chamada pelo nome. Você pode especificar "alpha" ou "backgroundColor" para um objeto View. Como o elemento objectAnimator não expõe um atributo target, não é possível definir o objeto que será animado na declaração XML. Você precisa inflar seu recurso de animação em XML chamando loadAnimator() e chamar setTarget() para definir o objeto de destino que contém a propriedade.
android:valueTo
flutuante, int ou cor. Obrigatório. O valor em que a propriedade animada termina. As cores são representadas como números hexadecimais de seis dígitos, por exemplo, 333333.
android:valueFrom
flutuante, int ou cor. O valor em que a propriedade animada se inicia. Se não for especificado, a animação vai começar no valor extraído pelo método get da propriedade. As cores são representadas como números hexadecimais de seis dígitos, por exemplo, 333333.
android:duration
int. O tempo em milissegundos da animação. O padrão é de 300 milissegundos.
android:startOffset
int. O atraso da animação em milissegundos depois que start() é chamado.
android:repeatCount
int. Quantas vezes uma animação é repetida. Defina como "-1" para repetir infinitamente ou como um número inteiro positivo. Por exemplo, um valor de "1" significa que a animação vai ser repetida uma vez após a execução inicial, de modo que ela será reproduzida duas vezes no total. O valor padrão é "0", o que significa que não há repetição.
android:repeatMode
int. Como uma animação se comporta quando chega ao final. Para que esse atributo tenha efeito, android:repeatCount precisa ser definido como um número inteiro positivo ou "-1". Defina como "reverse" para que a animação inverta a direção a cada iteração ou como "restart" para fazer com que a animação comece sempre do início.
android:valueType
Palavra-chave. Não especifique esse atributo se o valor for uma cor. O framework da animação gerencia automaticamente valores de cor.
ValorDescrição
intTypeEspecifica que os valores animados são inteiros.
floatType (padrão)Especifica que os valores animados são flutuantes.
<animator>
Executa uma animação por um determinado período. Representa um ValueAnimator.

Atributos:

android:valueTo
flutuante, int ou cor. Obrigatório. O valor em que a animação termina. As cores são representadas como números hexadecimais de seis dígitos, por exemplo, 333333.
android:valueFrom
flutuante, int ou cor. Obrigatório. O valor em que a animação se inicia. As cores são representadas como números hexadecimais de seis dígitos, por exemplo, 333333.
android:duration
int. O tempo em milissegundos da animação. O padrão é de 300 ms.
android:startOffset
int. O atraso da animação em milissegundos depois que start() é chamado.
android:repeatCount
int. Quantas vezes uma animação é repetida. Defina como "-1" para repetir infinitamente ou como um número inteiro positivo. Por exemplo, um valor de "1" significa que a animação vai ser repetida uma vez após a execução inicial, de modo que ela será reproduzida duas vezes no total. O valor padrão é "0", o que significa que não há repetição.
android:repeatMode
int. Como uma animação se comporta quando chega ao final. Para que esse atributo tenha efeito, android:repeatCount precisa ser definido como um número inteiro positivo ou "-1". Defina como "reverse" para que a animação inverta a direção a cada iteração ou como "restart" para fazer com que a animação comece sempre do início.
android:valueType
Palavra-chave. Não especifique esse atributo se o valor for uma cor. O framework da animação gerencia automaticamente valores de cor.
ValorDescrição
intTypeEspecifica que os valores animados são inteiros.
floatType (padrão)Especifica que os valores animados são flutuantes.
Exemplo:

Arquivo XML salvo em res/animator/property_animator.xml:

<set android:ordering="sequentially">
    <set>
        <objectAnimator
            android:propertyName="x"
            android:duration="500"
            android:valueTo="400"
            android:valueType="intType"/>
        <objectAnimator
            android:propertyName="y"
            android:duration="500"
            android:valueTo="300"
            android:valueType="intType"/>
    </set>
    <objectAnimator
        android:propertyName="alpha"
        android:duration="500"
        android:valueTo="1f"/>
</set>

Para executar essa animação, infle os recursos XML no código para um objeto AnimatorSet e defina os objetos de destino para todas as animações antes de iniciar o conjunto. Por conveniência, a chamada de setTarget() define um único objeto de destino para todos os filhos de AnimatorSet. O código abaixo mostra como fazer isso:

Kotlin

val set: AnimatorSet = AnimatorInflater.loadAnimator(myContext, R.animator.property_animator)
    .apply {
        setTarget(myObject)
        start()
    }

Java

AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(myContext,
    R.animator.property_animator);
set.setTarget(myObject);
set.start();
Confira também:

Animação de visualizações

O framework para animação de visualizações oferece suporte para animações de interpolação e de frame a frame, que são declaradas em XML. As próximas seções descrevem como usar os dois métodos.

Animação de interpolação

Uma animação definida em XML que realiza transições em um gráfico, como rotação, esmaecimento, movimentação e alongamento.

Localização do arquivo:
res/anim/filename.xml
O nome do arquivo é usado como ID de recurso.
Tipo de dados do recurso compilado:
Ponteiro de recurso para um Animation.
Referência de recurso:
Em Java: R.anim.filename
Em XML: @[package:]anim/filename
Sintaxe:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@[package:]anim/interpolator_resource"
    android:shareInterpolator=["true" | "false"] >
    <alpha
        android:fromAlpha="float"
        android:toAlpha="float" />
    <scale
        android:fromXScale="float"
        android:toXScale="float"
        android:fromYScale="float"
        android:toYScale="float"
        android:pivotX="float"
        android:pivotY="float" />
    <translate
        android:fromXDelta="float"
        android:toXDelta="float"
        android:fromYDelta="float"
        android:toYDelta="float" />
    <rotate
        android:fromDegrees="float"
        android:toDegrees="float"
        android:pivotX="float"
        android:pivotY="float" />
    <set>
        ...
    </set>
</set>

O arquivo precisa ter um único elemento raiz: um <alpha>, <scale>, <translate>, <rotate> ou <set> que contenha um grupo (ou grupos) de outros elementos de animação (incluindo elementos <set> aninhados).

Elementos:
<set>
Um contêiner que tem outros elementos de animação (<alpha>, <scale>, <translate>, <rotate>) ou outros elementos <set>. Representa um AnimationSet.

Atributos:

android:interpolator
Recurso de interpolação. Um Interpolator para usar na animação. O valor precisa ser uma referência a um recurso que especifique um interpolador, não um nome de classe de interpolador. Há recursos de interpolação padrão disponíveis na plataforma. Você também pode criar seu próprio recurso de interpolação. Consulte a discussão a seguir para saber mais sobre interpoladores.
android:shareInterpolator
Booleano. "true" se você quiser compartilhar o mesmo interpolador entre todos os elementos filhos.
<alpha>
Uma animação de fade-in ou fade-out. Representa um AlphaAnimation.

Atributos:

android:fromAlpha
Ponto flutuante. Compensação de opacidade inicial, em que 0.0 é transparente e 1.0 é opaco.
android:toAlpha
Flutuante. Compensação de opacidade final, em que 0.0 é transparente, e 1.0 é opaco.

Para acessar mais atributos com suporte a <alpha>, consulte a referência da classe Animation. Todos os atributos XML são herdados por esse elemento.

<scale>
Uma animação de redimensionamento. Ao especificar pivotX e pivotY, você define o ponto central da imagem de que ela será aumentada ou diminuída. Por exemplo, se esses valores são 0.0 (canto superior esquerdo), todo o crescimento é para baixo e para a direita. Representa um ScaleAnimation.

Atributos:

android:fromXScale
Ponto flutuante. Compensação de tamanho X inicial, em que 1.0 representa nenhuma mudança.
android:toXScale
Flutuante. Compensação de tamanho X final, em que 1.0 representa nenhuma mudança.
android:fromYScale
Flutuante. Compensação de tamanho Y inicial, em que 1.0 representa nenhuma mudança.
android:toYScale
Flutuante. Compensação de tamanho Y final, em que 1.0 representa nenhuma mudança.
android:pivotX
Flutuante. A coordenada X vai permanecer fixa quando o objeto for dimensionado.
android:pivotY
Flutuante. A coordenada Y permanece fixa quando o objeto é dimensionado.

Para acessar mais atributos com suporte a <scale>, consulte a referência da classe Animation. Todos os atributos XML são herdados por esse elemento.

<translate>
Um movimento vertical e/ou horizontal. Representa um TranslateAnimation. Oferece suporte aos seguintes atributos em qualquer um destes três formatos:
  • Valores de -100 a 100 terminados em "%", indicando uma porcentagem relativa a si mesmo.
  • Valores de -100 a 100 terminados em "%p", indicando uma porcentagem relativa ao elemento pai.
  • Um valor flutuante sem sufixo, indicando um valor absoluto.

Atributos:

android:fromXDelta
Flutuante ou porcentagem. Compensação de X inicial. Definida em pixels relativos à posição normal (como "5"), em porcentagem relativa à largura do elemento (como "5%") ou em porcentagem relativa à largura do elemento pai (como "5%p").
android:toXDelta
Flutuante ou porcentagem. Compensação de X final. Definida em pixels relativos à posição normal (como "5"), em porcentagem relativa à largura do elemento (como "5%") ou em porcentagem relativa à largura do elemento pai (como "5%p").
android:fromYDelta
Flutuante ou porcentagem. Compensação de Y inicial. Definida em pixels relativos à posição normal (como "5"), em porcentagem relativa à altura do elemento (como "5%") ou em porcentagem relativa à altura do elemento pai (como "5%p").
android:toYDelta
Flutuante ou porcentagem. Compensação de Y final. Definida em pixels relativos à posição normal (como "5"), em porcentagem relativa à altura do elemento (como "5%") ou em porcentagem relativa à altura do elemento pai (como "5%p").

Para acessar mais atributos com suporte a <translate>, consulte a referência da classe Animation. Todos os atributos XML são herdados por esse elemento.

<rotate>
Uma animação de rotação. Representa um RotateAnimation.

Atributos:

android:fromDegrees
Ponto flutuante. Posição angular inicial, em graus.
android:toDegrees
Flutuante. Posição angular final, em graus.
android:pivotX
Flutuante ou porcentagem. A coordenada X do centro de rotação. Definida em pixels relativos à borda esquerda do objeto (como "5"), em porcentagem relativa à borda esquerda do objeto (como "5%") ou em porcentagem relativa à borda esquerda do contêiner pai (como "5%p").
android:pivotY
Flutuante ou porcentagem. A coordenada Y do centro de rotação. Definida em pixels relativos à borda de cima do objeto (como "5"), em porcentagem relativa à borda de cima do objeto (como "5%") ou em porcentagem relativa à borda de cima do contêiner pai (como "5%p").

Para acessar mais atributos com suporte a <rotate>, consulte a referência da classe Animation. Todos os atributos XML são herdados por esse elemento.

Exemplo:

Arquivo XML salvo em res/anim/hyperspace_jump.xml:

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set
        android:interpolator="@android:anim/accelerate_interpolator"
        android:startOffset="700">
        <scale
            android:fromXScale="1.4"
            android:toXScale="0.0"
            android:fromYScale="0.6"
            android:toYScale="0.0"
            android:pivotX="50%"
            android:pivotY="50%"
            android:duration="400" />
        <rotate
            android:fromDegrees="0"
            android:toDegrees="-45"
            android:toYScale="0.0"
            android:pivotX="50%"
            android:pivotY="50%"
            android:duration="400" />
    </set>
</set>

O código do aplicativo a seguir ativa a animação em um ImageView e a inicia:

Kotlin

val image: ImageView = findViewById(R.id.image)
val hyperspaceJump: Animation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump)
image.startAnimation(hyperspaceJump)

Java

ImageView image = (ImageView) findViewById(R.id.image);
Animation hyperspaceJump = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
image.startAnimation(hyperspaceJump);
Confira também:

Interpoladores

Um interpolador é um modificador de animação definido em XML que afeta a taxa de mudança em uma animação. Isso permite que os efeitos de animação já existentes sejam acelerados, desacelerados, repetidos, rejeitados etc.

Um interpolador é ativado em um elemento de animação com o atributo android:interpolator. O valor é uma referência a um recurso de interpolação.

Todos os interpoladores disponíveis no Android são subclasses da classe Interpolator. Para cada classe de interpolador, o Android inclui um recurso público que pode ser referenciado para ativar o interpolador em uma animação com o atributo android:interpolator. A tabela abaixo especifica o recurso que será usado para cada interpolador:

Classe do interpoladorID do recurso
AccelerateDecelerateInterpolator @android:anim/accelerate_decelerate_interpolator
AccelerateInterpolator @android:anim/accelerate_interpolator
AnticipateInterpolator @android:anim/anticipate_interpolator
AnticipateOvershootInterpolator @android:anim/anticipate_overshoot_interpolator
BounceInterpolator @android:anim/bounce_interpolator
CycleInterpolator @android:anim/cycle_interpolator
DecelerateInterpolator @android:anim/decelerate_interpolator
LinearInterpolator @android:anim/linear_interpolator
OvershootInterpolator @android:anim/overshoot_interpolator

Confira como você pode aplicar um desses interpoladores com o atributo android:interpolator:

<set android:interpolator="@android:anim/accelerate_interpolator">
    ...
</set>

Interpoladores personalizados

Caso os interpoladores fornecidos pela plataforma não sejam satisfatórios, você pode criar um recurso de interpolação personalizado com atributos modificados. Por exemplo, você pode ajustar a taxa de aceleração para o AnticipateInterpolator ou ajustar o número de ciclos para o CycleInterpolator. Para fazer isso, crie seu próprio recurso de interpolação em um arquivo XML.

Localização do arquivo:
res/anim/filename.xml
O nome do arquivo é usado como ID de recurso.
Tipo de dados do recurso compilado:
Ponteiro de recurso para o objeto interpolador correspondente.
Referência de recurso:
Em XML: @[package:]anim/filename
Sintaxe:
<?xml version="1.0" encoding="utf-8"?>
<InterpolatorName xmlns:android="http://schemas.android.com/apk/res/android"
    android:attribute_name="value"
    />

Se você não ativa nenhum atributo, seu interpolador funciona exatamente da mesma forma que os fornecidos pela plataforma, listados na tabela anterior.

Elementos:
Observe que cada implementação de Interpolator, quando definida em XML, tem o nome iniciado por uma letra minúscula.

<accelerateDecelerateInterpolator>
A taxa de mudança começa e termina lentamente, mas é acelerada no meio.

Nenhum atributo.

<accelerateInterpolator>
A taxa de mudança começa lentamente e depois é acelerada.

Atributos:

android:factor
Ponto flutuante. A taxa de aceleração. O padrão é 1.
<anticipateInterpolator>
A mudança começa na ordem inversa e depois avança rapidamente.

Atributos:

android:tension
Ponto flutuante. A quantidade de tensão a ser usada. O padrão é 2.
<anticipateOvershootInterpolator>
A mudança começa na ordem inversa, avança rapidamente, ultrapassa o valor desejado e para no valor final.

Atributos:

android:tension
Ponto flutuante. A quantidade de tensão a ser usada. O padrão é 2.
android:extraTension
Ponto flutuante. O valor por que multiplicar a tensão. O padrão é 1,5.
<bounceInterpolator>
A mudança oscila no final.

Nenhum atributo

<cycleInterpolator>
Repete a animação por um número especificado de ciclos. A taxa de mudança segue um padrão senoidal.

Atributos:

android:cycles
Número inteiro. O número de ciclos. O padrão é 1.
<decelerateInterpolator>
A taxa de mudança começa rapidamente e depois desacelera.

Atributos:

android:factor
Ponto flutuante. A taxa de desaceleração. O padrão é 1.
<linearInterpolator>
A taxa de mudança é constante.

Nenhum atributo.

<overshootInterpolator>
A mudança avança rapidamente, ultrapassa o último valor e depois volta.

Atributos:

android:tension
Ponto flutuante. A quantidade de tensão a ser usada. O padrão é 2.
Exemplo:

Arquivo XML salvo em res/anim/my_overshoot_interpolator.xml:

<?xml version="1.0" encoding="utf-8"?>
<overshootInterpolator xmlns:android="http://schemas.android.com/apk/res/android"
    android:tension="7.0"
    />

Esse XML de animação ativa o interpolador:

<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@anim/my_overshoot_interpolator"
    android:fromXScale="1.0"
    android:toXScale="3.0"
    android:fromYScale="1.0"
    android:toYScale="3.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="700" />

Animação de frame

Uma animação definida em XML que mostra uma sequência de imagens em ordem, como um filme.

Localização do arquivo:
res/drawable/filename.xml
O nome do arquivo é usado como ID de recurso.
Tipo de dados do recurso compilado:
Ponteiro de recurso para um AnimationDrawable.
Referência de recurso:
Em Java: R.drawable.filename
Em XML: @[package:]drawable.filename
sintaxe:
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot=["true" | "false"] >
    <item
        android:drawable="@[package:]drawable/drawable_resource_name"
        android:duration="integer" />
</animation-list>
elementos:
<animation-list>
Obrigatório. Precisa ser o elemento raiz. Contém um ou mais elementos <item>.

Atributos:

android:oneshot
Booleano. "true" se você quiser executar a animação uma vez; "false" para repetir a animação.
<item>
Um único frame de animação. Precisa ser um filho de um elemento <animation-list>.

Atributos:

android:drawable
Recurso drawable. O drawable a ser usado para o frame.
android:duration
Número inteiro. A duração para mostrar o frame, em milissegundos.
Exemplo:

Arquivo XML salvo em res/drawable/rocket_thrust.xml:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>

O código do aplicativo a seguir define a animação como o segundo plano de uma View. Depois disso, ele abre a animação:

Kotlin

val rocketImage: ImageView = findViewById(R.id.rocket_image)
rocketImage.setBackgroundResource(R.drawable.rocket_thrust)

val rocketAnimation = rocketImage.background
if (rocketAnimation is Animatable) {
    rocketAnimation.start()
}

Java

ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
rocketImage.setBackgroundResource(R.drawable.rocket_thrust);

rocketAnimation = rocketImage.getBackground();
if (rocketAnimation instanceof Animatable) {
    ((Animatable)rocketAnimation).start();
}
Confira também: