PhoneGapAmbiente de desenvolvimento

Grupo: Aruã de Mello SousaRenata Guimarães D. de F. Costa

Introdução

• PhoneGap é um framework de desenvolvimento móvel

• A principal vantagem do PhoneGap é ser cross-platform: uma vez desenvolvido o aplicativo, o mesmo código-fonte poderá ser utilizado para qualquer outra plataforma sem a necessidade de ser reescrito em Java, Objective-C ou qualquer outra linguagem especifica

• Possibilita construir aplicativos para dispositivos móveis utilizando javascript html5 e css3

Introdução● Open-Source

● Capaz de gerar aplicativos híbridos e até mesmo nativos

● PhoneGap-Build ○ Geração de aplicativos para

diversas plataformas○ Build em nuvem○ Elimina necessidade de

Sistemas Operacionais específicos

PhoneGap

• As aplicações resultantes são híbridas:

- não são completamente nativas ao aparelho, pois todo o layout é renderizado através de web views ao invés de um framework nativo

- nem são aplicativos web, pois são rodados nativamente e tem acesso as APIs dos dispositivos.

Ambiente de desenvolvimento• Permite a utilização de diferentes IDEs:

• Eclipse

• Sublime

• XCode (MacOS)

• Visual Studio (Windows)

• Existem diversos plugins, tanto da própria Adobe quanto de terceiros para auxiliar no desenvolvimento

Eclipse

Configuração do Ambiente de Desenvolvimento

É possível utilizar multiplas IDEs pois, tanto a configuração quanto a compilação são independentes da IDE

Cordova - Instalação em Unix

• Primeiramente faça download e instalação de node.js (http://nodejs.org/) e após instale o cordova

$ sudo npm install -g cordova

• No diretório onde está o código fonte$ cordova create hello com.example.hello "HelloWorld"$ cd hello $ cordova platform add $ cordova build

Cordova - Instalação em MacOS

• Instalar Xcode

• Baixar e instalar PhoneGap (http://phonegap.com/install/)

Emulação

SDKs para plataformas móveis vem empacotados com emuladores que executam uma imagem de dispositivos, para que seja possivel ver a interação do aplicativo com as funcionalidades da plataforma.

EmulaçãoRode este

comando para reconfigurar o aplicativo e vê-lo no emulador da plataforma

$ cordova emulate android

Dúvidas?

Referências

• http://www.adobe.com/devnet/html5/articles/getting-started-with-phonegap-in-xcode-for-ios.html

• http://mark.burazin.net/phonegap-apache-cordova-osx-sublime-text-2/

• http://docs.phonegap.com/en/3.4.0/guide_platforms_index.md.html#Platform%20Guides

• http://docs.phonegap.com/en/3.4.0/guide_cli_index.md.html#The%20Command-Line%20Interface

• http://anindita9.wordpress.com/tag/phonegap-windows-phone-visual-studio-2010-2012/