Android/ Apache Cordova/ Dicas/ ios/ Mobile/ Phonegap

Lista completa de dispositivos móveis, tamanhos e densidades

density

Quando o assunto é criar para dispositivos móveis você acaba sempre procurando qual é o tamanho da tela, resolução, densidade e basicamente isso torna qualquer app um desafio de concretizar, especialmente falando-se nos dias atuais.

Eu comentei, antes e aqui no Blog sobre esse aspecto, só que com tantos lançamentos a cada MWC, fica dificil acompanhar tudo, foi ai que alguém teve a brilhante idéia de ir agregando isso a uma lista no Wikipedia.

Boom! Não precisa fazer mais nada, esse post serve para qualquer um que encara esse problema diário em suas apps móveis, especialmente quem usa Cross-compliadores como PhoneGap(Cordova), Titanium, etc.

Só entrar e procurar no Wikipedia para qual dispositivo você procura. http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density

Android/ Google/ Mobile

Android Wear, guia inicial para desenvolvedor

Moto-360-Android-Wear

Ontem o Google surpreendeu todo mundo com um SDK específico para wearables que são dispositivos pareados com seus aparelhos com Android, basicamente o Google Wear é um Google Now, só que em seu pulso e evita assim você fica toda hora com aquela mania de tirar e colocar o celular do bolso para ver notificações ou compromissos.

Não é novidade nenhuma em termos técnicos, A própria Samsung já tinha um SDK para o Galaxy Gear e uma série de aplicativos especificos para conectar com os seus aparelhos.

A diferença do SDK da Samsung para o seu Gear e o Google Wear é que será um SDK bem abrangente, não vai ficar só funcionando apenas com Samsung Galaxys e Samsung Galaxy Gear, você pode comprar qualquer smartphone com Android e o Motorola Wear ou LG Wear que são os dois modelos lançados justamente com o Google Wear e parear ambos e boom! Você tem eles perfeitamente casados, fico imaginando aqui quantos Google Wear Xing Lings vão aparecer depois dessa novidade, já que smartphones Xing Lings estão com os dias contados no Brasil.

Pois bem, me inscrevi no Preview do SDK e ganhei acesso ao SDK, para encurtar um pouco o post e fazer valer cada imagem, que por sí só valem mais do que mil palavras, eu gravei um rápido video no Youtube como será esse workflow de desenvolvedores usando o SDK do Google Wear.

O código fonte está disponível no GitHub.

Android/ Apache Cordova/ Dev. Software/ Dicas/ Notícias/ Open-source/ Phonegap

A fragmentação do Android e a dor de cabeça de desenvolver nativo

frag_droid_brands

frag_droid_brands

É fato e não tem como argumentar com dados, desenvolver para Android é um saco do ponto de vista nativo, na RIACycle cobramos muito mais caro para Android do que para iOS, por que justamente o cliente muitas vezes não entende o tamanho do problema que é para criar para dispositivos com Android.

[pullquote align=”left”]Relatório completo da Open Signal aqui.[/pullquote] E com base em quê para fazermos isso? Vejamos, sem dados eu não tenho como argumentar com você que lê agora, mas assuma que eu consegui os dados disponíveis aqui. Claro que isso não remete a realidade global, mais os dados podem ser comparados ao que temos no Brasil, você conhece alguém com smartphone que tenha o Android instalado? Percebeu qual a marca dele e o tamanho? Qual versão ele usa?

Esse relatório da Open Signal é basicamente o que eu tenho lutado nos últimos tempos e eu sempre venho com as seguintes perguntas em sequência:

[quote style=”1″] Para qual dispositivo Android você quer fazer?
Você quer fazer nativo ou usando tecnologias alternativas?[/quote]

Até ai, o cliente já está com o pé atrás e pergunta, Ah! Mais tem preço diferenciado? Sim, veja só, embora o Google tenta ao máximo lançar bibliotecas de compatibilidade entre diferentes versões da API, a questão é o mesmo aplicativo nativo que via rodar no Android 2.3 vai rodar no Android 4.2. A grande diferença é que você vai roda-lo mais lento no 2.3 e mais rápido no 4.2. Por que consequentemente quem está com o Android 4+ tem um aparelho no mínimo melhor.

Quem cria jogos como é nosso caso, o problema ainda é mais sério, já que você além de ter a dificuldade de trabalhar com diferentes tamanhos de telas, densidades, você tem que se preocupar com o consumo de energia da bateria.

frag_droid_

Um dos pontos chaves para trabalhar com a plataforma é a questão da API. Como mencionei rapidamente logo acima, é difícil você fazer isso de forma menos trabalhosa no Android, por mais que você queria, você vai acabar abrindo mão de um comportamento específico de navegação ou recurso e adotando um compatível com o nível de aplicativo que seu cliente quer.

O Google até se esforça nesse quesito e até com louvor nesse aspecto, mas é raro não ver algum desenvolvedor falando mal desse kit, justamente por que é limitante e vez ou outra você vai acabar implementando uma nova usando algum fragmento seu próprio ou criando um novo tipo de layout ou animação para superar as espectativas de seu cliente.

Claramente o que temos visto nos últimos 8 meses é que finalmente o cliente entendeu que o mercado de Android no Brasil é dominado pela Samsung, e fica mais fácil criar um aplicativo que rode apenas para ele, porém você não vai querer fazer um App apenas para uma marca, você quer fazer para o público em geral e isso cria uma falsa espectativa de que vai ficar bonito em tudo que é dispositivo.

Já viu o tanto de fabricante que existe?
frag_droid_brands

Imagine ter que criar vários deploys para diferentes marcas ou fabricantes? Haja recurso para isso.

Está tudo perdido? Claro que não, tudo depende de quanto você ou seu cliente está disposto à gastar na hora de criar as Apps, sempre a alternativa mais barata quando se não tem tanto prazo e dinheiro é usar cross-compilação, que no caso o Phonegap tem ajudado bastante.

A grande vantagem do phonegap é que você rapidamente pode criar Apps para peças publicitárias ou games em html5 ou até mesmo com Adobe AIR e usar uma API unificada e isso meu amigo, atrai e muito os olhos de quem desenvolve.

Leiam

Android/ App da Semana/ Cloud/ Mobile

App da semana: Melhor cliente de SSH para Android

juicessh

juicessh
Juice SSH é o melhor cliente que eu já testei para conexão de SSH até hoje, Sentia falta de um cliente tão bom quanto esse, ajuda muito quando você está no shopping ou viajando e quer dá uma de Macgyver nas suas instancias em especial da AWS, Linode.

Só pegar e baixar aqui é grátis.

Fica a dica aqui para quem tem juízo e possui um dispositivo Android.

No meu Galaxy funciona lindo.

[Atualizado] Eles estão com uma promoção, se você testar, e escrever algo nessa página, eles vão te dar uma versão PRO na faixa.

Android/ ios/ Pessoal

Android Alerta: Cuidado com que o seu dispositivo envia quando está conectado

android_malware

android_malware

Quando se trata de celular, eu sou cético em sair instalando tudo que tem por ai, por mais gratuito e bem polído o aplicativo seja. Quando sobra aquele tempo eu investigo  um pouco a mais o que o app trás. E pasmem, Todos os Apps que eu baixo 2 em cada 5 querem os meus dados como ‘lista de contatos’, última localização válida, quais serviços estão sendo executados no exato momento.

Mesmo o Google com uma batalha de gato e rato e implementando novas coisas, mesmo assim tais Apps são só descobertos se você desconfiar.

Se você tem um Android, você tem a grande facilidade de monitorar isso com maior clareza, já que você é responsável pelos seus dados e toda fabricante (Apple/Google/Microsoft/RIM) afirma, você é quem deve dizer se deixa ou não acessar tais informações.

Ontem eu queria instalar um App grátis no meu Android, para manter a descrição intácta e preservar os autores, digamos que ela seja uma to-do-list. É sempre bom ficar de olho na concorrência e para minha surpresa, mesmo não pedindo autorização a lista de contatos a App tinha um serviço para tal coleta. Acreditem ou não o App faz duas instalações do aparelho, 1 que é o app propriamente dito e outra é o serviço.

Afim de estudar um pouco à mais essa perceção de captura de dados eu começei a debugar o Aparelho, mesmo com o .apk inacessível você consegue ver os serviços em questão e ver o que eles rodam.

Você pega o ADB e começa a dedilhar o que é exposto, mesmo assim não dá para saber muita coisa além do nome do serviço rodando que você também pode ver direto do Android.

Pesquisei como capturar o tráfego e o que estava saíndo do Android, e acabei com esse link que indico para você baixar e testar em seu próprio aparelho.

No final das contas, realmente o App copiava meus contatos apenas com e-mails, enviava minhas últimas coordenadas de GPS válidas e algumas variáveis métricas para saber que aparelho eu estava utilizando. Ficando apenas o ponto crítico e imoral de coletar meus dados pessoais.

Fiquem espertos com muita vantagem! Cabe a você fazer tais denúncias.

AIR Mobile/ Android/ Apache Cordova/ ios/ iPad/ Iphone/ JQuery Mobile/ Phonegap/ Tablets

Apache Cordova vs Adobe AIR para dispositivos móveis

cordova_logo

É bom ter competitividade na esfera web, assim nasce projetos fantásticos que ajudam o desenvolvedor a criar soluções práticas e rápidas.
Este é o caso do Apache Cordova aka “Phonegap”, o Cordova tem surpreendido diversos desenvolvedores móveis, pela sua praticidade em acessar recursos nativos do aparelho para diferentes plataformas móveis, assim como o Adobe AIR o Apache Cordova te ajuda de uma maneira fácil acessar calendário, contato, notificações, alertas, vibrar, geolocalização, compasso e uma diversidade de novas funções built-in que vem no seu celular.

Depois de gastar um bom tempo estudando seu modelo, seu comportamento e como ele trabalha, decidi escrever um post sobre ele e compara-lo ao Adobe AIR, o que nesse caso eu tenho mais intimidade.

Assim como em qualquer tecnologia, você tem os pros e cons, acho que com isso você já tem uma noção maior do que usar e o que não usar, colocando em mente que cada caso é obrigatório analisar primeiro antes de decidir.

Apache Cordova

Pros:

  • Atinge 6 plataformas com uma só API
  • 90% de sua API já é built-in ( Vibration, BatteryLevel, Menu, Alertas, Calendário, Contatos)
  • Possibilita você criar suas extensões próprias com facilidade
  • Larga comunidade e alta frequência de builds.
  • Curva de aprendizagem muito rápida
  • Arquivo de instalação leve máx (4mb)
  • Performance de execução do App e efeitos de transição beira o nativo.
  • Interface pode ser feita em HTML/CSS/JS o que muito designer pode criar suas próprias Apps facilmente.
  • Componentes são criados e desacoplados em tempo de execução
  • Interfae é interpretada por um navegador interno WebKit

Cons:

  • Diversos frameworks para UI, faz você se perder em qual usar para seu projeto
  • Não tem suporte a HTTPS
  • Não suporta gestos por padrão, você tem que usar biblioteca externa para isso.
  • Ainda para dispositivos ios você tem que colocar o velho POG em ação para aceleração de hardware
  • Documentação é pobre de exemplos
  • Sem suporte a SQlite por padrão
  • Não suporta encriptação do sqlite
  • Suporta transferencia de dados em XML/JSON

 

Adobe AIR  3.5 para mobile

Pros:

  • Atinge apenas (Android 2.3.3+, ios 3.1+ e Blackberry Playbook)
  • Ciclo de vida de componentes baseado em eventos
  • Suporte a gestos por padrão
  • Suporta transferencia de arquivos em AMF/AMF3/JSON/XML
  • Suporta HTTPS/ SQLite/ Webcam/Audio e Video
  • Live stream de videos
  • Componentes já pré-fabricados usando o Flex Framework
  • Performance de 60fps quando usadas as classes Stage3D
  • Documentação extensa

Cons:

  • Arquivo de instalação ~10mb o que é grande para se transmitir via 3G
  • Interface é compilada e rendenizada
  • Suporta recursos nativos apenas se você extender com o ANE
  • Rendenização de texto é um pesadelo
  • Layout fluido para diversas telas diferentes é um POG gigantesco
  • Performance lenta quando se tem mais de 5 views
  • Ciclo de 24fps deixa qualquer celular com Android 2.3.3 lento
  • Não melhora o gerenciamento da bateria.

 

Claro que tem outros pros e cons de cada tecnologia, só que essas são as mais corriqueiras que você vai ver em grande parte dos casos quando for escolher.

E qual devo usar? Essa deve ser sua pergunta agora depois de ter lido os pros e cons. Minha resposta é vai depender de seu caso e o que você precisa fazer.

Um exemplo é, se você vai fazer jogos, eu lhe aconselho usar o Adobe AIR, já que a performance é melhor e muito mais fácil para criar jogos, agora se você vai fazer uma App para empresa que ela coleta informações de inventário, informações de cliente ou um App para registro de compras, o Apache Cordova é seu melhor parceiro.

Depois de duzias de Apps escritos, eu estou considerando o Apache Cordova como primeira opção e logo em seguida o Adobe AIR para boa parte dos Apps que escrevo diariamente.

Pergunto a você quais foram seus maiores problemas entre as duas plataformas?

Android/ Blackberry/ Flex/ Flex Mobile Framework/ HTML 5/ HTML5 / CSS3/ JQuery/ JQuery Mobile

Criando uma lista de scroll infinito para seu próximo projeto Mobile

scroll_inifinito_1

Coisa boa na vida é ter desafios, puxa daqui e puxa dali, e acabamos com uma idéia nova em um novo projeto não é verdade? Outra coisa melhor é você ter alunos onde você dá suporte o tempo todo, é o que acabou motivando a criação desse artigo.

Independente de qual é seu próximo projeto, você vai acabar querendo implementar isso uma vez na vida no seu próximo projeto mobile.

Sorte sua se seu próximo projeto for escrito em Flex Mobile ou JQuery Mobile.

Como funciona o Scroll Inifinito?

Independente do tamanho da tela de seu dispositivo, você pode calcular a altura da tela disponível no aparelho vs. altura que o conteúdo produziu para ser disponibilizado, sendo que você pode pegar a posição atual da barra de rolagem “scroller” quando ela atingir a altura  total do conteúdo ou seja, quando ela não tiver mais para onde deslizar até o final.

É ai onde entra o scroll inifinito, você pegando essas variáveis e fazendo o calculo direito, você pode fazer um Append ou incrementar os elementos de uma lista existente, seja Array, Lista, Datalist não importa, você pode implementar isso de maneira fácil usando o seguinte calculo.

 

posicaoAtualDoScroll == ( tamanhoAtualDaLista – tamanhoDisponivelNaTela)

 

Assim, você pode ir incrementando a lista se a barra de rolagem atinge o tamanho máximo disponível na tela e com isso vai paginando os resultados, tanto localmente quanto via chamada de processo remoto RESTful,RTMP,Ajax.

 

Versão Flex Mobile

Para fazer no Flex Mobile, você precisa conhecer bem a arquitetura Spark, uma vez que é desacoplada, a interface do componente, você pode começar investigando o Skin atual do componente <s:List/> até chegar duas propriedades importante do Skin que fazem menção ao componente em sí, dataGroup e scroller , ambos são peça fundamental para começar a implementar tal tarefa.

O dataGroup é onde os dados são guardados na lista e scroller é o componente que faz a barra de rolagem, é com ele que observamos a mudança acontecendo da posicaoAtualDoScroll e assim fazer o uso da formula  de condição e carregar mais itens.
Já que eu observo a mudança de posição do Scroller, eu tenho que chegar até o componente e escutar via EventListener qual é a propriedade que está sendo modificada, para isso o framework do Flex tem o evento PropertyChangeEvent, ele me dá o novo valor que a propriedade sofreu.

As propriedades em questão do scroller que eu quero saber são “verticalScrollPosition” para posição vertical e “horizontalScrollPosition” para posição horizontal.

Então sabendo qual é as propriedades que eu tenho que olhar eu procuro alinhar a formula usando o novo valor menos o tamanho atual da lista sobre o tamanho da tela.

Acabei criando o seguinte código:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
		xmlns:s="library://ns.adobe.com/flex/spark" title="HomeView">
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayList;
			import mx.events.FlexEvent;
			import mx.events.PropertyChangeEvent;
 
 
			[Bindable]private var dados:ArrayList = new ArrayList();
			private var proxima_pagina:int = 20; // numero de itens para carregar
 
			protected function loadItens(event:FlexEvent):void
			{
				for (var i:int = 0; i <19; i++) 
				{
					var item:Object = new Object();
					item.label = "Item "+i;
					dados.addItem(item);
				}
				lista.scroller.viewport.addEventListener(PropertyChangeEvent.PROPERTY_CHANGE,getPosicao);
 
			}
 
			private var posicao_anterior:int;
 
			protected function getPosicao(event:PropertyChangeEvent	):void
			{	
 
				if(event.property == "verticalScrollPosition"){
 
					if(event.newValue == (event.currentTarget.measuredHeight - event.currentTarget.height)){
							carregarMaisItens();
					}
				}
			}
 
			private function carregarMaisItens():void
			{
				var indice:int = dados.length;
 
				for (var i:int=0;i<=proxima_pagina;i++) 
				{
					var item:Object = new Object();
					item.label = "Item Carregado "+(i+indice);
					dados.addItem(item);
					trace(item['label']);
				}
 
 
			}
 
		]]>
	</fx:Script>
	<s:List id="lista" dataProvider="{dados}" creationComplete="loadItens(event)" width="100%" height="100%">
 
	</s:List>
</s:View>

 

Veja que além do scroller me dá as propriedades de posição do verticalScrollPosition e horizontalScrollPosition, você precisa usar a propriedade reservada dele para pegar essas mudanças acontecendo, é como se fosse uma caixa onde a barra de rolagem vai indo porém é pre-definido um espaço onde isso pode acontecer, que é o caso da variável viewport.

 

Versão JQuery Mobile

Para fazer em JQuery mobile, é também a mesma técnica, porém uma ressalva, o componente de lista do JQuery Mobile requer que você dê um refresh no listView, é uma espécie de renderização dos itens para aplicar os estilos padrões de CSS.

A diferença entre Flex Mobile e JQuery Mobile é que no Flex eu adiciono direto ao componente, já que o pai View não é passível de ter o Scroller, já no caso do JQuery Mobile como tudo é HTML e o DOM é manipulado diretamente no documento, eu escuto as mudanças do $(window) que é a janela ou tamanho da tela disponível, assim comparo através da mesma fórmula o scrollTop que basicamente é equivalente a verticalScrollPosition e diminuo do tamanho da lista menos o tamanho disponível da tela.

O código acabou ficando assim:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<html>
<head>
	<title></title>
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
	<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function($) {
 
 
 
 
 
	carregarItens(20); // 20 itens 
 
 
 
 
	$(window).scroll(function()
	{
	    if($(window).scrollTop() == $(document).height() - $(window).height())
	    {
	    	  carregarItens(20); // carrega sempre 20 itens
	    }
	        
	    	
	});
 
 
 
 
});
 
 
 
 
function carregarItens(pagina){
	var tamanhoLista = $("#lista li").length; // tamanho atual da lista
	for (var i = 1; i < pagina; i++) {
		var indice = i + tamanhoLista;
		$("#lista").append('<li data-theme="c"><a href="#page1" data-transition="slide"> Item '+indice+'</a></li>');
		$("#lista").listview('refresh');
	};
}
</script>
<!-- Home -->
<div data-role="page" id="page1">
    <div data-theme="d" data-role="header" data-position="fixed">
        <h3>
            Exemplo Lista
        </h3>
    </div>
    <div data-role="content" style="padding: 15px">
        <ul id="lista" data-role="listview" data-divider-theme="d" data-inset="false">
            <li data-theme="c">
                <a href="#page1" data-transition="slide">
                    Item
                </a>
            </li>
        </ul>
    </div>
</div>
</body>
</html>

Da próxima vez que você ver no Twitter ou no Dzone uma lista de scroll infinito, você já saberá como implementa-la.

 

AIR 3.0/ AIR Mobile/ Android/ Flash Player 11

Flash Player 11 e Adobe AIR 3.0 lançados oficialmente

Está acontecendo entre os dias 01 e 05 de Outubro o Adobe MAX 2011. Como todo ano da conferência a Adobe libera novidades para sua familia enorme de desenvolvedores e designers; E uma dessas grandes novidades foram as mais esperadas no mundo dos desenvolvedores o Adobe AIR 3.0 e o Flash Player 11.


Para você ter uma idéia, o Flash Player 11, dá suporte nativo a 64 bits, finalmente os navegadores vão parar de travar e você não tem que ficar usando alguma gambiarra.

Dentre várias novidades que eu já destaquei aqui . O Flash Player 11 sem dúvidas está mais que redondo, eu arrisco falar que era para ser esse o Flash Player 9, lançado a 5 anos atrás. Em fim, nada acontece como agente espera.

Se você tem o Flash Player 11 beta como eu tenho, desinstale totalmente e instale o novo, a coisa muda da água para o vinho, mesmo sendo beta, alguma coisa eles fizeram de voodoo do beta para essa versão final que ficou bem mais rápida.

Veja aqui a lista completa de novidades do Flash Player 11 e surpreenda-se.

Ah ! E claro, atualize agora o seu, clique aqui.

Outro produto run-time e cada vez mais se tornando carro chefe da Adobe principalmente no mundo móvel é o Adobe AIR 3.0.

Sensacional é a novidade do Native Extensions, eles acertaram em cheio nessa novidade que basicamente é, você pode criar N possibilidades para a API do Flash/Flex/AS3, sem a necessidade de esperar a Adobe criar APIs para tal, isso elimina ela de uma grande responsabilidade de colocar essas API prontas, e encoraja a comunidade de desenvolvedores de criar suas próprias soluções, isso me lembra muito as .dll do Windows no antigo visual basic.

Comparações a parte, essa foi a melhor release ou seja pulo do gato no Adobe AIR 3.0. Estou pensando nas incríveis capacidades que as aplicações móveis terão em relação ao SDK nativo que cada plataforma tem.

Veja aqui a lista completa das novidades do Adobe AIR 3.0. Tem inúmeras, como já relatei aqui.

Atualize seu Adobe AIR 3.0 no seu Android, PC agora, veja como aqui.

AIR 2.7/ AIR Mobile/ Android/ Flex/ Flex 4.5/ Flex Mobile Framework

Criando seu primeiro aplicativo Flex 4.5 Mobile para smartphones Android parte (1 de 3)

Depois de muito tempo sem tempo, olha que controvérsia, acabei com algumas horas livres essa tarde e aproveito para escrever esse post.
Quer criar Apps para Android com o Adobe AIR e Flex? Siga a receita abaixo para isso.

Ja é sabido de sua parte que o Flex cria apps nativas para Android de forma hiper simples. Se você é acostumado ao seu workflow de componentes, ciclos de vidas, você irá facilmente criar Apps elegantes, rápidas e intuitivas para dispositivos móveis.

O Framework do Flex, que usaremos é o Flex 4.5 com overlay do Adobe AIR 2.7, que conta com 4x mais performance do que o AIR 2.6. Em suma, o Flex roda em dispositivos móveis por que o AIR Run-time roda no Android.

Só que antes de você sair comprando ai seus dispositivos xing-lings ou baratinhos com o Android para testar suas criações artisticas, aconselho ler esse POST.

Para começar a brincadeira, você vai precisar de alguns ingredientes, vamos aos itens:

Antes de configurar alguma coisa, é super importante que você tenha em mente a seguinte afirmação. Eu entendo os riscos e serei um bom garoto(a), e nunca irei portar nenhum App meu com Datagrid de 100 registros dentro de uma App móvel, não farei Zilhões de operações.

Ok! Agora pode continuar.

Criando uma conta no Google e no Android Market

Esse passo é o mais simples que você encontrará nesse post, duvido que você não tenha uma conta no Google, vai dizer pajé que tu não tem um @gmail.com ? Uma continha perdida do Orkut? Ah! você vive em outro mundo que não é esse, volta para lá de onde tu veio vai! Esqueça isso de Mobile.

Ok, animos acalmados, criou a conta? Ah! Já tem? Ótimo, o próximo passo é registra-se no Android Market e se tornar um publicador de Apps lá. O processo é mega simples, entre no endereço https://market.android.com/publish/Home
android_publish_home.

Coloque seu login e senha e clique em Login, como você ainda é novato, vai aparecer outra tela perguntando seu Developer Name, dados de contato e telefone. Lembre-se coloque um nome de guerra, nome profissional, nada de vitinho, Vikky, Fofinha, LindinhadoAndroid, algo que passe credibilidade aos seus futuros usuários, Caso você seja uma empresa nem preciso fazer essas recomendações, basta colocar o nome da empresa que você quer usar como Developer Name no formulário.

android_publish_info

Clique agora em Continue.

Depois disso, você precisará dos

US$25 dolares

para fazer a sua inscrição no programa por 1 ano, se você tem conta no Google Checkout basta gastar por lá, caso contrário use algum cartão de crédito de qualquer bandeira que aceite transações internacionais.

android_publish_pagamento

Pronto, você está com a conta no Google Android Market criada e é só aguardar a liberação. Em média esse processo é quase imediato, em outros pode levar cerca de 1 dia no máximo. A coisa é rápida, então fica de olho no e-mail de boas vindas quando tudo for aceito pelo Google.

Aqui está minha dashboard no Android Market.

android_publish_dashboard

Configurando o Flex 4.5.1 SDK para usar o AIR 2.7 SDK

Como o SDK do Flex 4.5.1 ainda vem com suporte ao Adobe AIR 2.6 que é cerca de 4.x mais lento tanto no Android quanto no IOS, você vai precisar configurar seu SDK, esse processo agente chama de “SDK Overlay”, que é basicamente um CTRL+C e CTRL+V em alguns diretórios que sobrepõem arquivos antigos do AIR 2.6.

Baixou o AIR 2.7 SDK? Ok, feito isso extraia ele para um diretório de sua confiança, que seja simples de acessar. O pacote contendo o AIR 2.7 SDK tem os seguintes diretórios e arquivos.

air_2.7_sdk

Se você tem um igual, sinal que vai dar tudo certo, meio caminho andado.

Baixou o Flex 4.5.1 SDK? Ótimo, faça o mesmo processo do AIR 2.7 SDK e descompacte ele no seu diretório predileto, eu particularmente sempre deixo em um diretório meu chamado SDKs, porém nesse exemplo tem pessoas que gostam de deixar no mesmo diretório dos já existentes SDK do Flash Builder 4.5.1.

Ok, se você tem o SDK já descompactado, basta copiar o conteúdo da pasta onde você descompactou o AIR 2.7 SDK dentro da pasta do Flex 4.5.1. SDK. A idéia é sobrescrever os já existentes.

Feito? Ok, próximo passo é instalar o Flash Builder, a ferramenta perfeita para você criar suas apps, não só para Android como para outros devices, ios, BlackBerry Playbook, Web e Desktop.

Flash Builder Instalado? Perfeito, vamos agora configurar o ambiente Android para rodar sua app no console nativo que o próprio google disponibiliza.

Configurando o Android Console

Já tem o Java instalado em sua máquina? Então pule essa etapa, ela só serve mesmo para quem nunca usou o JDK ou tem apenas o JRE.

Para você testar no console, você precisa do JDK(Java Development Kit), que já vem tudo em um, então dependendo de seu sistema operacional, você precisará fazer alguns processos manuais, já no Windows é meio for dummies, é next-> next-> finish.

Baixou o correto referente ao seu OS? Instalou? Ótimo, pois agora precisamos definir as variáveis de ambiente do JAVA_HOME nas configurações globais do sistema operacional.

No Windows, vá em Iniciar – > Computador -> Botão direito do mouse -> Escolha propriedades -> Escolha aba Configurações Avançadas -> Variáveis de ambiente.

Adicione um novo registro na suas variáveis de ambiente com o nome JAVA_HOME. Olhe o exemplo abaixo.

jdk_java_home

Se você configurou tudo certinho, você pode testar no prompt do DOS do windows digitando java -version. Vai aparecer isso aqui ó.

java_version_console

Agora você está pronto para o Android SDK.

Baixando e configurando o Android SDK

Baixou o SDK? Então descompacte em um diretório de fácil acesso, eu coloquei o meu em C:/android-sdk. Para facilitar digitação de comandos.

Execute o SDK Manager, que é o carinha responsável por baixar todos os arquivos necessários do Android SDK da nave mãe Google.

android_avd

Pela primeira vez, esse processo dependendo de sua conexão com a internet, leva uma média de 1 hora para baixar todos os arquivos para seu computador.
Depois disso ele fica como o meu aqui.

android_sdk_dir

Ok, tudo configurado e instalado, vamos verificar se está mesmo. Com o mesmo comando que fiz para o java -version, usarei agora o comando adb version que é o Android Debug Bridge , para ver se executa corretamente.

android_adb

Se aparecer como na imagem acima, é sinal que tudo está correto e perfeito para criarmos nosso Android Emulator, onde iremos simular o sistema operacional Android. Prontos para esse passo?

Ah! Que esqueci, que depois que ele instalar tudo, ele vai pedir para você fechar o SDK Manager e abrir novamente, para que as alterações sejam aplicadas.

Criando o Android Emulator

Ok, volte agora ao SDK Manager e escolha a opção Virtual Devices.

android_virtual_devices

Veja que nesse meu eu já possuo 2 devices virtuais, para criar outro basta clicar em “New…”.

android_new_console

Preencha os dados de seu virtual device, assim como mostra na imagem acima, veja que eu não esqueci de criar usando o Android 2.2 API level 8, que é o necessário para o Adobe AIR rodar e consecutivamente o Flex. Como eu quero apenas testar a App nativa no dispositivo virtual eu deixei as outras configurações padrão, salvo apenas para a memória alocada de 100mb para esse console. Agora clique em “Create AVD”.

O AVD foi criado, só que agora falta executar, esse processo é bem gastante se você tem pouca memória na máquina, típicos 2GB, demora aproximadamente 20min até 30min para ele começar realmente executar, Eu por exemplo tenho 8Gb de memória e leva uma média de 5min. Se você tiver problemas na hora de executar veja se o JVM está setado corretamente.

Para executar, basta clicar em “Start…”.

android_starting

Essa tela preta é demorada, então aproveita e vai tomar um café, falar com sua tchutchuca.

….
……………
Passados alguns minutos. E eis que temos a tela inicial do Android rodando.

android_started

Android rodando, navegando na Web, agora só temos um problema, não temos o Adobe AIR instalado para testar a App, como fazer?

Instalando o Adobe AIR APK no seu emulador

Se você é por natureza curioso, dúvido você não ter bisbilhotado o SDK do Flex que você fez o overlay(Sobreposição) do AIR 2.7 no Flex 4.5.1 SDK. Abra esse diretório para você navegar nele, dentro do SDK você vai encontrar o nosso famoso AIR.apk que é necessário para rodar suas Apps.

air_apk_folder

Veja que eu fiz um mapinha de onde você vai achar o run-time do AIR para seu emulador Android, existem dois, para o Device e para o Emulador, você deve usar a versão Emulador, que é com ela que você vai conseguir emular alguma coisa. Resumindo eis aqui o caminho completo em minha máquina.

C:Program Files (x86)AdobeAdobe Flash Builder 4.5sdks4.5.1_air2.7runtimesairandroidemulator

Lembre-se seu índio, que o diretório na sua máquina pode ser diferente, se não você vai reclamar depois nos comentários que não consegiu achar o tal APK.

Eu copiei o meu para esse exemplo para o diretório raiz, C:/ para facilitar agora o processo de digitação pelo prompt de comando.

Abra o CMD(MS-DOS), e digite o comandos abaixo.

adb devices

adb_devices_list

Se aparecer o nosso Emulador em execução,é por que está tudo OK.

Para instalar é super simples, digite o comando.

adb install {NOME-DO-EMULADOR} c:/Runtime.apk

adb_devices_install_sucess

Finalmente terminamos essa parte chata de configurar a máquina, seu Adobe AIR está funcionando perfeitamente no seu device, Só que como é que eu sei que ele está instalado? Tem 2 formas, vê se o resultado do comando de instalar deu certo e também indo no Emulador, clicar em
Settings -> Applications-> Manage Applications; E você vai ver o Adobe AIR instalado lá.

air_installed

Tudo pronto, agora só abrir o Flash Builder já instalado e começar com sua App Hello World. Nos vemos na próxima Etapa.

Aproveite e participe do grupo de discussão Flex-Mobile