Como criar um aplicativo básico com DatePicker no Android com Thunkable




      Um DatePicker é um elemento calendário utilizado em campos de data.
 Com este elemento será capaz de criar calendários, agendas, alarmes dentre outros.





Vamos iniciar nossa aplicação e para isso vamos usar a plataforma de desenvolvimento online Thunkable, sem a necessidade de instalar qualquer programa no computador apenas um pequeno aplicativo no celular para emular a aplicação, e pode ser encontrado neste link app Thunkable.

  Acessaremos a plataforma de desenvolvimento para PC neste link LINK Thunkable . .


  (Se você não conhece a plataforma de desenvolvimento ou quer ver um tutorial bem básico de como usar o Thunkable acesse esse link "Tutorial básico thunkable" ).


  
Selecione a opção Android e faça login com o Google.



Clique em "create new app", e na janela que aparecer escreva DatePicker e aperte OK.





Vai aparecer uma tela como essa, onde sera desenvolvida nossa aplicação.





        Agora vamos adicionar o itens da parte gráfica, começamos por adicionar uma "DatePicker", clique user interface no lado esquerdo, localize DatePicker e araste uma vez para a Screen1, e "Label"  três vezes.



   
         Agora vamos renomear os links dos elementos gráficos, selecione um elemento por vez e clique em rename, Date_Pick1 vai manter Date_Pick1 já as labels ficaram; Label1=LbDia, Label2=LbMes, Label3=LbAno.
        





   Agora vamos renomear os nomes dos elementos , selecione um elemento por vez, vá até a caixa "Text" apague o nome e renomeie, DatePicker para "Selecione data",  e as "Labels" apenas apague, elas devem ficar vazias, e receberão as datas quando selecionado.
    



Pronto nossa parte gráfica já esta pronta, e partiremos agora para os blocos que é onde faremos com que o aplicativo funcione de fato.

 Clique em Blocks, e aparecera uma tela como esta abaixo.


Selecione o elemento "DatePicker.After Date Set" no menu lateral direito e arraste para dentro do editor como na imagem abaixo.




 Nas 'Labels' arraste o elemento "Text To", sendo uma "LbAno", "LbMes", "LbDia".






   Pra finalizar, em DatePicker, arraste os elementos Date_Picker Day  e encaixe em  LbDia,  Date_Picker Month em LbMes e Date_Picker Year em LbAno.








  No celular aparecerá desta forma.





  Quando clicar em selecione data, aparecerá esta tela, confirme a data escolhida.







 E as Labels receberam os dados da DatePicker, sendo neste caso LbDia recebendo dia "22",   LbMes recebendo mês "5"  e LbAno recebendo ano "2018".






É isso ai pessoal, um simples tutorial que nos mostra o funcionamento do DatePicker, agora usem a imaginação para criar uma infinidade de aplicações, e boa sorte.
 Duvidas deixem no comentário.


Tutorial em vídeo
 

Nenhum comentário:

Postar um comentário