O SourceMate, o parceiro definitivo para o desenvolvedor sério de Flex e ActionScript, adiciona recomposição, geração de códigos, snippets de códigos e muito mais ao Flash Builder 4. Entre as principais características estão a criação de múltiplos getter/setter, interface de extração e recomposição de método de extração, criação de arquivo versão Ant e marcadores de tarefa TODO e FIXME.

Instalação:

Abra o menu: Ajuda> Instalar Novo Software

Uma vez na caixa de diálogo de instalação, insira a seguinte URL:

http://updates.elementriver.com/sourcemate/v1

Resultado:

SourceMate*, por Element River

No final de 2008, a comunidade Spring começou a trabalhar no projeto de integração Spring BlazeDS para adicionar suporte ao Flex no desenvolvimento de aplicações com Java e Spring.
O BlazeDS cria instâncias de objetos do lado do servidor Java e usa os para responder aos pedidos do remote object. A integração com Spring BlazeDS permite que você configure o Spring beans como um destino BlazeDS para utilização de remote objects no Flex.

Ferramentas necessárias:

•  Eclipse 3.5 (Galileo) para Java EE Developers – http://www.eclipse.org/downloads/
ou,  SpringSource Tool Suite : http://www.springsource.com/products/springsource-tool-suite-download/
• Flash Builder 4, plugin para instalar na distribuição do eclipse 3.5  -  http://www.adobe.com/go/try_fashbuilder
• Tomcat 6: http://tomcat.apache.org/
• BlazeDS 4 (Binary Distribution): http://opensource.adobe.com/wiki/display/blazeds/BlazeDS/
• Spring Framework 3.0.2 (vanilla release): http://www.springsource.org/download
• Spring BlazeDS Integration 1.0.3 (vanilla release): http://www.springsource.org/spring-flex
• AOP Alliance 1.0: http://sourceforge.net/projects/aopalliance/files/
• backport-util-concurrent 3.1: http://sourceforge.net/projects/backport-jsr166/files/backport-jsr166/
• cglib 2.2 http://sourceforge.net/projects/cglib/files/
• asm 3.2 http://forge.ow2.org/projects/asm/

Como fazer:

1) Primeiro instale o Eclipse e, em seguida, instalar o Flash Builder 4 plugin para a distribuição Eclipse  que você acabou de instalar.

2) No Eclipse crie um servidor:
1. File > New > Other
2. Selecione Server > Server
3. Clique em Avançar
4. Selecione> Apache Tomcat v6.0 Server
5. Clique em Avançar
6. Especifique o local onde o Tomcat está instalado e selecione o JRE
7. Clique em Concluir

3) Criar um “Dynamic Web project”

No Eclipse, importe o arquivo blazeds.war para criar o projeto:
1. Escolha File > Import
2. Selecione  WAR file. Especifique o local do arquivo blazeds.war.
Dê um nome para o projecto web, flexcomspring
3. Clique em Concluir

Primeiro remova o arquivo xalan.jar do diretório: WebContent/WEB-INF/lib. Em seguida, vá em propriedades do projeto.   Selecione Java Build Path e em seguida, clique na guia Source. Defina o
diretório de saída: flexcomspring/WebContent/WEB-INF/classes

Isso faz com que todas as classes Java criadas no projeto serem implantadas na aplicação web.
No WebContent/WEB-INF/flex atualizar o services-config.xml para o seguinte código:

<?xml version="1.0" encoding="UTF-8"?>
<services-config>
<channels>
   <channel-definition id="my-amf"
	  class="mx.messaging.channels.AMFChannel">
	  <endpoint
	  url="http://{server.name}:{server.port}/{context.root}/messagebroker/amf"
	  class="flex.messaging.endpoints.AMFEndpoint" />
   </channel-definition>
   <channel-definition id="my-streaming-amf"
      class="mx.messaging.channels.StreamingAMFChannel">
	  <endpoint
	  url="http://{server.name}:{server.port}/{context.root}/messagebroker/streamingamf"
	  class="flex.messaging.endpoints.StreamingAMFEndpoint" />
   </channel-definition>
   <channel-definition id="my-polling-amf"
	  class="mx.messaging.channels.AMFChannel">
	  <endpoint
	  url="http://{server.name}:{server.port}/{context.root}/messagebroker/amfpolling"
	  class="flex.messaging.endpoints.AMFEndpoint" />
   </channel-definition>
</channels>
</services-config>

Lista 1 – services-config.xml

4) Em seguida, você precisa adicionar as dependências necessárias para  a aplicação web. Copie todas as bibliotecas do Spring Framework / arquivos .JAR (localizado na pasta dist) para o seguinte diretório: WebContent/WEB-INF/lib.
Também copie as bibliotecas do Spring BlazeDS Integration (localizado na pasta dist ) para a pasta lib. Faça o mesmo para aopalliance.jar, backport-util- concurrent.jar, cglib-2.2.jar, asm-3.2.jar.

5) Para configurar o servidor para o Flex Remoting, primeiro editar o web.xml em: WebContent/WEB-INF. Substituir seu conteúdo para:

<?xml version="1.0" encoding="UTF-8"?>
<web-app 
	xmlns="http://java.sun.com/xml/ns/javaee" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	xsi:schemaLocation="
        http://java.sun.com/xml/ns/javaee
        http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	version="2.5">
	<listener>
		<listener-class>
			org.springframework.web.context.ContextLoaderListener
		</listener-class>
	</listener>
	<listener>
		<listener-class>flex.messaging.HttpFlexSession</listener-class>
	</listener>
	<servlet>
		<servlet-name>flexcomspring</servlet-name>
		<servlet-class>
			org.springframework.web.servlet.DispatcherServlet
		</servlet-class>
		<init-param>
			<param-name>contextConfigLocation</param-name>
			<param-value></param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>flexcomspring</servlet-name>
		<url-pattern>/messagebroker/*</url-pattern>
	</servlet-mapping>
</web-app>

Lista 2 – web.xml

O Spring irá agora tratar os pedidos para o messagebroker / url.

6) Agora configure o Spring criando um arquivo applicationContext.xml em WebContent/WEB-INF com o seguinte código:

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:flex="http://www.springframework.org/schema/flex"
    xmlns:context="http://www.springframework.org/schema/context"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="
        http://www.springframework.org/schema/beans
        http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
        http://www.springframework.org/schema/flex 
        http://www.springframework.org/schema/flex/spring-flex-1.0.xsd
        http://www.springframework.org/schema/context
        http://www.springframework.org/schema/context/spring-context-3.0.xsd">
 
 	<flex:message-broker>
        <flex:remoting-service default-channels="my-amf" />
    </flex:message-broker>
 
    <context:component-scan base-package="com.luis.flex" />
</beans>

Lista 3 – applicationContext.xml

Na lista 3 cria-se o Flex message-broker, que permitirá ao Flex habilitar o remoting-service, utilizando o canal my-amf. O  component-scan vai encontrar classes no pacote “com.luis.flex” que foram anotados para Remoting.

7) Agora crie uma classe Java simples que será exposta através do AMF channel para uma aplicação Flex. Na pasta src criar uma nova classe no pacote criado anteriormente com o nome “OlaMundoService”. Definir com o seguinte código  em OlaMundoService.java para:

package com.luis.flex;
 
import org.springframework.flex.remoting.RemotingDestination;
import org.springframework.flex.remoting.RemotingInclude;
import org.springframework.stereotype.Service;
 
@Service
@RemotingDestination
public class OlaMundoService {
    @RemotingInclude
    public String olaUser(String name) {
        return "Olá, " + name;
    } 
}

Lista 4 – OlaMundoService.java

Na classe OlaMundoService você vai notar duas anotações. O @Service annotation diz ao Spring qual classe é um serviço e @RemotingDestination expõe a classe como um remoting endpoint para o Flex. Esta classe também contém um único método chamado olaUser, que simplesmente recebe uma string. Por padrão, todos os métodos públicos de uma classe estão disponíveis para remoting. Você pode ocultar um método público de ser exposto como um endpoint remoto usando o @RemotingExclude.

8 ) Agora crie uma aplicação Flex que vai chamar o método olaUser em OlaMundoService. Para começar a construir a aplicação Flex, basta criar um novo projeto Flex. No assistente para Novo projeto Flex de o nome: “olaMundo”, selecione Web como o tipo de aplicação, e definir o Flex SDK versão para Flex 4.0 (geralmente o padrão). Também escolha J2EE como o tipo de servidor de aplicativos, habilite Use Remote Object Access Service, e selecione BlazeDS. Certifique-se que Create Combined Java/Flex Project Using WTP não está marcada e clique em Avançar. Agora insira as informações para o projeto flexcomspring. A pasta raiz é a pasta WebContent no projeto flexcomspring. A URL raiz deve ser http://localhost:8080/flexcomspring /. A raiz de contexto deve ser /flexcomspring.

Clique em Concluir para criar o projeto. Agora você deve ver o código da aplicação. Substitua o código pelo seguinte:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx">
 
	<fx:Declarations>
		<s:RemoteObject id="ro" destination="olaMundoService" 
		endpoint="http://localhost:8080/flexcomspring/messagebroker/amf"/>
	</fx:Declarations>
 
	<s:layout><s:VerticalLayout/></s:layout>
 
	<s:TextInput id="txt"/>
 
	<s:Button label="Enviar" click="ro.olaUser(txt.text)"/>
 
	<s:Label id="lbl" text="{ro.olaUser.lastResult}"/>
 
</s:Application>

Lista 5 – olaMundo.mxml

Agora, execute a aplicação olaMundo (uma maneira é clicar com o botão direito no olaMundo. mxml, selecione Executar como e, em seguida, selecione Web Application). Digite seu nome no TextInput Clique no botão Enviar. Isto irá iniciar um pedido Flex Remoting para o servidor Tomcat chamando o Spring DispatcherServlet, que então procura o serviço OlaMundoService. Este destino é automaticamente mapeado para o Spring OlaMundoService Bean. Em seguida, o método olaUser será chamado no bean, passando para a chamada  do RemoteObject no cliente. O método retorna uma nova String, que é então serializado em AMF, inserido no corpo da resposta HTTP, e enviados de volta para o cliente. Você acabou de concluir uma aplicação web com Flex  para comunicar através de aplicações com Spring BlazeDS usando o Spring BlazeDS Integration!

Exis­tem mui­tas manei­ras de lidar com um requi­sito espe­cí­fico de um pro­jeto de inter­face e – como desig­ner – a coisa mais importante que você pode fazer é sele­ci­o­nar a opção que melhor reflita as neces­si­da­des de seus usuá­rios. Os exem­plos abaixo são parte de uma com­pi­la­ção com os melho­res dos melho­res, publi­ca­ções online e bibli­o­te­cas dedi­ca­das a com­par­ti­lhar infor­ma­ções e explo­rar con­ceitos rela­ti­vos aos padrões de design de inter­face do usuário.

UI-patterns.com

UI-patterns.com é uma cole­ção de padrões de design onde os desig­ners de inter­face podem bus­car ins­pi­ra­ção. O site per­mite que os usuá­rios man­ter con­jun­tos de suas pró­prias (publi­ca­mente aces­sí­veis aos visi­tan­tes do site) para que você possa ver outras cole­ções de padrão de design de inter­face do usuário.

Konigi

Konigi des­taca exem­plos do design de inte­ra­ção e do uso de design visual no mundo-real. Exis­tem mui­tas for­mas de utilizar,navegar e encon­trar o con­teúdo dese­jado no site, incluindo uma página de Tags popu­la­res com as palavras-chave mais usa­das divi­di­das em três cate­go­rias: palavra-chave, pro­duto e empresa.

Inte­rac­tion Design Pat­tern Library

Welie.com pos­sui uma bibli­o­teca de padrões de design de inte­ra­ção man­tida por Mar­tijn van Welie, Ph.D. em Human Com­pu­ter Inte­rac­tion. A bibli­o­teca pos­sui uma tone­lada de padrões de design que envol­vem várias tare­fas de um site. Cada padrão segue um for­mato espe­cí­fico: o pro­blema, a solu­ção, quando usar o padrão, por que você deve usar o padrão de design e os exem­plos do padrão em uso.

design|snips

Esta Gale­ria de design concentra-se em com­po­nen­tes comuns de pági­nas web bem como nas ten­dên­cias de design. Design|snips pos­sui mais de 30 cate­go­rias, o que per­mite que se encon­tre facil­mente o padrão de design ou ten­dên­cia que mais inte­res­sam. Além disso, os usuá­rios têm per­mis­são para clas­si­fi­car cada design em des­ta­que na Galeria.

The UI Pat­tern Factory

The UI Pat­tern Fac­tory é uma bibli­o­teca e gale­ria de design de inter­face do usuá­rio. O inte­res­sante do UI Pat­tern Fac­tory é que as vezes eles com­par­ti­lham vídeos para melhor des­cre­ver os pro­ble­mas e solu­ções de design. Alem disso os usu­a­rios podem con­tri­buir com exem­plos que são arqui­va­dos em uma conta no Flickr: UIPatternFactory.com

Ele­ments of Design

Ele­ments of Design concentra-se em com­po­nen­tes espe­cí­fi­cos do web design, tais como for­mu­lá­rios de login e nave­ga­ção de site, na espe­rança de ins­pi­rar desig­ners, bem como para real­çar mode­los que estão se tor­nando padrão.

Web & Patterns

Web & Patterns, é um site onde podem encontrar padrões, ilustrações, etc. Podem aceder a alguns conteúdos gratuitamente, outros terão de se tornar membros.

Debugger – Teclas de atalho

Escrevi este post porque uso IDEs diferentes com bastante frequência (para o trabalho e projetos pessoais), e o fato de que as teclas de atalho run/debug diferem em cada IDE, isso realmente me irrita!

Caso você não tenha ouvido, Adobe Acrobat 9 tem uma API de ActionScript para portfólios PDF.

Aprenda e faça-se sobressair de outros desenvolvedores Flex. O “Adobe Acrobat PDF Portfolio Navigator Developer Contest” pode ser sua oportunidade de ter o seu trabalho comentado por algumas das empresas RIA top no mundo. No concurso, você também pode ganhar excelentes prémios.

Um painel de especialistas da Adobe irá selecionar 10 trabalhos. Representantes de diversas empresas RIA irão rever os 10 melhores trabalhos e selecionar três vencedores. Esta é uma ótima maneira de começar o seu trabalho e mostrar a estas empresas o seu trabalho que estão sempre à procura de colaboradores criativos.

Os juízes destas empresas líderes no mundo RIA são:
• Blitz
• Catalyst Resources
• Effective UI
• G2
• Universal Mind

1º lugar:
Escolha entre Dell Adamo Desire ou MacBook Air 2.13GHz

2º lugar:
Apple iPad wifi, 3G 32GB device

3º lugar:
HP Mini 5102 device

10 finalistas:
Destaque em Adobe.com

Ir a Adobe Acrobat PDF Portfolio Navigator Developer Contest para obter mais informações.

Boa sorte a todos!

O BR Conference 2010, é o primeiro evento realizado no Brasil sobre RIA (Rich Internet Application) e ColdFusion.

Com o apoio da Adobe Systems Inc’s e a participação de alguns dos melhores e mais renomados profissionais do mundo nas ferramentas e tecnologias ColdFusion, Flex, AIR, Flash Media Server e LiveCycle, o BR Conference 2010 é um evento criado por desenvolvedores para desenvolvedores.

O objetivo do evento é apresentar ao seu público soluções de alta escala, novos recursos e tendências do mercado no desenvolvimento de aplicações ricas para Web e Desktop, atendendo a necessidade de empresas, governo, estudantes e profissionais que desejem aprofundar seus conhecimentos.

Além das sessões, apresentações e painéis de discussão, o público terá a oportunidade de contato com os desenvolvedores, gurus, patrocinadores e dirigentes da comunidade.

O evento será uma ocasião oportuna para a formação de parcerias entre os setores privado, acadêmico e governamental e um momento único para as empresas divulgarem seus produtos e serviços a este público especializado.

Palestrantes

Comunidade Internacional: Raymond Candem, Ben Forta, Terrence Ryan, Adam Lehman, Lee Brimelow, Kevin Schmidt, Liz Frederick, Charlie Arehart;

Comunidade Nacional: Neto Leal, Fabio Vedovelli, Flavio Mikami, Lauro Santos, Gabriela Perry, Fransico Paulino (Tofinha).

Local e Datas do Evento

Data: 19, 20 e 21 de agosto de 2010 (quinta, sexta e sábado)

Local: Sendo definido – Rio de Janeiro – RJ.

Funcionalidade muito utilizada em sites, a qual é o armazenamento de dados no cookie do browser, esta função é muito utilizada para salvar as preferências de usuários como: login, email, ultimo acesso entre outras informações.
No Flex isso também é possível podendo ser até mais poderoso do que as formas atuais, para fazer isso você deve utilizar o SharedObject.

A função do Shared Objects (ShO) é armazenar dados localmente, funcionando como um cookies do browser. Assim você pode armazenar dados e chamá-los durante a sessão atual ou em outra futura sessão. Contudo estes dados não podem ser acessados por outra aplicação Flex mais sim apenas pela aplicação criadora.

Shared Objects vs Cookies

É comum desenvolvedores confundirem ShO com cookies.
Os cookies que aderem ao padrão RFC 2109 geralmente têm as seguintes características:

• Eles podem expirar, e geralmente é feito isso no final da sessão por default.
• Podem ser desabilitados pelos clientes.
• Há um limite de 300 cookies sendo no Maximo 20 por site.
• Um cookie tem o espaço de armazenamento de 4 kb.
• Há a possibilidade de serem considerados como arquivos maliciosos.
• Há uma comunicação entre cliente e servidor para armazenamento dos dados.

Shared Object tem as seguintes características:

• Eles não expiram por default.
• Por padrão o seu limite de armazenamento é de 100 kb.
• Eles podem armazenar dados simples como: String, Date, Array ….
• A aplicação pode indicar locais específicos para o armazenamento dos dados.
• Não há transmissão e comunicação entre o cliente e o servidor para a busca e armazenamento dos dados.

Com a classe SharedObject é possível realizar qualquer manipulação dos dados que ficarão armazenados no cliente. Esta possui os seguintes métodos:

• clear() – Limpa permanentemente todos os dados contidos no Shared Object.
• flush() – Grava os dados do ShO no cliente.
• getLocal() – Retorna uma instancia do ShO no cliente, caso não exista o mesmo cria uma.
• getSize() – Retorna o tamanho em Bytes do ShO no cliente. Uma observação o tamanho default é de 100kb, contudo isto pode ser alterado para mais.

Na prática:
Criando uma lista de contatos.

Criar uma classe chamada ShareObjectHelper a qual irá realizar a manipulação dos dados do Shared Object, tais como: incluir, remover e listar.
Esta é uma classe bem simples no qual será usado um ArrayCollection para armazenar todos os dados que armazenarão dos contatos que o usuário incluiu.

package {
	import mx.collections.ArrayCollection;
	import flash.net.SharedObject;
 
	public class SharedObjectHelper {
 
		private var _sharedObject:SharedObject;
		private var _dpSharedObject:ArrayCollection;
		private var _nomeArquivoSharedObject:String;
 
		/**
		 * Construtor
		 */
		public function SharedObjectHelper(valor:String) {
			inicializaHelper(valor);
		}
 
		/**
		 * @private
		 * Responsavel por recuperar a instancia do SharedObject baseado no
		 * parametro.
		 *
		 */
		private function inicializaHelper(valor:String):void {
			_dpSharedObject = new ArrayCollection();
			_nomeArquivoSharedObject = valor;
			_sharedObject = SharedObject.getLocal(_nomeArquivoSharedObject);
 
			if (getObjects()) {
				_dpSharedObject = getObjects();
			}
		}
 
		/**
		 * Retorna todos um array de dados que está armazendo no SharedObject
		 * @return ArrayCollection
		 */
		public function getObjects():ArrayCollection {
			return _sharedObject.data[_nomeArquivoSharedObject];
		}
 
		/**
		 * Adiciona um dado ao array de dados.
		 * @param Object
		 */
		public function addObject(o:Object):void {
			_dpSharedObject.addItem(o);
			updateSharedObjects();
		}
 
		/**
		 * @private
		 * Vincula o array de dados a um SharedObject.
		 */
		private function updateSharedObjects():void {
			_sharedObject.data[_nomeArquivoSharedObject] = _dpSharedObject;
			_sharedObject.flush();
		}
	}
 
}

<?xml version="1.0"?>
<mx:Application xmlns:local="*" xmlns:mx="http://www.adobe.com/2006/mxml"
				creationComplete="init()" backgroundColor="#ffffff"
				layout="vertical" 
				backgroundGradientAlphas="[1.0, 1.0]" 
				backgroundGradientColors="[#D3D3D3, #E7E7E7]" viewSourceURL="srcview/index.html">
	<mx:Script>
		<![CDATA[
			import mx.events.ValidationResultEvent;
			import mx.validators.ValidationResult;
			import mx.collections.ArrayCollection;
			import mx.utils.ObjectUtil;
			import flash.net.SharedObject;
 
			[Bindable]
			public var dpContatos:ArrayCollection = new ArrayCollection();
 
			public var shoHelper:SharedObjectHelper;
 
			/**
			 * @private
			 * Inicializa a classe SharedObjectHelper e ja cria/recupera
			 * instancia de um objeto SharedObject.
			 */
 
 
			private function init():void {
				shoHelper = new SharedObjectHelper("contatos");
 
				if (shoHelper.getObjects()) {
					dpContatos = shoHelper.getObjects();
				}
 
			}
 
			/**
			 * @private
			 * Adiciona um contato na lista de contatos e executa o addObject da classe
			 * sharedObjectHelper.
			 */
			private function addContato():void {
				if(valNome.validate().type == ValidationResultEvent.VALID){
					/* Cria um objeto dinamico com os atributos dos fomularios */
					var objInsert:Object = {nome: txtNome.text, apelido: txtApelido.text};
					shoHelper.addObject(objInsert);
 
					dpContatos = shoHelper.getObjects();
 
					/* Limpa os campos do formularios */
					txtNome.text = '';
					txtApelido.text = '';
				}
			}
 
			/**
			 * @private
			 * Remove um contato do DataGrid e da lista de contatos do SharedObejct
			 */
			public function removeContato():void {
				if (dgContatos.selectedIndex > -1) {
					dpContatos.removeItemAt(dgContatos.selectedIndex);
				}
			}
 
		]]>
	</mx:Script>
	<mx:StringValidator id="valNome" source="{txtNome}" property="text" 
		required="true" requiredFieldError="Campo Obrigatório"
		triggerEvent="''"/>
 
	<mx:Panel title="Contatos" layout="vertical" horizontalAlign="center" width="400">
 
 
		<mx:Form width="100%">
			<mx:FormItem label="Nome" width="100%">
				<mx:TextInput id="txtNome" width="100%"/>
			</mx:FormItem>
			<mx:FormItem label="Apelido" width="100%">
				<mx:TextInput id="txtApelido" width="100%"/>
			</mx:FormItem>
			<mx:Button id="b2" label="Salvar" click="addContato()"/>
		</mx:Form>
 
		<mx:DataGrid id="dgContatos" dataProvider="{dpContatos}" width="100%">
			<mx:columns>
				<mx:DataGridColumn headerText="Nome" dataField="nome"/>
				<mx:DataGridColumn headerText="Apelido" dataField="apelido"/>
				<mx:DataGridColumn headerText="Opções" width="80" textAlign="center">
					<mx:itemRenderer>
						<mx:Component>
							<mx:Button label="Excluir" width="8" click="outerDocument.removeContato()"/>
						</mx:Component>
					</mx:itemRenderer>
				</mx:DataGridColumn>
			</mx:columns>
		</mx:DataGrid>
	</mx:Panel>
 
</mx:Application>

Adobe acrescentou a possibilidade de utilizar bancos de dados locais, quando eles criaram AIR. Este é um dos muitos recursos que ajudam a tornar o Adobe AIR uma ótima solução para aplicações desktop multi-plataforma. Neste rápido tutorial vou mostrar como criar um banco de dados de arquivo e abrir uma conexão com ele. O código é muito simples, então vamos pular direto para ele. A primeira coisa é criar um arquivo para o banco de dados. Em SQLite, que é o mecanismo de banco de dados utilizado no Adobe AIR, o banco de dados completo é armazenado em apenas um único arquivo. É realmente um sistema muito bom compacto e portátil. Eu usei a função applicationStorageDirectory sobre a classe File para criar um arquivo que aponta para o armazenamento de aplicação local e com o nome dbTest.db. No meu caso (no Seven), o caminho real no disco é C:\Users\usuário\AppData\Roaming\SQLiteExample\Local Store. O arquivo não é criado, até iniciar a aplicação.

import flash.data.SQLStatement;
import flash.errors.SQLError;
import flash.events.Event;
import flash.events.SQLErrorEvent;
import flash.events.SQLEvent;
import flash.events.TimerEvent;
import flash.filesystem.File;
import flash.utils.Timer;
 
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.utils.ObjectUtil;
 
import org.osmf.events.TimeEvent;
 
// sqlconn é uma variável que precisamos para definir uma
// coneção com a nosso banco de dados
private var sqlconn:SQLConnection = new SQLConnection();
// sqlstate é um SQLStatement que precisamos para executar
// o executar os comandos sql
private var sqlstate:SQLStatement = new SQLStatement();
// ArrayCollection é usado como dataprovider para a nossa datagrid.
// Tem de ser bindable para que os dados em nosso datagrid
// mudem automaticamente, quando mudamos o nosso ArrayCollection
[Bindable]
private var dp:ArrayCollection = new ArrayCollection();
 
// função que chamamos no inicio da aplicação
private function init():void
{
	// primeiro precisamos de "setar" o arquivo para o banco de dados
	// Se o banco de dados não existe, ele irá criar
	// um banco de dados quando inicia
	var db:File = File.applicationStorageDirectory.resolvePath("dbTest.db");
	// depois de "setar" o arquivo para o banco de dados,
	// precisamos de abri-lo.
	sqlconn.openAsync(db);
	// precisamos de "setar" os event listners de para que possamos
	// saber se temos algum erro, quando o banco de dados é
	// totalmente aberto e também para saber quando recebemos um
	// resultado de uma query sql, o ultimo é para ler
	// os dados do banco de dados.
 
	sqlconn.addEventListener(SQLEvent.OPEN, db_opened);
	sqlconn.addEventListener(SQLErrorEvent.ERROR, error);
	sqlstate.addEventListener(SQLErrorEvent.ERROR, error);
	sqlstate.addEventListener(SQLEvent.RESULT, resault);
}
 
private function db_opened(e:SQLEvent):void
{
	// quando um banco de dados é aberto precisamos do link do SQLStatment
	// para a nossa conexão, se não "setar" esta conexão vamos ter um
	// erro quando executar o SQLStatment.
	sqlstate.sqlConnection = sqlconn;
	// escrevemos o SQLStatment.
	// no SQLStatment criamos uma tabela no banco de dados com o nome "aluno",
	// com 3 colunas (id, nome, apelido)
	sqlstate.text = "CREATE TABLE IF NOT EXISTS aluno " +
		"( id INTEGER PRIMARY KEY AUTOINCREMENT, nome TEXT, apelido TEXT);";
	// depois de conectar o SQLStatment  a nossa SQLConnection e escrever o
	// comando sql, precisamos de executar o SQLStatment
	// nada vai mudar até executar o SQLStatment.
	sqlstate.execute();
	// depois de carregar o banco de dados e criar a tabela
	// se já não existir, chamamos de método refresh() para popular o datagrid
	refresh();
}
 
// função para adicionar um item no banco de dados
private function addItem():void
{
	// este comando SQL é para adicionar um item na tabela
	sqlstate.text = "INSERT INTO aluno (nome, apelido) " +
		"VALUES('"+nome.text+"','"+apelido.text+"');";
	sqlstate.execute();
	refresh();
}
 
// função para chamar quando queremos fazer o refresh de dados no datagrid
private function refresh(e:TimerEvent = null):void
{
	// objeto timer que precisamos se o SQLStatment está ainda em execução,
	// caso contrário tentamos novamente depois de 10 milliseconds.
	var timer:Timer = new Timer(10,1);
	timer.addEventListener(TimerEvent.TIMER, refresh);
	if ( !sqlstate.executing )
		// precisamos checar se o SQLStatment está ainda executando
		// o ultimo comando sql.
		// se sim, usamos o timer para voltar a executar em 10 milliseconds.
		// senão checar, podemos ter erro pq o SQLStatment
		// não pode executar 2 comandos aomesmo tempo.
	{
		// SQLStatment que retorna todos os dados da tabela "aluno".
		sqlstate.text = "SELECT * FROM aluno"
		sqlstate.execute();
	}
	else
	{
		timer.start();
	}
}
 
// função que é chamada se receber algum resultado do comando sql.
// também pode ser chamado, quando for inserir algum dado
private function resault(e:SQLEvent):void
{
	// com o sqlstate.getResult().data pegamos o array de objetos
	// para cada linha do banco de dados
	var data:Array = sqlstate.getResult().data;
	// passamos o array de objetos para o
	// dataprovider para popular o datagrid
	dp = new ArrayCollection(data);
}
 
// função que remove um item do banco de dados
private function remove():void
{
	// SQLStatment para excluir da tabela o id que tem o
	// mesmo número que selecionamos no datagrid para excluir
	sqlstate.text = "DELETE FROM aluno WHERE id="+dp[dg.selectedIndex].id;
	sqlstate.execute();
	refresh();
}
 
// função que é chamada quando recebemos um erro do comando sql
// ou conexão sql e mostra esse erro em um alert.
private function error(e:SQLErrorEvent):void
{
	Alert.show(e.toString());
}

Aplicação básica para entender e aprender como você pode armazenar dados em banco de dados SQLite. O exemplo é muito básico, mas você deve pegar uma idéia de como fazê-lo.

Aplicativo AIR aqui (view source habilitado).

O que é?
Feliz  cada vez mais nos estamos a virar mais para o “mundo” da WEB e para a CLOUD.
A prever isso a Microsoft lançou já há alguns anos o ASP.NET (Active Server Pages), que ao contrário do que se diz não é uma linguagem de programação mas sim uma Framework para desenvolvimento WEB.
Como é uma Framework assente na Framework .NET podemos usar para programar as linguagens C# e VB.NET. Em ASP.NET criamos páginas (WEB Forms) dinâmicas em que o código é corrido no servidor como é o caso de outras tecnologias (PHP, JSP).

Pressupostos:
Não que seja imperativo mas para sermos bons programadores de WEB, antes de sequer abrir o Visual Studio, temos de entender o mundo que vai por trás do browser.
Temos de entender o protocolo HTTP, Request / Response, ciclos de vida de uma página, diferença entre cliente e servidor, State Management, PostBack, JavaScript, CSS e claro HTML.
Não irei falar sobre tudo isto, apenas do que está relacionado com o ASP.NET, mas é bom sabermos o que está por detrás de cada ação que fazemos no browser

Cliente VS Servidor:
Como já referi uma Web Form ASP.NET é executada do lado do servidor, o que significa que cada vez que pedimos (Request) essa página ela é executada no servidor e posteriormente devolvida (Response) para o browser em HTML, esta operação ocupa largura de banda e tempo, logo se o podermos evitar ou então não enviar a página toda melhor (Partial PostBack (AJAX)), podemos concretizar isso usando JavaScript, que é uma linguagem que corre directamente no Browser (Cliente) ou AJAX (Javascript assíncrono e XML).
Não significa que no cliente é melhor ou que no servidor é mais seguro, o grande desafio das WebForms é a fusão entre código do lado do cliente e servidor, tornando assim a página rápida e menos pesada.

PostBack:
O PostBack é o nome que se dá à operação de Request e Response, ou seja, quando uma página inteira e o seu conteúdo são enviados para o servidor, processados e devolvidos para o browser.
Sabem quando fazem refresh a uma página ou carregam num botão e o browser fica branco e depois aparecem os conteúdos? É isso um PostBack.
Mais tarde falaremos da propriedade Page.IsPostBack do ASP.NET.
Felizmente existem formas de contornar isso graças ao AJAX que permite que sejam só enviados pedaços da página e de modo assíncrono o que permite continuar a trabalhar sem o browser bloquear.

Ciclos de vida de uma página:
Falaremos aqui do mais importante e utilizado o Load.
É a melhor altura para fazer acções devido ao facto de que os controlos já estão todos carregados, o viewstate disponível e ainda não é tarde para fazer alterações pois não chegou ao Render que é quando o HTML da página já está todo desenhado.

State Management:
Entende-se por State Management a capacidade do ASP.NET poder guardar informação entre PostBacks da mesma ou de outras (várias) páginas.
Existem várias opções relacionadas com desempenho e capacidade, cliente ou servidor:

Do lado do cliente:

View State: o view state “vive” nas páginas, o viewstate é criado a partir de cada controlo que adicionamos á nossa página para, entre postbacks, poder manter o seu valor.

Ex: Temos uma caixa de texto na página e ao carregar num botão a página faz postback mas o valor permanece na caixa de texto.
Vantagens: Simples, não requer implementação
Desvantagens: Não é recomendado para guardar muita informação pois a página ficará lenta.

Hidden Fields: Uma espécie de variável global na própria página
Vantagens: Fácil implementação
Desvantagens: Pouco seguro (ao ver o source da página está lá o valor) e claro pesa na página

Cookies: Todos já ouvimos este termo, são pequenos ficheiros guardados no lado do cliente para poupar viagens desnecessárias ao servidor.
Vantagens: Pode ser configurado o tempo de expiração e simples implementação
Desvantagens: Pouca capacidade de armazenamento, cliente tem de aceitar cookies, pouco seguro pois o cliente pode alterar as informações.

Do lado do Servidor:

Application State: Informação guardada no servidor disponível em todas as páginas e utilizadores até que o processo da aplicação termine.
Vantagens: Variáveis globais, fácil implementação.
Desvantagens: Ocupa memória no servidor.

Session State: Informação guardada no servidor disponível em todas as páginas enquanto a sessão do utilizador estiver disponível (mesmo Browser), tem limite de tempo de inactividade.
Vantagens: Variáveis globais, fácil implementação.
Desvantagens: Ocupa memória no servidor.

Ferramentas úteis para ajudar no desenvolvimento e debug:
Firebug: http://getfirebug.com/
Fiddler: http://www.fiddler2.com/fiddler2/

Cumpz