Animando gestos de passar o dedo (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 passagem do dedo ao implementar o modelo de seleção por toque do Windows 8 (chamado de passar o dedo) para a seleção de um item.
Esse conjunto de animações consiste nas seguintes APIs: Todas essas três animações precisam ser usadas ao implementar a interação de passagem do dedo:
O vídeo a seguir demonstra a animação de revelação de passagem do dedo:
O vídeo a seguir demonstra as animações de seleção/anulação da seleção por passagem do dedo:
Observação
O controle ListView inclui seleção de toque e animações de passagem do dedo, portanto você não precisa implementar essas animações quando usar esse controle.
Seleção por passagem do dedo
Use a animação de seleção por passagem do dedo quando o usuário arrastar um item que oferece suporte para esse tipo de seleção. O usuário deve arrastar o item longe o suficiente para selecioná-lo e, em seguida, deve soltá-lo. A animação da seleção por passagem do dedo adiciona o indicador de seleção (geralmente uma marca de seleção) que mostra o estado "selecionado" no item e move o item de volta à sua posição de repouso.
.png "Ilustração que mostra as etapas em uma animação da seleção por passagem do dedo: mover e verificar")
Para usar essa animação, você precisa saber qual é o indicador de seleção que será mostrado, bem como a direção e a distância da animação.
Anulação da seleção por passagem do dedo
Use a animação de anulação da seleção por passagem do dedo quando o usuário arrastou um item selecionado no momento longe o suficiente para anular sua seleção e solta o item. A animação de anulação da seleção por passagem do dedo remove o indicador de seleção do item e o move de volta à sua posição de repouso.
.png "Ilustração que mostra as etapas em uma animação da anulação da seleção por passagem do dedo: mover e desmarcar")
Para usar essa animação, você precisa saber qual é o indicador de seleção que será oculto, bem como a direção e a distância da animação.
Revelação de passagem do dedo
Use a animação de revelação de passagem do dedo para mostrar ao usuário que o item dá suporte à interação por passagem do dedo. Quando o usuário pressiona e segura um item que dá suporte à interação por passagem do dedo, a animação move o item para baixo e de volta para cima como uma dica de que o item dá suporte a essa interação.
.png "Ilustração que mostra as etapas em uma animação de revelação de passagem do dedo: mover e desmarcar")
Para usar essa animação, você precisa saber qual é a direção e a distância da animação. A animação precisa ser executada duas vezes em sequência; uma vez para mover o item na direção especificada, e mais uma vez para mover o item de volta para a posição de repouso.
Outros recursos
Para obter exemplos de código que demonstram o uso de APIs de animação de passagem do dedo, consulte o Exemplo de biblioteca de animação HTML.