Com a popularização dos smartfones e consolidação das telas touch screen ter em sua aplicação funções acionadas pelo comportamento de deslizar o dedo sobre a tela pode representar um grande diferencial de sua aplicação.
Nessa postagem vamos criar uma aplicação Android com Delphi XE5 que será capaz de captar os gestos do usuário na tela do dispositivo.
Criando a aplicação e adicionando os componentes
Vamos iniciar uma nova aplicação Mobile em Branco no Delphi XE5, como já fizemos este procedimento em várias postagens anteriores vamos pular essa parte, e nesta aplicação vamos inserir os componentes: 1 ToolBar, 1 Label(insira dentro da ToolBar), 1 TabControl, e 1Panel.
Uma vez adicionados os componentes em nossa aplicação, para que sua interface fique parecida com a figura acima vamos configurar suas propriedades como abaixo:
- ToolBar1
- Align –> alTop
- Label1
- Text –> Gestos com Delphi XE5
- TextAlign –> taCenter
- TabControl1
- Align –> alBottom
- TabPosition –> tpBottom
- Panel1
- Align –> alClient
- StyleLookup –> calloutpanelstyle
Agora vamos clicar com o botão direito do mouse sobre o TabControl1 e adicionar 3 novos TabItem, após adicionados vamos alterar a propriedade Text de cada um deles:
- TabItem1.Text –> Esquerda
- TabItem2.Text –> Central
- TabItem3.Text –> Direita
GestureManager a gestão dos gestos
Para que os gestos sejam interpretados por nossa aplicação precisamos adicionar ainda um GestureManager. Selecione o Panel1 e vamos associar sua propriedade Touch.GestureManager e habilitar suas Gestures Standard: Left, Right, Down e Up. Veja na imagem abaixo:
Codificando a captação do Gestos
Apenas para garantir que nossa aplicação sempre seja inicializada com a TabItem“Central” ativa em nosso TabControl vamos inserir o seguinte código no evento onActivate do Form1:
procedure TForm1.FormActivate(Sender: TObject); begin TabControl1.TabIndex := 1; end;
E para os gestos serem interpretados pela aplicação vamos inserir no evento onGesture do Painel1 o código:
procedure TForm1.Panel1Gesture(Sender: TObject;
const EventInfo: TGestureEventInfo; var Handled: Boolean);
var
Gesto : string;
begin
if GestureToIdent(EventInfo.GestureID, Gesto) then
begin
case EventInfo.GestureID of
sgiLeft : TabControl1.TabIndex := 0;
sgiRight: TabControl1.TabIndex := 2;
sgiDown : TabControl1.TabIndex := 1;
sgiUp : ShowMessage('Você utilizou o gesto para cima: ' + Gesto);
end;
end;
end;
Após a todos os componentes configurados e os códigos acima inseridos essa será a aparência do projeto
Executar e entender o funcionamento da aplicação
Agora basta executar a aplicação no emulador ou diretamente no seu dispositivo Android e conferir o resultado. Basicamente trocamos as TabItens com o movimento dos dedos sobre o Panel1:
- Deslizando para a direita acionamos a TabItem “Direita”
- Deslizando para a esquerda acionamos a TabItem “Esquerda”
- Deslizando para baixo vamos para a TabItem “Central”
- Deslizando para cima é exibida uma mensagem contendo a constante que denomina o gesto acionado
Agora é adaptar o modelo à sua necessidade e mandar ver!
Boa tarde Landerson,
Parabéns por mais um tutorial, mais uma vez ele me ajudou a solucionar o meu problema!
Grande abraço!
É Matheus… vou mandar fazer uma carteirinha para você…(risos)
Mais uma vez obrigado pela presença e mais ainda pela frequência… e que bom que têm sido de valia as postagens!
Ainda tenho mais um pouquinho a acrescentar, espero que as próximas também sejam úteis.
Abraço.
Landerson tem como você fazer um exemplo enciando email com android delphi
Olá Alexandre… vou tentar preparar algo assim no próximo final de semana, quem sabe eu consigo né? Se sim, posto!
Um abraço e obrigado pela participação!
olá como que eu faço para configurar um duplo click na tela, tenho uma listview , preciso configurar um evento duplo click, no item da listview e ele abrir um memo. quando compilo o projeto para windows funciona mais quando vai para o emulador ou próprio aparelho não acontece nada.
Olá Erasmo! Bem vindo!
O duplo click no ListView até permite o evento duplo click, mas no item não… talvez o manter pressionado o item seja a solução para você!
Grande abraço e até a próxima!
Olá, muito boa matéria, mas gostaria de dar uma sugestão:
Para que não precise especificar a tab que está, pode ser feito assim:
sgiLeft :
// verifico se estou no zero – primeiro tab
if(TabControl1.TabIndex > 0)then
TabControl1.TabIndex := TabControl1.TabIndex -1;
// verifico se estou no ultimo – ultimo tab existente
sgiRight:
if(TabControl1.TabIndex TabControl1.TabCount-1 )then
TabControl1.TabIndex := TabControl1.TabIndex +1;
desta forma, posso surfar pelos tabs sem me preocupar com seu index, que será tratada a cada gesto, 0,2,3,4 para ir e 4,3,2,1,0 para voltar, não importa quantos tabs existam
Olá Adriano bem vindo!
Excelente sugestão para a questão da navegação nas Abas do TabControl!
Na verdade a postagem foca apenas no controle de gesto, e a utilização do TabControl foi só uma forma de associação prática.
Mas enfim sua dica é de grande valia a todos os leitores que estiverem procurando sobre como navegar no TabControl, está aprovadíssima!
Parabéns e obrigado por sua participação!
Grande abraço e até a próxima!
Prezado Landerson, venho acompanhando seus posts referentes a delphi xe com android e estão sendo de grande ajuda para mim.
Estou com uma dúvida e vi que você respondeu logo acima ao colega Erasmo sobre manter um item do list view, é exatamente o que estou precisando, tenho um list view com alguns dados e quero que quando o usuário ficar com o dedo pressionado sobre esse item, eu mostro uma determinada mensagem para ele.
Você poderia me dar um exemplo sobre com fazer isso ou me orientar em qual evento eu consigo verificar essa ação de manter o dedo pressionado?
Agradeço desde já.
SUCESSOS !!!
Olá Cesar!
Primeiramente obrigado por sua participação, seja muito bem vindo!
Bem acredito que você possa utilizar o evento OnItemClick ou OnItemClickEx… você poderia até utilizar um Gesture Manager combinando-o com seu ListView e nos Interactives Gestures capturanr o ItemIndex no gesto PressAndTap, acredito que funcionarão perfeitamente.
Tente algum aí e não deixe de postar um feedback.
Mais uma vez obrigado por sua participação!
boa noite,
parabéns pelo post,
esses dias estava programando e me surgiu o seguinte problema: clicar em dois botões simultaneamente.
Não consegui resolver, alguma ideia?
Olá Jonas! Bem vindo!!!
Nunca tentei, mas podemos pensar em um Custo Gesture, ou seja, você criar seus próprios gestos, isso vai permitir vc gravar qq coisa, logo 2 pontos distintos devem funcionar!
Tenta aí é mande um feedback!
Abraço.
Bom dia, Landerson! Esse exemplo tem funcionado perfeitamente em dispositivos android, porém, precisei compilar para IOs e ele não reconhece os gestos. Na epressão: GestureToIdent(EventInfo.GestureID, Gesto), a variável Gesto vem sempre em branco, debugando, no GestureID não vem um código aceito para identificar os movimentos. Tudo que preciso é mudar o TabItem de um tabcontrol. Será que você ou alguém da comunidade pode ajudar?
Olá Eduardo serei breve pois estou no celular e sua resposta foge completamente do minha experiência, pois ainda não fiz absolutamente nada no iOS.
Sugiro um contato com Adriano Santos, ou Kelver Merlotti para tentar auxílio.
Desde já agradeço sua participação e lamento não poder ser efetivamente útil!
Até breve.