Animações de fade (HTML)
[ Este artigo destina-se aos desenvolvedores do Windows 8.x e do Windows Phone 8.x que escrevem aplicativos do Windows Runtime. Se você estiver desenvolvendo para o Windows 10, consulte documentação mais recente]
Use animações de fade para trazer itens para uma exibição ou retirá-los de uma exibição. Há três tipos de animações de fade: fade in, fade out e fading cruzado. Cada animação foi projetada para um cenário diferente.
Este conjunto de animações consiste nas seguintes funções:
O vídeo a seguir demonstra as animações que fazem o conteúdo aparecer e desaparecer gradualmente em uma exibição. Observe a barra de rolagem que passa por fade in e depois fade out na parte inferior da tela:
O vídeo a seguir demonstra a animação de fading cruzado:
Fade in
Use a animação de fade in para inserir um item ou conjunto de itens. Um exemplo da animação de fade in pode ser visto na barra de aplicativos, em que novos controles podem aparecer como resultado da interação do usuário. Você também deve fazer fade in na animação para causar uma transição entre um item de espaço reservado para um item real à medida que o conteúdo é carregado dinamicamente ou para mostrar uma dica de ferramenta ou um controle de caixa de diálogo.
Observe que a dica de ferramenta e os controles de caixa de diálogo do Windows incluem as animações de fade in e fade out.
Fade out
Use a animação de fade out para remover um item ou conjunto de itens da exibição. Um exemplo das animações de fade out pode ser visto em controles transitórios como a barra de rolagem ou o indicador de movimento panorâmico, que passam por fade out depois que um período de tempo é decorrido e não há entrada do usuário detectada.
Fading cruzado
Use a animação de fading cruzado para executar uma substituição local de um item existente por um item de entrada. A animação faz fade nos itens existentes à medida que faz fade dos itens substitutos para o mesmo lugar.
Outros recursos
Para obter exemplos de código que demonstram o uso de funções de animação defade, consulte o Exemplo de biblioteca de animação HTML.
Para obter práticas recomendadas no uso dessas animações, consulte Diretrizes e lista de verificação para animações de fade.