Animando a interface do usuário pop-up (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 pop-up para mostrar e ocultar a interface do usuário pop-up, que inclui menus de contexto e submenus. Os elementos pop-up são contêineres que aparecem sobre o conteúdo do aplicativo e desaparecem quando o usuário toca ou clica fora do elemento pop-up. Essas animações são principalmente para uso em controles personalizados. Os controles de Flyout e Menu incluem as animações pop-up. Ao usar esses controles em seu aplicativo, você não precisa fornecer as animações.
Este conjunto de animações consiste nas seguintes APIs:
O vídeo a seguir demonstra as animações que mostram e ocultam uma interface do usuário pop-up:
A animação showPopup inclui uma translação, que é um movimento vertical partindo de uma posição inicial para a posição final à medida que o elemento pop-up faz fade in. A distância e a direção da translação são especificadas pelo aplicativo. Na maioria dos casos, a translação deve ser de 50 pixels, movendo-se em uma direção para cima. No entanto, quando o elemento pop-up é exibido abaixo do elemento de interface do usuário que disparou o pop-up, a conversão deve ter 50 pixels, movimentando-se para baixo. Por exemplo, essa conversão para baixo aplicaria um submenu disparado de uma barra de navegação ou de um cabeçalho de aplicativo. O objetivo é oferecer ao usuário um link visual entre o elemento pop-up e seu elemento de disparo.
Para usar as animações pop-up, você precisará saber qual objeto aparecerá ou desaparecerá e, no caso de showPopup, o deslocamento a partir do qual o objeto se moverá enquanto aparece.
Outros recursos
Para obter exemplos de código que demonstram o uso de APIs de animação de interface do usuário pop-up, 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 interface do usuário pop-up.
Tópicos relacionados
Animando sua interface do usuário