Your SlideShare is downloading. ×
0
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
PhoneGap - criando aplicações Android e iOS com HTML5
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

PhoneGap - criando aplicações Android e iOS com HTML5

20,071

Published on

Apresentação realizada na SESTINFO 2013 da Universidade Metodista de São Paulo.

Apresentação realizada na SESTINFO 2013 da Universidade Metodista de São Paulo.

Published in: Technology
0 Comments
11 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
20,071
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
297
Comments
0
Likes
11
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. PhoneGap: desenvolvendoaplicações multiplataformacom HTML5Rafael Sakurai@rafaelsakuraiRodrigo Cascarrolho@rodrigocasca
  • 2. Índice•  HTML5•  Aplicação nativa•  Aplicação web•  Aplicação hibrida•  PhoneGap•  Desenvolvendo com PhoneGap•  Exemplo de aplicação Android e iOS•  Aplicações criadas com PhoneGap
  • 3. HTML5 + CSS3 + JShttp://www.slideshare.net/rafaelsakurai/html5-sestinfo-2012http://www.slideshare.net/rodrigocasca/html5-novidades-adoo-e-mobile
  • 4. Aplicação nativa- Acesso completo ao dispositivo.- Mais velocidade deprocessamento.- Menor tempo de resposta.- Loja.- Desenvolvimento caro.- Não é multi plataforma.
  • 5. Aplicações web- Desenvolvimento mais barato.- Multi plataforma.- Acesso parcial ao dispositivo.- Não tem loja.
  • 6. Aplicações hibridasKENT BECK - Multiple Mobiles (http://martinfowler.com/articles/multiMobile/ -slide 24)- Acesso a todas as opçõesdo dispositivo.- Loja.- Desenvolvimento maisbarato.- Multi plataforma.
  • 7. Aplicações hibridas"Aplicações hibridas que oferecem umbalanceamento entre aplicações web HTML5e aplicações nativas serão usadas em maisde 50% das aplicações móveis até 2016".Gartner, 2013, http://www.gartner.com/newsroom/id/2429815Desenvolvimento Testes
  • 8. "O PhoneGap é um framework gratuito e opensource que permite a criação de aplicaçõesmóveis usando APIs padronizadas da web"www.phonegap.com
  • 9. PhoneGap - História2008: início - Nitobi Software2008: suporte a iPhone, Android e Blackberry 42009: suporte a Symbian e webOS2011: suporte a Windows Phone 72011: Adobe adquire a Nitobi Software2011: Código mantido pela Apache Software FoundationNovo nome : Cordova2012:PhoneGap Build
  • 10. PhoneGap  é  a  ponte  entre  as  aplicações  web  e  os  disposi6vos  móveis.  Através  do  PhoneGap  Build  é  possível  gerar  código  na6vo  sem  a  necessidade  do  ambiente  de  desenvolvimento  de  cada  plataforma.  Apache  Cordova  é  um  conjunto  de  APIs  que  permite  que  um  desenvolvedor  de  aplica6vos  móveis  acesse  as  funções  na6vas  do  disposi6vo,  como  a  câmera  ou  o  acelerômetro,  através  do  JavaScript.  
  • 11. PhoneGap / Cordova
  • 12. PhoneGap APIsAccelerometer Camera CaptureCompass Connection ContactsDevice Events FileGeolocation Globalization InAppBrowserMedia Notification SplashscreenStorage
  • 13. PhoneGap
  • 14. API de contatofunction onDeviceReady() {var filtro = document.getElementById("idnome").value;console.log("Filtro:::::: " + filtro);var options = new ContactFindOptions();options.filter=filtro;options.multiple=true;var fields = ["displayName", "name"];navigator.contacts.find(fields, onSuccess, onError, options);}function onSuccess(contacts) {var lista = document.getElementById("idlista");ista.innerHTML = "";console.log("Qde::::" + contacts.length);for (var i=0; i<contacts.length; i++) {$("#idlista").prepend(<li data-role="itens">+contacts[i].displayName+</li>);console.log("Display Name = " + contacts[i].displayName);}$("#idlista").listview(refresh);}
  • 15. Emulandor PhoneGapRipple  
  • 16. Teste APP
  • 17. Teste APP
  • 18. Teste APP
  • 19. Teste APP
  • 20. DebugWeinre  
  • 21. Estrutura do PhoneGap
  • 22. Exemplo app comAndroid
  • 23. Criando a aplicação./create../workspacebr.metodista.sestinfo2013ExemploSestInfoscriptdiretório pacotenome doprojeto
  • 24. Ambiente de desenvolvimento
  • 25. Exemplo com câmera
  • 26. Exemplo com câmera
  • 27. Exemplo app comiPhone
  • 28. Criando a aplicação./create../workspace/iosbr.metodista.sestinfo2013IOS_Exemploscriptdiretório pacotenome doprojeto
  • 29. Ambiente de desenvolvimento - iOS
  • 30. Plugins
  • 31. Vestibular Metodistahttps://play.google.com/store/apps/details?id=br.metodista.vestibularmetodista
  • 32. Obrigado!Rafael Sakurai@rafaelsakuraiRodrigo Cascarrolho@rodrigocasca
  • 33. Referênciashttp://phonegap.com/http://en.wikipedia.org/wiki/PhoneGaphttp://html5hu.wordpress.com/

×