Xamarin Rocket #7 — Gestos
Fala galera,
Tentando manter a periodicidade semanal chegamos novamente com uma dica rápida de Xamarin.Forms!
A ideia é ser um artigo bem rápido e todas as dicas vão ficar em um único repositório, se você perdeu algum veja as que ja saíram :
· Xamarin Rocket #1 — LineBreakMode
· Xamarin Rocket #2 — Alterando o espaço das linhas e colunas do Grid
· Xamarin Rocket #3 — Tela Cheia, ocultando a barra de status
· Xamarin Rocket #4 — Imagens em botões
Arrastar, dar zoom, movimento pinça.. diversos gestos que fazemos em muitos dos apps do nosso dia a dia.
A utilização de gestos se mostra muito útil, como dar zoom em uma imagem por exemplo (Veja como dar zoom em imagens clicando aqui ).
Xamarin.Forms da suporte a diversos gestos muito utilizados e a implementação dos mesmos é muito simples. Então sem mais texto introdutório, vamos ver alguns deles :
Antes vamos preparar nosso APP adicionando duas propriedades doubles auxiliares no APP.xaml.cs ,para guardarmos o tamanho da tela :
Pronto, vamos aos gestos :
PanGesture : o "gesto de panorâmica" é utilizado para detectar a movimentação dos dedos na tela e mover seu conteúdo. Por exemplo, se temos uma imagem maior que a tela, podemos utilizar esse gesto para percorre-la.
Vamos criar uma classe para encapsular o gesto e utilizarmos como controle :
O evento OnPanUpdated é atualizado toda vez que movermos o conteudo (no caso a imagem ).
Agora vamos implementar o controle e nossa imagem :
Rodando , podemos mover a imagem :
PinchGesture : O famoso movimento pinça, que utilizamos dois dedos e o movimento de abrir e fechar. É muito útil para dar zoom em imagens por exemplo.
Vamos criar uma classe para encapsular o gesto e utilizarmos como controle :
E implementar o controle na Imagem :
Rodando , podemos dar zoom na imagem :
SwipeGesture: O movimento de passar o dedo para executar alguma ação. É possível identificar a direção que o dedo é passado, para cima,para baixo , direta ou esquerda.
Vamos criar uma classe para encapsular o gesto e utilizarmos como controle :
E implementar o controle em um boxView :
E no BackEnd :
Rodando podemos testar passando o dedo no box, ou o cursor no emulador :
TapGesture : o gesto de tocar, com ele podemos executar algum evento quando é tocado em algum controle na tela. Como em uma imagem por exemplo.
Para utilizar basta adicionar a propriedade de gesto no controle desejado, como nessa imagem por exemplo :
Agora no backend vamos implementar um evento para ver quantas vezes foram tocadas na imagem :
Rodando , vamos ficar tocando na imagem :
É uma dica bem simples mas que ajuda muito :D
Caso queira baixar o código utilizado no Exemplo: Clique aqui.
Quer ver outros artigos sobre Xamarin ? Clique aqui.
Espero ter ajudado!
Aquele abraço!
