Ok, você vai aprender a criar apps móveis multiplataforma, usando o PhoneGap / Cordova e o jQuery Mobile. Porém, antes de mais nada, precisa preparar a plataforma para acompanhar o curso. Veja agora como fazer isso...
O trabalho "Criação de
aplicações Móveis com PhoneGap e jQuery Mobile" de Cleuton
Sampaio de Melo Jr está licenciado com uma Licença
Creative Commons - Atribuição-CompartilhaIgual 4.0 Internacional.
Isso inclui: Textos, páginas, gráficos e código-fonte.
Material e exemplos
Apesar do curso ser multiplataforma, daremos maior ênfase à execução em plataforma Android. Todos os exemplos funcionam em iOS também.
Todo o material do curso está publicado no Bom Programador. Os arquivos de exemplo e os exercícios podem ser acessados no Link:
Todo o material do curso está publicado no Bom Programador. Os arquivos de exemplo e os exercícios podem ser acessados no Link:
https://www.dropbox.com/sh/urqed2csq7owiyx/AABjhknysUiFmvFNCSn_s3Tma?dl=0
Para cada lição, há alguns arquivos de exemplos e exercícios. Basta baixar e descompactar o arquivo relativo à lição.
Para cada lição, há alguns arquivos de exemplos e exercícios. Basta baixar e descompactar o arquivo relativo à lição.
Requisitos de hardware e software
Usando o PhoneGap / Cordova, você pode criar apps móveis para várias plataformas, entre elas: Android, iOS e Windows Phone. Neste curso, focaremos basicamente nas aplicações Android, dando uma "pincelada" rápida no iOS.
Aplicações Android
- CPU compatível com Intel i5, com 4 núcleos;
- Pelo menos 2.4 GHz;
- Memória RAM de 4 GB;
- Espaço em Disco Livre: 5 GB;
- Sistema Operacional:
- Windows XP (32-bit), Vista (32- or 64-bit), or Windows 7
(32- or 64-bit)
- Linux: (Ubuntu): GNU C Library (glibc) 2.7 ou superior;
Ubuntu 10.04 ou superior;
- Mac OSX: 10.5.8 ou mais recente;
- Windows XP (32-bit), Vista (32- or 64-bit), or Windows 7
(32- or 64-bit)
- Usuário tem que ser administrador local da máquina
(“sudoer”, no caso de Linux);
- Android SDK:
- PhoneGap, jQuery, jQuery Mobile;
- Eclipse + ADT plugin + AppLaud plugin;
- Android SDK Tools;
- Android Platform-tools;
- Pelo menos uma versão da Android platform;
- Pelo menos uma versão da Android System Image;
- PhoneGap, jQuery, jQuery Mobile;
- Software para criar servidores de notificação: Java 6 JDK +
Apache Derby + Maven 3;
- Dispositivos Android, com cabos USB, no mínimo Android 4.x;
Aplicações Apple iOS
- iMac, MacMini ou MacBook Pro, no mínimo i5 com 4 GB RAM;
- Conta no iOS Developer Program, com certificado em dia (pelo
menos uma);
- Xcode 5.1.1 + iOS SDK 7 (talvez o 8);
- Software para criar servidores de notificação: Java 7 JDK +
Apache Derby + Maven 3;
- Dispositivos iOS (iPhone, iPad) com cabos;
Instalação Android
Eclipse
- Instale a última versão do eclipse (Luna, no momento da
preparação deste guia).
- É possível usar uma versão mais antiga? Sim, mas no máximo
a antepenúltima versão.
- Não instale eclipse com outros frameworks, incluindo
Demoiselle.
Java
Instale o Java JDK 6 da Oracle e o Apache ANT. Abra um terminal e veja se o comando “javac -version” está apontando para a versão correta.No Ubuntu: certifique-se que o pacote openjdk-6-jdk esteja instalado!
Android SDK
Baixe a última versão do Android SDK e instale, de acordo com as instruções. Se usar Ubuntu, leia essas instruções e não se esqueça de colocar no PATH as pastas %android-adt%/sdk/tools e %android-adt%/sdk/platform-tools!Após a instalação, é necessário instalar a plataforma Android e as System Images. Você precisará no mínimo de:
- Android SDK Tools
- Android SDK Platform-tools
- Android SDK Build-tools (highest version)
- Pelo menos uma SDK Platform;
- Pelo menos uma system image para o emulator, por exemplo: ARM
EABI v7a System Image;
Abra o aplicativo “SDK Manager”:
- Windows: Duplo-clique no arquivo “SDK Manager.exe”, na
pasta raiz do Android SDK;
- Mac/Linux: Abra um terminal, navegue para a pasta “tools/”,
dentro da pasta do Android SDK, e execute: “./android sdk”;
Marque:
- Android SDK Tools (Se não estiver instalado);
- Android Build Tools (Se não estiver instalado);
- Android Platform-tools (Se não estiver instalado);
Escolha uma plataforma Android (4.4.2) e instale:
- SDK Platform;
- ARM EABI System Image;
- Google API (ARM);
Atenção: Para o PhoneGap funcionar, a API 19 (Android 4.4.2) TEM QUE ESTAR INSTALADA!
Só para Windows: Marque também o “Google USB Driver”, no final de tudo (dentro de “Extras”)!
Eclipse ADT plugin
Se você pretende utilizar a IDE Eclipse, então tem que instalar o plugin para controle do Android, que é o ADT (Android Developer Tools).Agora, é o momento de configurar o ambiente Eclipse baixando o plugin ADT. Abra a janela “help / install new software” e adicione o repositório:
- “https://dl-ssl.google.com/android/eclipse/”
Depois, configure o Android SDK dentro do eclipse:
- Abra o menu: “Window / Preferences /Android ” e configure o path do Android SDK;
Crie um AVD e rode o emulador Android
Podemos desenvolver e testar apps Android rodando em um Emulador, também chamado de: Android Virtual Device - AVD. Vamos criar uma configuração de AVD para podermos rodar.Rode o “SDK Manager” e crie um AVD:
- Selecione o menu “tools” e “Manage AVDs”. Clique no botão "Create" e configure seu AVD, como esse exemplo:
- AVD name: muito importante. Escolha um nome significativo, sem espaços, nem caracteres especiais;
- Device: escolha qualquer uma. Eu uso o Nexus 4 porque a tela não é muito grande;
- Target: escolha Android 19 (4.4.2);
O resto, faça igual à imagem.
Rode o emulador! Na tela do SDK Manager, selecione "tools" e "Manage AVDs". O Seu AVD recém criado deve aparecer lá. Selecione-o e clique no botão "Start". Vai demorar um pouco, mas o emulador vai abrir e carregar o Android. Isso demora bastante... Geralmente, entre 3 e 5 minutos, dependendo da quantidade de RAM disponível.
Instalação do PhoneGap e do Apache Cordova
O PhoneGap usa o Apache Cordova. Precisamos instalar ambos. Antes de instalar o PhoneGap, é necessário instalar o Node.js (e o NPM):"node.js" e "npm" No Linux Ubuntu:
Não instale o nodejs do pacote do Ubuntu!!!!- sudo apt-get install --yes ant build-essential curl git
- sudo apt-get install --yes python-software-properties python g++ make
- sudo add-apt-repository --yes ppa:chris-lea/node.js
- sudo apt-get update
- sudo apt-get install --yes nodejs
Teste com os comandos:
- node --version (tem que ser pelo menos 0.10.x)
- npm --version (tem que ser pelo menos 1.4.x)
"node.js" e "npm" No Mac OSX:
Há um instalador (*.pkg) do Mac no link: http://nodejs.org/dist/v0.10.31/node-v0.10.31.pkgÉ só baixar e instalar.
"node.js" e "npm" No Microsoft Windows:
Instale o Node.js a partir do site (baixe o msi):
Crie duas variáveis de ambiente, para Linux:
Crie as variáveis “ANDROID_HOME” e “JAVA_HOME”, de preferência dentro do arquivo “/etc/bash.bashrc” (últimas duas linhas):
- http://nodejs.org/dist/v0.10.31/node-v0.10.31-x86.msi
(32 bits);
- http://nodejs.org/dist/v0.10.31/x64/node-v0.10.31-x64.msi
(64 bits);
PhoneGap e Cordova, nas três plataformas:
Abra um Terminal ou Prompt de Comandos e digite:- npm install -g phonegap
- npm install -g cordova
Crie duas variáveis de ambiente, para Linux:
Crie as variáveis “ANDROID_HOME” e “JAVA_HOME”, de preferência dentro do arquivo “/etc/bash.bashrc” (últimas duas linhas):
- export
ANDROID_HOME=/opt/android-sdk-linux
- export
JAVA_HOME=/usr/lib/jvm/java-1.6.0-openjdk-i386
Como testar se tudo funcionou
O Emulador Android funciona melhor em máquinas com SO de 64 bits. Ele pode dar problema com mensagem de erro se sua máquina for 32 bits.
Você deve ter pelo menos 1 emulador criado (AVD)!
- Abra um Terminal e vá para sua pasta home: “cd ~”, No MS Windows, basta abrir um prompt de comando que você já estará em sua pasta "home";
- Crie um projeto: “cordova create teste com.exemplo.teste
teste”;
- Adicione a plataforma Android: “cd teste” e “cordova
platform add android”;
- Rode o aplicativo: “cordova android run”;
Depois de algum tempo, você deverá ver o emulador com uma tela branca com o símbolo do PhoneGap no meio, escrito: "Device Ready".
Nenhum comentário:
Postar um comentário