O slideshow foi denunciado.
Seu SlideShare está sendo baixado. ×

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

Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Anúncio
Carregando em…3
×

Confira estes a seguir

1 de 35 Anúncio

Mais Conteúdo rRelacionado

Diapositivos para si (20)

Quem viu também gostou (18)

Anúncio

Semelhante a PhoneGap - Criando aplicações Android e iOS com HTML5 (20)

Anúncio

Mais recentes (20)

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

  1. 1. PhoneGap: desenvolvendo aplicações multiplataforma com HTML5 Rafael Sakurai @rafaelsakurai Rodrigo Cascarrolho @rodrigocasca
  2. 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. 3. HTML5 + CSS3 + JS http://www.slideshare.net/rafaelsakurai/html5-sestinfo-2012 http://www.slideshare.net/rodrigocasca/html5-novidades-adoo-e-mobile
  4. 4. Aplicação nativa - Acesso completo ao dispositivo. - Mais velocidade de processamento. - Menor tempo de resposta. - Loja. - Desenvolvimento caro. - Não é multi plataforma.
  5. 5. Aplicações web - Desenvolvimento mais barato. - Multi plataforma. - Acesso parcial ao dispositivo. - Não tem loja.
  6. 6. Aplicações hibridas KENT BECK - Multiple Mobiles (http://martinfowler.com/articles/multiMobile/ - slide 24) - Acesso a todas as opções do dispositivo. - Loja. - Desenvolvimento mais barato. - Multi plataforma.
  7. 7. Aplicações hibridas "Aplicações hibridas que oferecem um balanceamento entre aplicações web HTML5 e aplicações nativas serão usadas em mais de 50% das aplicações móveis até 2016". Gartner, 2013, http://www.gartner.com/newsroom/id/2429815 Desenvolvimento Testes
  8. 8. "O PhoneGap é um framework gratuito e open source que permite a criação de aplicações móveis usando APIs padronizadas da web" www.phonegap.com
  9. 9. PhoneGap - História 2008: início - Nitobi Software 2008: suporte a iPhone, Android e Blackberry 4 2009: suporte a Symbian e webOS 2011: suporte a Windows Phone 7 2011: Adobe adquire a Nitobi Software 2011: Código mantido pela Apache Software Foundation Novo nome : Cordova 2012:PhoneGap Build
  10. 10. PhoneGap é a ponte entre as aplicações web e os dispositivos móveis. Através do PhoneGap Build é possível gerar código nativo sem a necessidade do ambiente de desenvolvimento de cada plataforma. Apache Cordova é um conjunto de APIs que permite que um desenvolvedor de aplicativos móveis acesse as funções nativas do dispositivo, como a câmera ou o acelerômetro, através do JavaScript.
  11. 11. PhoneGap / Cordova
  12. 12. PhoneGap API's Accelerometer Camera Capture Compass Connection Contacts Device Events File Geolocation Globalization InAppBrowser Media Notification Splashscreen Storage
  13. 13. PhoneGap
  14. 14. API de contato function 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. 15. Emulandor PhoneGap Ripple
  16. 16. Teste APP
  17. 17. Teste APP
  18. 18. Teste APP
  19. 19. Teste APP
  20. 20. Debug Weinre
  21. 21. Estrutura do PhoneGap
  22. 22. Exemplo app com Android
  23. 23. Criando a aplicação ./create ../workspace br.metodista.sestinfo2013 ExemploSestInfo script diretório pacote nome do projeto
  24. 24. Ambiente de desenvolvimento
  25. 25. Exemplo com câmera
  26. 26. Exemplo com câmera
  27. 27. Exemplo app com iPhone
  28. 28. Criando a aplicação ./create ../workspace/ios br.metodista.sestinfo2013 IOS_Exemplo script diretório pacote nome do projeto
  29. 29. Ambiente de desenvolvimento - iOS
  30. 30. Plugins
  31. 31. Vestibular Metodista https://play.google.com/store/apps/details?id=br.metodist a.vestibularmetodista
  32. 32. Obrigado! Rafael Sakurai @rafaelsakurai Rodrigo Cascarrolho @rodrigocasca
  33. 33. Referências http://phonegap.com/ http://en.wikipedia.org/wiki/PhoneGap http://html5hu.wordpress.com/

×