O que todo programador Flex deve saber

Neste artigo foram eleitos um conjunto de items que considera-se o mínimo que o programador Flex deve ter conhecimento. Estes itens são:

1. Sei exportar um projeto de forma correta.
2. Sei debuggar um projeto em Flex/AIR.
3. Sei a diferença entre Flex e AIR.
4. Entendo os prós e contras de trabalhar com módulos e RSLs.
5. Sei disparar e capturar eventos. Entendo as propriedades .currentTarget, o parâmetro bubbles e os métodos da classe EventDispatcher.
6. Sei o que é deferred instantiation.
7. Sei escolher os containers de forma a otimizar aplicações.
8. Sei popular os data controls com coleções do Flex.
9. Sei recuperar e modificar itens dentro das coleções do Flex.
10. Sei usar os métodos das coleções do Flex.
11. Sei recuperar dados de RadioButtons, CheckBox e Repeaters.
12. Sei construir um ItemRenderer.
13. Passo objetos entre views (por exemplo, módulos ou seus custom components).
14. Sei usar um swc de terceiros.
15. Sei usar o HTTPService, RemoteObjects, WebServices ou a tecnologia que você está usando.
16. Entendo o que significa assincronismo e aceito que isso não é ruim; é uma característica do framework.
17. Sei quando o que procuro é uma propriedade, um estilo, um método ou um evento.
18. Sei ler a documentação.
19. Sei pesquisar meus problemas na internet (google, flex forums,etc)
20. Sei elaborar uma questão para alguns dos forums Flex e não espero uma solução pronta com código pra só copiar/colar.

Ok, temos bastantes items e iremos através de nossos artigos explicar cada um deles. Alguns tópicos são fáceis de explicar, e serão feitos logo a seguir. Outros precisam de um artigo próprio, para que possam ser melhor abordados. Vamos aos mais fáceis!

Como exportar um projeto Flex

Exportar um projeto em Flex é muito fácil para quem utiliza o Adobe Flex Buidler. Com o projeto aberto, basta selecioná-lo no Flex Navigator (Flex 3) e escolher a opção Export. Selecione a opção 'Flex Project Archive' e depois selecione o local onde o arquivo 'zip' será criado. Clique em Finish e pronto. O próprio Adobe Flex encarrega-se de não adicionar ao Zip os arquivos de compilação (swc, swf), otimizando o tamanho do projeto. Uma boa dia é sempre usar este meio, nunca copie diretamente os arquivos ou zipe diretamente o projeto pelo explorer, sempre use o assistente para exportar somente os arquivos realmente necessários. O processo no Adobe Flash Builder 4 é igual.

Se não estiver utilizando o Flex/Flash Builder, você pode exportar o projeto gerando um ZIP de toda a sua estrutura, a partir da raiz, exceto pela pasta bin-debug, que contém arquivos gerados e não precisam estar inclusos na arquivo de exportação. Eles serão gerados novamente na próxima compilação (build) do projeto.

Sei a diferença entre Flex e AIR

A principal diferença entre Flex e Air está no destino de suas aplicações. Flex é usado para desenvolver sistemas dentro de um navegador (browser...). O Flex precisa do plugin Adobe Flash Player, o mesmo plugin daqueles banners 'maneiros' que rodam por ae. O Air foi desenvolvido para funcionar diretamente no seu sistema operacional, não necessitando de navegador. Para que o Air funcione, é preciso instalar o Air Runtime. O Air possui APIs extras ao Flex, podendo acessar o disco, manipular portas seriais, arrastar itens do desktop para a aplicação, etc.

O que é deferred Instantiation? O que é creationPolicy ?

Deferred significa atrasado. Resumindo é uma instanciação de componentes atrasada. Por exemplo, suponha que você tenha na sua aplicação um TabNavigator com 10 abas. Cada aba possui diversos componentes, suponhando 10. Então temos nessa tela: 10 abas x 10 componentes = 100 componentes. Quando executamos a aplicação, estamos localizados na primeira aba, e por padrão, o flex carregou somente os 10 componentes daquela aba. Ele não carrega os componentes das outras abas até que você exiba-a. Isso significa que, se você possui um evento 'initialize' em um componente da 5a aba, ele somente será disparado quando a 5a aba for aberta.
Esse comportamento é realizado para economizar tempo de processamento e memória. Já imaginou carregar os 100 componentes tudo de uma vez?

Você pode alterar esse comportamento alterando a propriedade creationPolicy, que possui os valores:

1. all: Carregar todos os componentes
2. auto: Cria somente os componentes que estão visíveis na tela. Outros controles, por exemplo de uma outra aba, são criados somente quando a aba é aberta
3. none: Aguarda o carregamento manual dos controles.

ps: Flex 4 possui o mesmo comportamento.

Sei escolher containers de forma a otimizar aplicações

Esta afirmação abre um leque de opções bem grande em termo de otimização. Pelo menos a mais importante para mim é: não abuse de VBox, HBox. Use sempre Canvas. Isso acontece porque existe todo um processo de criação, instanciação, cálculo de tamanho, construção, disparo de eventos, etc... tudo isso interligado e se abusarmos dos HBox e VBox na aplicação, com vários componentes um dentro do outro, a performance da aplicação vai cair. O uso de Canvas, juntamente com as propriedades left, right, top e bottom, pode otimizar este processo, garantindo que a tela não ficará 'agarrada' ao realizar um efeito ou no ato de redimencionamento.

Também não abuse de efeitos. Use somente o necessário.

Usar SWCs de terceiros

Um arquivo SWC é um conjunto de classes (Biblioteca - Library) que pode ser usado nos projetos Flex. Uma biblioteca pode ser importada acessando as propriedades do Project e navegando até o item Flex Build Path e depois em Library Path. Basta clicar no botão Add SWC e pronto, a biblioteca está adicionada ao seu projeto.

 

HTTPService, RemoteObjects ou WebServices

Estas são as três formas de comunicação do Flex com o servidor. É válido relembrar que o Flex foi desenvolvido para criar a camada de visão de um sistema, ou seja, as telas. Todas as outras funcionalidades (Salvar os dados no banco, enviar emails, gerar PDFs) são de responsabilidade do servidor e este pode ser PHP, Java, .Net, Ruby on Rails, e muitos outros....

Agora como o Flex comunica-se com o servidor? Existem três meios para isso, que são:

1. HTTPService: Uma forma bastante simples de comunicação. Pode ser entendida como um acesso simples a uma URL, onde esta URL irá retornar dados no formato JSON, ou no formato XML. Também pode retornar algo do tipo: key1=var1&key2=var2&key3=var3&.......... Geralmente este tipo de acesso é lento, e desencorajado pela maioria das pessoas que trabalham com flex.
2. RemoreObjects: Também conhecidos como 'AMFs', na verdade os RemoteObjects implementam o protocolo AMF, que é uma forma de comunicação de dados bastante rápida. É a melhor de todas, não só pela velocidade mas também pela forma em como as variáveis são repassadas entre o flex e o servidor. Basicamente você pode repassar um objeto inteiro do Flex para o servidor e vice versa, o que facilita e muito a vida do programador. Esta forma de comunicação depende de uma implementação no servidor. Por exemplo o PHP usa AMFPHP ou Zend_AMF, o .Net usa FlourineFX enquanto que o Ruby on Rails usa WebOrb.
3. WebServices. São bastante conhecidos, principalmente no mundo .Net. O Flex também possui esta forma de comunicação, mas é lenta pois utiliza dados no formato XML para se comunicar.

Assincronismo

O Flex é assincrono. Simplificando, quando fazemos algum acesso ao servidor, o Flex não fica parado naquela linha onde o acesso foi feito, esperando o acesso terminar. Ele continua o fluxo do código, e possivelmente um método será chamado quando o servidor responder.