Instalando o JRE e JDK

Antes de prosseguir pra instalação do Eclipse, vamos instalar as principais bibliotecas de Runtime JAVA para podermos utilizar o Eclipse e o SDK do Android, estas instalações são fundamentais.

Antes de tudo acesse este link e tenha certeza se você já tem o Java instalado em sua máquina.

Antes de baixar o JRE, confira se seu Windows é 64bits ou é um x86, abra o menu iniciar, clique com direito em Meu Computador, em seguida clique Propriedades, deverá abrir esta tela:

Já sabe seu tipo? Clique AQUI pra escolher qual JRE instalar de acordo com seu computador.

Nesta mesma sequência do tipo do seu sistema, instale o JDK clicando aqui.

Instalando o Eclipse

Eclipse é uma plataforma de IDE para desenvolvimento e programação em diversas linguagens, IDE significa Integrated Development Environment que em sua tradução é “Ambiente de Desenvolvimento Integrado”. Com esta poderosa ferramenta é possível programar nas mais diversas linguagens como C/C++, Java, Javascript…

Acesse este link e faça o download do Eclipse for Mobile Developers de acordo com seu sistema também se 32 ou 64 bits.  Não há muito segredo, prossiga com a instalação.

Instalando ADT Plugin

Abra seu Eclipse instalado, assim que abrir, acesse o menu superior na janela em HELP em seguida clique em Install New Software, agora volte para seu navegador e acesse este link que irá te levar para a página oficial do plugin Eclipse no ANDROID, clique no link Installing The Eclipse Plugin para você pegar o link oficial do ADT Plugin, é recomendado sempre acessar as páginas oficiais da Google Android para baixar estes plug-ins e SDKs pois são constantemente atualizados e o recomendado é sempre trabalhar nas versões mais atuais, nesta página você irá encontrar um link assim: https://dl-ssl.google.com/android/eclipse/ copie este link e volte para janela do Eclipse.

No Eclipse clique no botão ADD ao lado direito para instalarmos o ADT Plugin, Insira o nome ADT Plugin e a URL que acabamos de copiar abaixo e adicione, clique OK. Selecione os dois itens que irão aparecer na lista e avance aceitando todas as Licenças.

Instalando o Android SDK

Sempre Instale a versão mínima 2.2 do Android SDK para testar em versões anteriores eu costumo pegar as versões de Android que foram mais difundidas, que são as mínimas 2.1 Eclair, a 2.2 Froyo, a do meio 3.1 Honeycomb e as mais recentes 4.03 Ice Cream Sandwich e 4.2.2 Jelly Bean , estas instalações são feitas na janela do Android SDK Manager.

Na janela do Eclipse note dois icones referentes ao Android, um para o SDK Manager, outro para o AVD, clique no marcado em vermelho para o SDK.

Selecione as versões desejadas e prossiga com as instalações aceitando as licenças.

Recomendo: Tools e Extras

Introdução ao Phonegap

Phonegap é um Framework Open Source de padronização de APIs da Web no objetivo de utilizar os conhecimentos em linguagens para Web como HTML, CSS e Javascript, para acelerar o desenvolvimento de soluções mobile Multiplataformas.

Phonegap não é um programa que você irá instalar, é um conjunto de recursos e bibliotecas para trazer muitas funções nativas dos dispositivos Mobile para linguagens e aplicativos Web-based.

Para fazer o download acesse o site oficial do Phonegap e efetue o download da versão mais atual clicando aqui.

Para mais detalhes sobre como começar e o que fazer para utilizar o Phonegap, você pode acessar documentação completa clicando aqui.

Neste tutorial iremos desenvolver uma solução Android e existem alguns requerimentos mínimos para fazer o Phonegap rodar apropriadamente, uma delas é o Apache ANT que na documentação, eles falam muito vagamente e é preciso uma atenção a mais para quem nunca trabalhou com IDEs.
[…]

Instalando o Apache ANT

Clique aqui para acessar a página de downloads do Apache ANT, faça o download do arquivo ZIP (clique aqui para baixar direto – 1.9.0) porém, é ALTAMENTE recomendado SEMPRE baixar direto no site do Apache ANT para ter certeza que você está utilizando uma versão íntegra e atualizada. Feito o download apenas abra o arquivo ZIP e extraia na raiz de seu HD (C:/ ou D:/) dentro de uma pasta chamada “ant”.

Uma vez extraído conforme imagem acima, se você está utilizando Windows, você precisará criar uma variável no ambiente de sistema para reconhecer o ANT.

Configurando Variáveis do Sistema

Entre no menu iniciar, aonde aparece Meu Computador, clique com direito, em seguida Propriedades, na janela que abrirá, ao lado esquerdo, selecione Configurações Avançadas do Sistema:

Na nova janela, procure ao final “Environment Variables” ou “Variáveis de Ambiente”, entre.

Agora vamos verificar o que temos e o que está faltando, no meu caso, já está configurado, porém aqui segue as variáveis que eu precisei criar e modificar, vamos criar uma nova variável, na sessão inferior de Variáveis do Sistema clique em Novo:

 

Vamos dar o nome de ANT_HOME para esta variável, e vamos dar o seguinte valor c:\ant de acordo com a pasta aonde você extraiu o Apache ANT:

Agora verifique se seu sistema criou uma variável de nome JAVA_HOME, se você não tiver esta variável, navegue no seu Explorer, encontre aonde foi instalado o JDK em seu sistema e cria a variável para obter um resultado semelhante a este abaixo, de acordo com a versão do JDK que você está utilizando.

Ok até aqui? Agora vamos pra uma variável que JÁ ESTÁ CRIADA em seu sistema chamada Path, nesta, será necessário chamar o diretório BIN do seu ANT e JDK.

A minha variável Path está assim:

Nome da variável: Path

Valor da variável:
[symple_box color=”yellow” text_align=”left” width=”100%” float=”none”]

C:\Program Files (x86)\AMD APP\bin\x86_64;C:\Program Files (x86)\AMD APP\bin\x86;%SystemRoot%\system32;%SystemRoot%;%SystemRoot%\System32\Wbem;%SYSTEMROOT%\System32\
WindowsPowerShell\v1.0\;C:\Program Files (x86)\ATI Technologies\ATI.ACE\Core-Static;C:\Program Files (x86)\QuickTime\QTSystem\;C:\Program Files\Java\jdk1.7.0_21\bin;%ANT_HOME%\bin

[/symple_box]

Note que é possível especificar múltiplos valores de variáveis separando-os com ponto-virgula, os dois valores por mim adicionados foram os finais em negrito. Atenção, não copie meu valor porque ele está se referindo ao meu sistema, e muito cuidado com ponto-virgula, veja q ao final da variável do quicktime ( C:\Program Files (x86)\QuickTime\QTSystem\ ) eu inseri um ponto-virgula, para não misturar os valores e adicionei os valores que direcionam para as pastas BIN do ANT e do JDK. No segundo valor %ANT_HOME%\bin utilizaremos a % para nos referirmos a outra variável de sistema criada anteriormente por nós.

Pronto? Dê OK em todas as janelas e agora vamos testar se está tudo OK.

Testando variáveis do sistema

Clique no menu iniciar, digite cmd e pressione enter para abrir a linha de comando do Windows.

Digite: java –version e pressione enter, deverá retornar os valores exibindo a versão do java que você está utilizando.

Agora digite: ant –version e pressione enter, deverá retornar a versão do seu ANT.

Este foi meu resultado:

Se você obtiver resultados que não retornam as versões das aplicações, você provavelmente configurou as variáveis do sistema de forma errada, reveja suas configurações e Variáveis do Sistema.

Deu certo!? Urray! Finalmente, agora podemos nos divertir com Phonegap.

Rodando o Exemplo Cordova Phonegap

Suponho que você está com tudo instalado, o Eclipse, o ADT Plugin e os SDKs Android. Certo?

Abra seu Eclipse, notou que ao abrir o Eclipse ele pede pra você especificar aonde será seu Workspace, literalmente este será seu espaço de trabalho aonde seus projetos desenvolvidos com Eclipse estarão situados.

Abra o arquivo do Phonegap que você baixou e extraia em alguma pasta no seu computador, inicialmente você encontrará duas pastas, DOC e LIB, entre em LIB, entre em Android, Copie a pasta example para a pasta Workspace do seu Eclipse.

Feito isto entre no Eclipse, clique em File > New > Project

Como iremos testar o primeiro exemplo do PhoneGap para Android, selecione Android Project from Existing Code

Avance clicando em Next. Clique em Browse, navegue até seu Workspace e selecione a pasta example que você colou lá, marque Copy Project into Workspace para duplicar o projeto exemplo e clique Finish.

As próximas etapas envolvem configurar o aplicativo do Phonegap, criar uma AVD e rodar o exemplo.

No meu caso, imediatamente o Eclipse alertou um erro no projeto cordovaExample aberto. Isto se dá pelo fato de que o PhoneGap que está em uso (2.6.0) não é compatível com a atual versão Android especificada neste projeto (Android 2.1).

Clique com direito na raiz do projeto cordovaExample vá em Properties, entre em Android e selecione a ultima versão do Android.

Clique OK, em seguida Limpe o seu projeto, na janela do Eclipse em Project >> Clean… Limpar seu projeto é algo que precisará ser feito sempre que alterações de libraries ou estruturais no aplicativo forem feitas, ao limpar seu projeto é compilado novamente para que possamos testar.

Vamos testar! Mas antes vamos criar uma AVD (Android Virtual Device Manager) rapidamente, lembra o botão que expliquei do AVD anteriormente? Entra la.

Clica em NEW, observe como está uma AVD que eu utilizo.

Atenção especial para o snapshot que salva muito tempo, pois ele salva o estado do emulador quando você fecha, isto é muito importante e salva MUITO, tempo do desenvolvedor por não precisar esperar o sistema Android bootar toda vez que você for testar um projeto. As demais configurações eu coloquei valores médios, buscando balancear um bom uso de performance pelo emulador Android.

Clique OK, uma vez criado seu emulador, vamos rodar nosso aplicativo pela primeira vez:

É isto! Se você seguiu este tutorial até aqui, muito obrigado pela sua atenção, espero ter ajudado, na próxima tem mais!

Dúvidas? Sugestões? Deixa um comentário!