Apache Cordova/ C#/ Mobile/ Phonegap/ Windows Phone

Apache Cordova ganha um forte aliado Visual Studio 2013 Update 2

visual_studio_cordova

A Microsoft, em especial seu time Web/Mobile tem me surpreendido absurdamente para o lado positivo.

O Time mobile da Microsoft estava em constante suporte ao Cordova desde 2011 com a possibilidade de criar Apps apoiando a iniciativa com o uso do Cordova para criar apps HTML5, CSS3 e Javascript embutidos junto ao Cordova como apps híbridas.

Hoje ela acaba de dar mais uma força absurda para o Cordova, suportando nativamente o Cordova no Visual Studio 2013 Update 2.

Quem possui o Visual Studio 2013 e quer atualizar para dar suporte, só baixar o Update 2 para sua felicidade.

A combinação WinJS com Cordova, é um grande avanço da parte da Microsoft, tirando ainda o suporte nativo ao C# com a plataforma Xamarin.

Hoje basicamente a Microsoft é a única empresa onde o suporte a tecnologias Open Source tem crescido à largos passos.

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

HTML 5/ HTML5 / CSS3/ ios/ iPad/ Mobile/ Tablets

5 segredos para optimizar seu CSS para dispositivos móveis

css3-markup

Eu estou começando a ter uma relação amigável com o CSS à medida que eu vou me convencendo que sem ele é impossível ter algo plausível de uso em dispositivos móveis.

A grosso modo você olha para o CSS e pensa, há é molezinha, mel na chupeta, pegar um framework pronto e dizer, Olha o que eu fiz! É absolutamente relutante quando se diz à respeito DIY.

Eu começo pelo fato que tem tanta opção de frameworks em javascript, frameworks responsivos que você friamente pode não re-inventar a roda, mais no fundo você dificilmente vai entender por completo se você não estudar o que eles fazem.

Pois bem, juntei abaixo 10 segredos que eu achei no CSS que são bem específicos para dispositivos móveis, seja para adaptar ao phonegap ou ao firefox OS, você pode usar essas técnicas e não passar pelos problemas que eu passei.

Claro que nem todos os segredos pode ser assim um SEGREDOOO para alguns leitores, o importante é manter a descrição.

 

1- Limpando a bancada (Reset)

Antes de começar qualquer coisa em HTML, você precisa se normalizar, é igual a mãe mandando você arrumar o quarto, ou o mecânico chefe pedindo para você limpar a bagunça no final do expediente.
Trabalhar com CSS para N plataformas requer esse sacrifício, existe o normalizecss que é um pouco mais amplo, envolvendo desktop.

Eu prefiro a seguinte receita, limpe tudo antes de começar e me permita fazer as coisas do meu jeito. E aqui é a minha solução.

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
        overflow: hidden;
}

Quando você olha para cima, vê um tanto de tag sendo atribuído margens, espaçamentos, tamanho de fontes, alinhamentos, tudo isso faz parte, o mais importante de todos ali é a respeito do font-size, deixando a fonte sempre em um tamanho plausível para ajustes no que se diz respeito a telas de baixa, media e alta densidades.

2 – Media Queries

A galera menciona isso como design responsivo, tem o flexbox que está vindo. Eu chamo media queries particularmente de divisor de águas; É o santo graal para criar designs que respondem ao tamanho da tela e assim deixar qualquer usuário feliz.
Veja um exemplo típico abaixo:

Só que media queries possue mais e mais opções do que um simples layout fluido, o principal papel não é só detectar tamanhos mais densidades em telas, como em terra de mobilidade isso é um assunto amplamente diferente, fica difícil adaptar só ao tamanho da tela do usuário, existe muito terreno para ser explorado, o exemplo acima, o código fica assim:

<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, initial-scale=0.75, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"/>  
<title>Ola Mundo</title>
<style type="text/css">
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	overflow: hidden;
}
h2, h3, h4, p {
	color: #fff;
	font-family: sans-serif;
}
#container {
	width: 100%;
	display: inline-block;
}
.caixa {
	width:16.5%;
	height: 100px;
	text-align: center;
	float:left;
	display: block;
	overflow: hidden;
	background-color: #0F9ED8;
	padding-left:20px;
	padding-right:20px;
	margin:5px;
}
/* para dispositivos de baixa densidade */
@media screen and (max-width : 320px) and (max-height: 480px){
body {
	transform:none;
	transform:translate3d(0,0,0);
}
.caixa {
	width:100%;
	background-color: #07508A;
	margin:0 auto;
	margin-bottom: 5px;
}
h2, h3, h4, p { 
	font-size: 22px;
}
}
/* para dispositivos de média densidade */
@media screen and (min-width:480px ) and (min-height: 800px){
body {
	/* brincando um pouco de 3D */
		transform:translate3d(0,0,0);
		transform-style: preserve-3d;
		transform-origin:30% 100%;
		transform-position: top right;
		transform: perspective(700px) rotateX(30deg) rotateY(30deg) rotateZ(-5deg);
}
h2,h3,h4,p {
	color:#000;
	font-size: 36px;
}
.caixa {
	width: 100%;
	margin:0 auto;
	margin-bottom: 5px;
}
}
</style>
</head>
 
<body>
		<div id="container">
				<div class="caixa">
					<h2>Caixa 1</h2>
				</div>
				<div class="caixa">
					<h2>Caixa 2</h2>
				</div>
				<div class="caixa">
					<h2>Caixa 3</h2>
				</div>
				<div class="caixa">
					<h2>Caixa 4</h2>
				</div>
		</div>
</body>
</html>

3 – Tenha cuidado ao usar animações em puro CSS3

É bacana e tal, vale a pena, mas sempre tente colocar a animação para ser executada na GPU do aparelho, caso contrário você vai arranjar uma dúzia de usuários insatisfeitos com sua App por que consome muita bateria e processamento.

Embora a relação da animação seja singular com o HTML, ela requerer um tanto de atenção e para isso eu sugiro usar o [highlight bg=”#f91018″ color=”#000000″]translate3d:(0,0,0)[/highlight]. e forçar sua App a mostrar a animação na GPU, seja de um simples scroll de lista até efeitos de transição.

Por exemplo, digamos que você quer mostrar um alerta animado em sua App, da seguinte forma.

O Código para esse exemplo é esse aqui:

<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, initial-scale=0.75, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"/>  
<title>CSS3 Animação</title>
<style type="text/css">
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	overflow: hidden;
 
}
/* para dispositivos de média densidade */
@media screen and (min-width:480px ) and (max-width: 800px){
 
.alerta{
	position: absolute;
	z-index: 999;
	min-width: 100%;
	min-height: 100%;
	background:rgba(0,0,0,0.8);
}
@keyframes animar-alerta {
    from {
        top:-100px;
    }
    to {
       top:30%;
    }
}
#painel {
	display: block;
	position: absolute;
	margin:auto;
	top:30%;
	left:20%;
	width:60%;
	height: 200px;
	background: rgba(255,255,255,1);
	color: #100;
	animation: animar-alerta 0.8s ease-out;
	transform:translate3d(0,0,0);
	font-family:fantasy;
}
#painel span {
	display: block;
	width:100%;
	padding:5px;
	background-image: -moz-linear-gradient(top, rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%);
	color:#000;
}
#painel p {
	text-align: center;
	width: 100%;
	padding-top: 30px;
	margin:auto;
}
.button {
	padding:15px;
	background-image: -moz-linear-gradient(top, rgba(206,220,231,1) 0%, rgba(89,106,114,1) 100%);
	width: 200px;
	height: 44px;
	display: block;
	margin:auto;
	position: absolute;
	top:50%;
	left:20%;
}
 
}
</style>
</head>
 
<body>
	<div class="alerta">
		<div id="painel">
			<span>Confirma?</span>
 
			<p>Tem certeza que deseja excluir item?</p>
			<p><button id="btn_OK">OK</button></p>
		</div>
	</div>
	<a href="#" class="button">Chamar alerta?</a>
</body>
</html>

4 – Criando objetos para telas Retina

Se você cria Apps, você tem que criar primeiro para tela de Retina, sabe aqueles jogos que você ver “HD”, significa que ali os gráficos possuem 264PPI ou seja serrilhados só nos xing-lings.

Puramente em CSS você não tem problema algum, contanto que você tome alguns cuidados quando for colocar imagens, já que esse é o gargalo. Novamente, use o media-queries para especificar uma imagem bem nítida para esses dispositivos.

#image { background: url(image.png); }
 
@media only screen and (-webkit-min-device-pixel-ratio: 2),
       only screen and (-moz-min-device-pixel-ratio: 2),
       only screen and (-o-min-device-pixel-ratio: 2/1),
       only screen and (min-device-pixel-ratio: 2) {
           #image { background: url(image@2x.png); background-size: 50%; }
}

5 – Inputs com estilo

Segundo o guia de interfaces da Apple, qualquer input para o usuário requer que tenha no mínimo 44px. Eu costumo dizer que a Apple pensou em mim também quando escreveu esse guia, já que eu tenho dedo de urso e não quero perder tempo tentando advinhar o que escrevi em um campo ou brincando de gato e rato, tentando colocar o foco no campo.

É engraçado que você pode usar seletores específicos para cada campo do formulário e assim aplicar determinadas ações em campos diferentes, igual como o Twitter bootstrap faz para determinados campos em um formulário.

Os seletores são esses:

input[type=text],
input[type=url],
input[type=tel],
input[type=number],
input[type=color],
input[type=email], {
   /* aplicar estilos aqui... */
}

Veja abaixo um rápido exemplo que eu fiz usando o emulador do Android para simular um formulário com o estilo e sem estilo.

O código com estilo que é o segundo exemplo mostrado, pode ser visto aqui abaixo.

 
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no,maximum-scale=1, minimum-scale=1"/>  
<title>CSS3 Animação</title>
<style type="text/css">
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	overflow: hidden;
 
}
input[type="text"]{
	min-height: 44px;
	border:none;
}
input[type=checkbox],
 input[type=radio] {
   display: inline-block;
   font-size: 15px;
   line-height: 1em;
   margin: 0 0.25em 0 0;
   padding: 0;
   width: 1.25em;
   height: 1.25em;
   -webkit-border-radius: 0.25em;
   vertical-align: text-top;
 }
select{
	width: 100%;
}
 input[type=radio] {
    -webkit-border-radius: 2em; /* Make radios round */
  }
 form {
 	font-family: fantasy;
 	display: block;
 	font-size: 22px;
 	margin:10px;
 }
 div, label {
 	width: 100%;
 	display: block;
 	padding-top: 10px;
 }
 textarea {
 	width: 98%;
 }
</style>
</head>
 
<body>
	<form action="#" method="post">
		<div>
			<label for="name">Digite seu nome:</label>
			<input type="text" name="name" id="name" value="" tabindex="1" />
		</div>
 
		<div>
			<h4>Qual seu sexo?</h4>
			<div>
			<label for="radio-choice-1">Masculino</label>
			<input type="radio" name="radio-choice-1" id="radio-choice-1" tabindex="2" value="choice-1" />
 
			<label for="radio-choice-2">Feminino</label>
			<input type="radio" name="radio-choice-2" id="radio-choice-2" tabindex="3" value="choice-2" />
			</div>
		</div>
 
		<div>
			<label for="select-choice">Cidade onde mora:</label>
			<select name="select-choice" id="select-choice">
				<option value="Choice 1">Petrolina</option>
				<option value="Choice 2">Recife</option>
				<option value="Choice 3">São Paulo</option>
			</select>
		</div>
 
		<div>
			<label for="textarea">Comentarios:</label>
			<textarea cols="13" rows="8" name="textarea" id="textarea"></textarea>
		</div>
 
		<div>
			<label for="checkbox">Concorda com os termos</label>
			<input type="checkbox" name="checkbox" id="checkbox" />
		</div>
 
		<div>
			<input type="submit" value="Submit" />
		</div>
	</form>
</body>
</html>

5 – Minimizar o arquivo

Seja HTML ou CSS, o navegador sempre vai interpretar seus arquivos, diferente do compilado, ele quando interpretado demora alguns mili segundos ou até segundos para fazer efeito e ser visto, para evitar maior tempo para rendenizar, sempre minimize o arquivo, que é o processo de remover todos os espaços em branco necessário para diminuir o arquivo em tamanho.

O site Minify CSS, tem um motor para isso, se você quiser pode usar o Yahoo Compressor.

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/ Cursos/ Dicas

03 e 10 de Setembro Curso on-line Android Nativo Essencial

androidbanner2

Ser ou não ser eis a questão, essa é uma frase famosa do poeta William Shakespeare, escrita no século 15.

Hoje eu mudaria ela para Ser Android ou não ser, eis a questão. A empresa que eu trabalho eu realmente amo o que eu faço pelo simples fato dela ser uma empresa que motiva seus funcionários a fazer o melhor e não só isso, motiva a outras pessoas (alunos) a criarem coisas fantásticas e assim colaborar mais ainda para uma internet rica, móvel e fantástica.

Nos dias 03 e 10 de Setembro o Grande Stefan Horochovec vai ensinar ao pessoal como criar Apps nativamente para plataforma Android, o mais interessante de se criar apps nativas com código do próprio SDK é que você não fica só limitado ao AIR 2.5+ e Android 2.2. Você tem uma grande leva de dispositivos que você pode atingir.

Atualmente cerca de 550 mil novos smartphones com Android são ativados diariamente. Que juntos somam um exército de 130 Milhões de dispositivos rodando o Robozinho. Dai eu fico perguntando e você vai ficar ai parado e vendo toda essa manada passar diariamente e não vai fazer nada para criar algo para ela?

Pense bem, e faça esse curso que vai explorar todos esses recursos, quem é desenvolvedor Web ou Java vai adorar, afinal de contas a didática do Stefan é muito boa.

Ande logo! Por que é imperdível.

AIR Mobile/ Flex/ Flex 4.5

Ganhamos no desafio do Melhor App Flex de Open Source no Flashcamp Brasil 2011

Notícia excelente, além de termos noticiado aqui e aqui , que haviamos criado o app para o Flashcamp Brasil no Android, nós decidimos abrir o código fonte do mesmo para participar do desafio do evento.

Não deu outra, acabamos por ganhar como melhor App Flex Open-source. O app é para plataforma mobile Android, onde todo e qualquer desenvolvedor que domine o Flex/AIR, possa criar um App similar para outros eventos de tecnologia ou não e assim fomentar a informação para quem participa dos eventos por ai à fora.

Muito bom ganhar um desafio, esse foi o primeiro que participamos. Parabéns aos outros ganhadores em outras categorias.

Flex/ Flex 4.5/ Flex Mobile Framework

Palestra Flex para smartphones

No próximo sábado. Terá uma palestra bem legal para quem quer se aventurar no mundo mobile e encarar o Flex nesse desenvolvimento.

Eu já palestrei sobre o assunto duas vezes, e acredite que ainda tem conteúdo novo. Irei mostrar diversas novidades do Flex 4.5 SDK para mundo Mobile (smartphones).
Curiosidades do Flash Builder 4.5, novos recursos, Source Mate 3.0.

A palestra é totalmente on-line as 14:00 horário de Brasília, essa palestra será para o grupo de usuários Flex Duck. Confira aqui os detalhes para a palestra.

AIR Mobile/ Android/ Dicas/ Flex/ Flex 4/ Flex Mobile Framework/ Tablets

Antes de comprar seu Android para testar o Flex leia esse post

Amigo leitor, você está totalmente satisfeito que agora o Flex está disponível na plataforma Android, Playbook e futuramente logo em junho ios.
O fato é que esse post é mais direcionado a você que está comprando um smartphone ou um tablet com Android apenas para testar o Flex nele ou criar soluções corporativas para sua empresa.
Hoje aconteceu uma coisa bem ruim com o Maurício Martins um de meus alunos do último curso de Adobe AIR Mobile. Ele comprou um Samsung Galaxy 551 apenas por suportar o Android 2.2 que é um dos pré-requisitos para você testar qualquer aplicação mobile na plataforma Android.

Infelizmente você acaba esquecendo que existem outros pre-requisitos importantes que devem ser levados em conta, como quantidade de memória instalada, resolução da tela, arquitetura do processador.
Então antes de sair comprando seu Android só por que já suporta 2.2, lembre-se desses fatores.
O que eu mais indico é visitar a lista de tablets, smartphones que já suportam o Adobe AIR e estão certificados pela Adobe para tal fim. Confira a lista aqui.

A lista pode sofrer mudanças constantemente, então é sempre bom ficar de olho nela, pois ela só lista o que realmente já foi testado pela própria Adobe e ela aconselha seus desenvolvedores e usuários finais a usar esses aparelhos.

Os requisitos técnicos para ter suporte ao Adobe AIR são:

MOBILE SYSTEM REQUIREMENTS

* Android devices
o Google Android™ 2.2 operating system
o ARMv7-A processor with vector FPU
o OpenGL ES 2
o H.264 and AAC hardware decoders
o 256MB of RAM
* BlackBerry™ Tablet OS
* iOS 3 and higher