Create your blog and photo album with postbit
Create your blog and photo album

Create new post

Content:

Upload a picture:
Tags (keywords separated by comma)

Save Cancel
Rodrigo Siqueira rsiqueira:   Followers: 32 ; Following: 31

Explore Rodrigo Siqueira's photo albums:
Chateau de Chambord (4)
Hassan Massoudy (25)
Família (1)
Photographing photographers (12)
Chile - Viña Concha y Toro (78)
Casa de Pablo Neruda em Isla Negra (51)

Como criar aplicativos para Android usando o Visual Studio da Microsoft


O Microsoft Visual Studio permite criar aplicativos multi-plataforma (Android, iOS e Windows phone) usando integração com o Apache Cordova.
Instruções: https://msdn.microsoft.com/en-us/library/dn757054(v=vs.140).aspx

1. Instale o Microsoft Visual Studio:

IMPORTANTE: Rode o instalador como "Administrador", para evitar o erro "A setup package is either missing or damaged"

Durante a instalação do Visual Studio, é necessário selecionar:
Custom (ao invés de Typical) "Cross Platform Mobile development -> HTML/JavaScript (Apache Cordova)" e também o "Common Tools and Software Development Kits": Android SDK, Apache Ant, Git CLI, Java SE, Node.js e Microsoft Visual Studio Emulator for Android
Isso vai instalar automaticamente o Cordova, Node.js, JDK, Apache Ant e Android SDK.
Se esquecer de marcar as opções adicionais (Cordova), rode novamente o instalador (vs_community.exe).

Se ocorrer erro na instalação ("Unable to locate package source"), instale apenas com as opções default, SEM SELECIONAR os componentes "HTML/JavaScript (Apache Cordova)" e nem os "Common Tools" (Ex: Android SDK, etc). E depois de instalar, execute novamente o instalador com a opção de modificar a instalação e ai selecione os esses componentes adicionais. O erro mostrava opções: Download packages from the internet ou pediu para localizar (Provide a location to search) no computador o arquivo "BuildTools_MSBuildResMsi.msi", mas mesmo encontrando o arquvio, o erro permanece. Então reinstale sem o Cordova e depois instale o Cordova (usando o mesmo instalador).

 

2. Crie um novo projeto:

File -> New Project -> Javascript -> Apache Cordova Apps

Isso vai criar a pasta com o projeto, contendo diretórios "bin", "res", "www" e arquivos como "config.xml", "www/index.html", "www/scripts.index.js", etc.

Para testar a aplicação, clique em "Build": Build -> (nome do projeto)
Ou clique direto no menu "Debug / Android / Continue", para abrir automaticamente o browser Chrome com o emulador de Android  Automaticamente vai rodar o servidor web na porta 4400 e o browser abrirá mostrando o resultado da aplicação, com o emulador de celular "Ripple". Este endereço abriu automaticamente:

http://localhost:4400/index.html?enableripple=cordova-3.0.0-NexusGalaxy
 
Se você tentar usar um webview, colocando um iframe de site externo no "index.html", então provavelmente vai precisar remover esta linha do index.html, que bloqueia iframe:
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
 
 
3. Altere o código para o conteúdo do seu próprio projeto
Clique em "Solution Explorer" para editar o "config.xml" e coloque o nome do autor, descrição, número de versão, orientação da tela (retrato e/ou paisagem) e outras configurações.

Edite também o "www/index.html" e "www/scripts/index.js" para colocar o conteúdo do seu projeto.
 
4. Defina o ícone e tela de abertura (splashscreen) do aplicativo para aparecer na tela do celular:
 
As imagens dos ícones ficam na pasta:
./platforms/android/res/drawable-hdpi/icon.png (72x72 pixels)
./platforms/android/res/drawable-ldpi/icon.png (36x36 pixels)
./platforms/android/res/drawable-mdpi/icon.png (48x48 pixels)
./platforms/android/res/drawable-xhdpi/icon.png (96x96 pixels)
 
OBS: Se não funcionar, então copie as imagens do ícone sobre estas:
./res/icons/android/icon-36-ldpi.png
./res/icons/android/icon-48-mdpi.png
./res/icons/android/icon-72-hdpi.png
./res/icons/android/icon-96-xhdpi.png
 
 
As imagens e resoluções do splashscreen ficam aqui:
res/screens/android/screen-hdpi-landscape.png (640x480 pixels)
res/screens/android/screen-hdpi-portrait.png (480x640 pixels)
res/screens/android/screen-ldpi-landscape.png (426x320 pixels)
res/screens/android/screen-ldpi-portrait.png (320x426)
res/screens/android/screen-mdpi-landscape.png (470x320)
res/screens/android/screen-mdpi-portrait.png (320x470)
res/screens/android/screen-xhdpi-landscape.png (960x720 pixels)
res/screens/android/screen-xhdpi-portrait.png (720x960 pixels)

OBS: Se o splash screen não funcionar (ex: aparecer uma tela em branco no lugar da tela de abertura), ative o plugin do Cordova SplashScreen. Para ativar um plugin, selecione (dentro do Solution Explorer) para editar o arquivo "config.xml" e clique em "Plugins".
 

5. Crie o arquivo keystore para assinar sua aplicação (veja instruções de como criar o arquivo keystore). 

Altere o arquivo "build.json", como no exemplo:

{
  "android": {
    "release": {
      "keystore": "C:/Dropbox/android-key.store/my-release-key.keystore",
      "storePassword": "(minha senha)",
      "alias": "ALIAS DO MEU APP",
      "password": "(minha senha)",
      "keystoreType": ""
    }
  }
}

 

ANTES EU USAVA o "ant.properties", mas não uso mais isso na nova versão (Visual Studio 2015):
(conteúdo antigo abaixo)
Altere o arquivo "res/native/android/ant.properties" para colocar o caminho da sua chave para assinar o app. Exemplo de como deve ficar:

key.store = /meu-diretório-do-android-key.store/my-release-key.keystore
key.alias = (Alias do meu aplicativo)
key.store.password=minha senha
key.alias.password=minha senha
 
6. Crie a versão final do APK:

Mude de "Debug" para "Release" e execute o "Build".
 

7. Publique no Google Play Store
(Veja instruções aqui para publicar o apk)

 

Problemas e soluções:

* Ao executar o aplicativo no celular, apareceu "Hello, your application is ready!" ao invés de aparecer o conteúdo real que programei no meu app.

* Como não consegui fazer o setup no Windows 7, instalei o Windows 10 dentro de uma máquina virtual (VMWare Player) e instalei do zero o Visual Studio, sem ter instalado antes JDK nem Android SDK.

Pode ter sido conflito com versões de programas anteriores (tipo Eclipse, SDK, JDK, Apache Ant, versão 32bits x 64bits, etc).
Melhor deixar as variáveis de ambiente como default pelo que é instalado com o Visual Studio:
 ADT_HOME: C:\Program Files (x86)\Android\android-sdk
 ANT_HOME: C:\Program Files (x86)\Microsoft Visual Studio 14.0\Apps
 GIT_HOME: C:\Program Files (x86)\Git
 JAVA_HOME: C:\Program Files (x86)\Java\jdk1.7.0_55
 
* Copiei o arquivo "bin/Android/Release/MainActivity-release-unsigned.apk" para o celular Android, mas ao tentar instalar apareceu a mensagem de erro:

"Describe error. There is a problem parsing the package."
Resolvi isso ao copiar o arquivo "MainActivity-release.apk" (é o assinado e não o "unsigned").

* Ao tentar instalar o apk, apareceu "App not installed". Para resolver, desinstalei a versão anterior e tentei novamente. Ai deu certo!

* Tentei instalar mas apareceu "App not installed. An existing package by the same name with a conflicting signature is already installed".
Resolvi isso ao remover (desinstalar) a aplicativo anterior.

* Durante a instalação do Visual Studio apareceu o erro: Emulators for Windows Mobile 10.0.10069 : The installer failed. Fatal error during installation. Error code: -2147023293 

* Na primeira instalação, ao mudar de Ripple para "Android Emulator", apareceu o erro: "exit code 1". Para resolver, precisei instalar a versão mais antiga do node.js (node-v0.10.28-x86.msi). Mas ai outro erro apareceu:
\android\cordova\build.bat: Command failed with exit code 8 - File MDAVSCLI
Verifique se em "Debug -> Options" aparece "Multi-Device Hybrid Apps" (fica entre os itens "HTML Designer" e o "NuGet Package Manager").
 
* Ao entrar no projeto apareceu erro na configuração do ambiente:
"Oracle Java SDK: The override value set on the Environment Variable Option Page pointed to an invalid or nonexistent location for this software."
E ao clicar em "Build", apareceu o erro: Error  C:\(path)\platforms\android\cordova\build.bat: Command failed with exit code 2, File: MDAVSCLI 1
Isso ocorreu pois eu tinha atualizado o Java JDK e mudou o path da instalação, que deve ser atualizado tanto nas variáveis de ambiente do Windows quanto no Visual Studio. Para atualizar a variável de ambiente no Visual Studio:
Tools -> Options -> Tools for Apache Cordova -> Environment Variable Overrides -> JAVA_HOME = 
Valor antigo: C:\Program Files (x86)\Java\jdk1.8.0_05
Valor novo: C:\Program Files\Java\jdk1.8.0_45
Para atualizar variáveis de ambiente no Windows 7:
digite "env" dentro do start ("Edit the system environment variables") -> System Properties -> Advanced -> Environment Variables -> System Variables -> Edit (ou New)
Variable name: JAVA_HOME
Variable value: C:\Program Files\Java\jdk1.8.0_45
 

Post by Rodrigo Siqueira (2015-05-15 21:05)

Post your comment:

Name: Email: Site:




| Explore users | New posts | Create your blog | Create your photo album |
| About Postbit | Our blog | Terms of use | Contact Postbit |


Copyright © 2017 - postbit.com