Blog Post

Utilizando gestos no Windows Phone 7

Sign in to queue

Description

Uma das possibilidades da classe TouchPanel é a interface gesture.

Entenda por gesto uma "comunicação não verbal feita através das suas mãos" e nada mais. Simples porém essencial para uma boa e rica experiência dos futuros usuários do seu game.

Um gesto em uma tela sensível ao toque traz muita riqueza a experiência principalmente por possuir uma relação com conceitos de NUI (natural user interface). Sendo que simulará na tela um resultado para o seu gesto, idêntico ou similar a reação da sua ação na vida real, como por exemplo mover um objeto com as pontas dos seus dedos.

Aqui não teremos foco em NUI mas aconselho que se aprofunde no tema para principalmente colocar seu conhecimento em prática no desenvolver das suas aplicações ou games.

O input de um gesto pode ser reconhecido em nosso TouchPanel. É interessante ter consciência de que alguns gestos são similares ao comportamento, ação e reação de um mouse (gesto TAP por exemplo), porem outros são totalmente diferentes, inclusive por exigirem toques simultâneos na tela do dispositivo.

O XNA suporta diferentes gestos com a mesma classe TouchPanel usada para inputs.

Chegou a hora de você dominar cada um deles. Vamos lá:

Tap
O dedo toca na tela porém não executa um movimento de descolamento e nem mantém pressionado o item selecionado. Basicamente o toque mais simples que você pode imaginar.

Double Tap
O dedo toca na tela duas vezes em um pequeno intervalo de tempo, porém não executa movimento de descolamento ou mantém pressionado o item selecionado. Similar ao double click do mouse.

Hold
O dedo toca na tela, não executa movimento de descolamento (ou pode deslocar alguns milimetros mas será ignorado pelo TouchPanel ) e mantém o toque por um pequeno intervalo de tempo.

FreeDrag
O dedo toca na tela e mantém seu contato com o item (como o Hold) porém com movimento em qualquer direção.

VerticalDrag
O dedo toca na tela e mantém seu contato com o item porém desloca-se somente para cima e para baixo.

HorizontalDrag
O dedo toca na tela e mantém seu contato com o item porém desloca-se somente para a direita e para esquerda.

DragComplete
Marca o final do FreeDrag, HorizontalDrag e VerticalDrag.

Flick
Gesto simples de executar mas um pouco difícil de explicar, mas vou tentar! Vamos lá..

O Flick é iniciado exatamente como o FreeDrag, HorizontalDrag e VerticalDrag porém o dedo perde o contato com a tela ainda no meio do movimento, sem concluir seu reposicionamento. Uma maneira boa de visualizar este gesto é imaginar o pneu de um avião deslocando-se na pista de decolagem e em um determinado momento, quando o avião adquire velocidade suficiente, ele finalmente sai do solo, o que consequentemente faz com que o pneu do avião saia do chão mas nem por isso parou de se movimentar, pelo contrario, ele adquiriu velocidade no meio do movimento e no ponto mais alto da velocidade deixou de ter contato com o solo.

Pense que seu dedo foi o pneu do avião e a pista de decolagem era a tela do Windows Phone 7.

Ufa.. não sei se consegui explicar, mas me esforcei

Detalhe importante, o Flick recebe em seu input a velocidade de deslocamento e não somente a posição inicial e final do gesto.

Pinch
Dois dedos tocando a tela (praticamente um "DoubleHold") porem se deslocam em direções opostas ainda em contato com a tela (aproximando-se ou afastando-se) onde interagem com o item que está exatamente entre eles. Acredito que você conheça como "zoom". O efeito zoom in ou zoom out pode ser o resultado de um gesto Pinch, mas não necessariamente precisa aumentar ou diminuir itens da tela, mesmo que este seja um uso muito comum para este gesto.

Tenha em mente que sempre é preciso habilitar o uso de um gesto para input , ele não é automático.

Se fosse, imagine quantos problemas enfrentaríamos, principalmente em games, onde queremos ter exatidão do que é possível ou não fazer com os elementos da tela.

Para habilitar os gestos Tap e Flick por exemplo, inserimos a seguinte linha no nosso construtor Game1() ou LoadContent()

TouchPanel.EnabledGestures = GestureType.Tap | GestureType.Flick;

Importante, você deve usar uma condição para ler um gesto. Tentar ler um gesto quando ele não está disponível causará uma exceção.

Aqui falamos bastante sobre conceitos de gestos e quais são eles.

Se você se interessou, recomendo também a leitura do post Entendendo o User Input no Windows Phone 7 com XNA

Agora que você dominou o assuntos "gestos" do Windows Phone 7, use e abuse de UX e NUI nas suas criações Smiley

Boas experiências!

[]'s!

 

The Discussion

Add Your 2 Cents