Mostrar uma imagem animada

É possível criar uma experiência de usuário mais interativa e envolvente no app carregando um arquivo drawable para mostrar imagens animadas. As imagens animadas são úteis para criar indicadores de carregamento, indicadores de sucesso ou de erro, facilitar o desenvolvimento do jogo e várias outras funções da interface.

Compatibilidade de versões

Essa implementação exige que o minSDK do projeto seja definido como nível 21 da API ou mais recente.

Dependências

Mostrar uma imagem animada

O código a seguir mostra um vetor animado que alterna automaticamente entre dois estados:

@Composable
fun AnimatedVectorDrawable() {
    val image = AnimatedImageVector.animatedVectorResource(R.drawable.ic_hourglass_animated)
    var atEnd by remember { mutableStateOf(false) }
    Image(
        painter = rememberAnimatedVectorPainter(image, atEnd),
        contentDescription = "Timer",
        modifier = Modifier.clickable {
            atEnd = !atEnd
        },
        contentScale = ContentScale.Crop
    )
}
AnimationSnippets.kt

Pontos principais sobre o código

  • Carrega um recurso vetorial, animando os atributos de exibição ao longo do tempo.
  • Uma instância Image que usa uma instância Painter para executar a animação, criada a partir do estado AnimatedImageVector e boolean pela função rememberAnimatedVectorPainter().
  • Quando atEnd é true, a instância Painter para de animar.

Resultados

Amostra de uma ampulheta que anima o conteúdo e gira.
Figura 1. Drawable vetorial animado no Compose.

Coleções que contêm este guia

Este guia faz parte destas coleções selecionadas de guias rápidos que abrangem metas mais amplas de desenvolvimento para Android:

Descubra técnicas para usar recursos visuais vibrantes e envolventes e dar ao seu app Android uma aparência bonita.
Coletânea de guias rápidos

Tem dúvidas ou feedback?

Acesse a página de perguntas frequentes e saiba mais sobre os guias rápidos ou entre em contato e conte o que você pensa.
Acessar as perguntas frequentes Enviar feedback