Desenvolvendo jogos mobile com HTML5 by Novatec Editora

Luiz Fernando Estevarengo

Novatec

© Novatec Editora Ltda. 2016. Todos os direitos reservados e protegidos pela Lei 9.610 de 19/02/1998. É proibida a reprodução desta obra, mesmo parcial, por qualquer processo, sem prévia autorização, por escrito, do autor e da Editora. Editor: Rubens Prates MP20160801 Assistente editorial: Priscila A. Yoshimatsu Revisão gramatical: Smirna Cavalheiro Editoração eletrônica: Carolina Kuwabata Capa: Carolina Kuwabata ISBN: 978-85-7522-516-5 Histórico de impressões: Agosto/2016

Primeira edição

Novatec Editora Ltda. Rua Luís Antônio dos Santos 110 02460-000 – São Paulo, SP – Brasil Tel.: +55 11 2959-6529 E-mail: novatec@novatec.com.br Site: www.novatec.com.br Twitter: twitter.com/novateceditora Facebook: facebook.com/novatec LinkedIn: linkedin.com/in/novatec

capítulo 1

Ferramentas utilizadas

Para se programar um jogo ou uma página de internet muito pouco é necessário. Independentemente do sistema operacional que estiver utilizando, a maior parte pode ser feita em um editor de textos simples que permite salvar os arquivos com as extensões corretas. Contudo, para que possamos ter melhor aproveitamento do que for elaborado nos próximos capítulos, e para que possamos seguir uma metodologia padronizada a fim de obter como resultado jogos multiplataforma da maneira mais simples possível, iremos utilizar as ferramentas a seguir:

Phaser Phaser (pronuncia-se “fêizer”) é um framework (um conjunto de funções) específico para a criação de jogos em HTML5. Atualmente, ele é um dos mais utilizados e oferece para os iniciantes a maneira mais rápida de construir jogos, testar ideias ou apenas criar protótipos de algo que possa vir a ser um jogo no futuro (Figura 1.1). Você pode acessar o site oficial do Phaser pelo endereço http://www.phaser.io e consultar sua ótima documentação, tutoriais, novidades a respeito do framework e trabalhos de outras pessoas que o utilizaram em seus jogos. Todas as suas funcionalidades vêm de outros frameworks e os criadores do Phaser facilitaram o trabalho dos desenvolvedores ao unir tudo em uma única biblioteca. O Phaser é tão popular que a Intel o utiliza como um dos possíveis frameworks para jogos em sua ferramenta oficial. 14

Capítulo 1 ■ Ferramentas utilizadas

Figura 1.1 – Logotipo do framework Phaser. Fonte: http://phaser.io/images/img.png.

Intel XDK O Intel XDK é um IDE (Integrated Development Environment, ou Ambiente Integrado de Desenvolvimento) criado pela Intel (sim, aquela dos processadores) para desenvolvimento de aplicativos baseados em HTML5 e sua integração com dispositivos, móveis ou não. A sua premissa é que ele seja fácil de usar, possibilite eficiência no desenvolvimento de projetos e permita de forma simples exportar os projetos para quaisquer plataformas. Uma das coisas legais que o Intel XDK oferece é o suporte a vários frameworks, tanto para o desenvolvimento de aplicações como de jogos. Contém modelos e exemplos prontos para quem quiser estudar e entender como funcionam os jogos e aplicativos feitos utilizando esta ferramenta. Uma das coisas legais que ela faz quando criamos um projeto novo é automaticamente baixar o framework que iremos utilizar e criar todas as pastas de um projeto, inclusive com código pronto para testes. Falando em testes, tudo o que fizermos durante o livro pode ser testado diretamente na IDE, sem a necessidade de instalação de ferramentas de terceiros, servidores web ou emuladores dos sistemas móveis. O site oficial é https://software.intel.com/pt-br/intel-xdk e logo que acessamos vemos o link para download de acordo com a plataforma em que estivermos, como na Figura 1.2.

Desenvolvendo Jogos Mobile com HTML5

Figura 1.2 – Download do Intel XDK.

Dependendo da plataforma, o download terá cerca de 140 MB e pode demorar, se a sua conexão for lenta. A instalação mostrada na Figura 1.3 é a mais comum possível, no melhor estilo “Next, Next, Finish”:

Figura 1.3 – Instalação do Intel XDK.

Capítulo 1 ■ Ferramentas utilizadas

Ao concluir a instalação e iniciar o Intel XDK pela primeira vez, ele pedirá que faça um cadastro e login como desenvolvedor. Não se preocupe, pois o cadastro é rápido e gratuito; precisamos dele para que as funcionalidades da ferramenta sejam ativadas e possamos usá-las posteriormente, como, por exemplo, usar o Apache Cordova para gerar aplicativos para os dispositivos móveis que iremos focar. Vemos na Figura 1.4 o Intel XDK já instalado.

Figura 1.4 – Intel XDK em execução.

Apache Cordova/PhoneGap Apache Cordova (Figura 1.5), também conhecido como PhoneGap, é um framework para desenvolvimento de aplicativos móveis que permite aos desenvolvedores criar e distribuir aplicativos feitos com HTML, CSS e JavaScript sem a necessidade de conhecer a linguagem de programação nativa de determinada plataforma. O Apache Cordova é um software livre, gratuito e multiplataforma mantido pela Adobe e colaboradores. PhoneGap é o nome dado pela Adobe ao explorar o Cordova como produto juntamente com outros serviços agregados. Entre os colaboradores da Adobe, estão empresas como Google, Microsoft, IBM, Intel, Mozilla, BlackBerry, entre outras.

Desenvolvendo Jogos Mobile com HTML5

Figura 1.5 – Logotipo Apache Cordova. Fonte: https://cordova.apache.org/ static/img/artwork/cordova_logo_normal_dark_large.png.

Atualmente, ela suporta exportar aplicativos para dez sistemas operacionais, são eles: Apple iOS, Google Android, Windows Phone, Ubuntu Touch, BlackBerry, Mozilla Firefox OS, LG webOS, Tizen, Nokia Symbian e Bada. Em cada plataforma é possível, através do JavaScript utilizado nas aplicações, acessar e controlar algumas características dos dispositivos, quando disponíveis, como mostra a Tabela 1.1. Tabela 1.1 – Recursos de hardware suportados pelo Apache Cordova Google Android

Apple iOS

Windows Phone

Acelerômetro

Sim

Câmera

Sim

Bússola

Sim

Contatos

Sim

Arquivos

Sim

Geolocalização

Sim

Mídia

Sim

Redes

Sim

Notificações

Sim

Armazenamento

Sim

A tabela mostra a compatibilidade de recursos de aplicativos gerados pelo Apache Cordova nas plataformas-alvo deste livro. A maior vantagem é escrever suas aplicações uma única vez e já tê-lo integrado ao Intel XDK.