sábado, 31 de janeiro de 2009

Preparando o ambiente

O Flex Builder é uma ferramenta da Adobe para desenvolvimento Flex/AIR. Ele é construído sobre o Eclipse, uma IDE de código aberto que já é utilizada amplamente - principalmente pela comunidade de desenvolvedores Java. O FlexBuilder inclui editores para ActionScript, MXML e CSS, além de ferramentas para debug e um editor "WYSIWYG" (what you see is what you get), em que basta arrastar e soltar os componentes na tela, para depois definir apenas as suas características e comportamentos.

O Flex Builder pode ser encontrado em duas versões "Standard" e "Professional". Na versão professional, estão presentes também os componentes da biblioteca "data visualization" - que inclui o componente "Charting" (para geração de gráficos), o "AdvancedDataGrid", o "OLAPDataGrid" e componentes para automação de testes. Outro diferencial da versão profissional são as ferramentas do "Flex Profiling" - utilizadas para monitoramento de consumo de memória e uso de ciclos da CPU.

Além disso, o Flex Builder está disponível em duas distribuições: "Flex Builder 3" e "Flex Builder 3 Eclipse Plug-in" - enquanto que a primeira é um ambiente de desenvolvimento completo, a segunda depende da existência de uma versão do Eclipse na máquina. Como desenvolvedor Java/Flex, particularmente eu prefiro a opção do plug-in, pois posso também criar projetos java dentro do mesmo Eclipse (mas nada impede de se trabalhar com dois Eclipse abertos, embora hajam algumas desvantagens).

Apesar do SDK do Flex ser gratuito, e ter-se a opção de escrever o código em qualquer editor de texto e compilá-lo via linha de comando, o Flex Builder é pago. De qualquer forma, pode-se baixar aqui um trial da versão Professional nas duas distribuições. A versão trial, válida por 60 dias, tem todas as ferramentas e funcionalidades da versão ativada; a única diferença é que na versão para avaliação, os componentes do "data visualization", como os gráficos, serão compilados com uma marca d'água no fundo, informando se tratar de uma versão trial.

Existem também algumas alternativas gratuitas, como o FlashDevelop e o Amethyst, mas elas não ofereçem todos os benefícios encontrados no Flex Builder (falerei sobre elas em um post futuro).

Dica: A Adobe oferece uma licença educacional para estudantes, professores ou instituições de ensino. Acesse este site, e, aceitando os termos e condições, preencha o formulário com seus dados pessoais e faça o upload de um comprovante estudantil ou de trabalho em uma instituição de ensino (PDF ou imagem escaneada no formato GIF). Após alguns dias, será enviado por e-mail um número serial para ativação do Flex Builder Professional (incluindo a utilização do data visualization).

Os requisitos para utilização do Flex Builder podem ser encontrados aqui. Como o Flex Builder é um pouco pesado, se o computador tem bastante memória RAM, sempre é bom aumentar um pouco a memória disponibilizada para uso da IDE - para isso, basta editar o arquivo "FlexBuilder.ini" (presente no diretório de instalação do Flex Bulder) ou, para o caso da utilização do plug-in, o arquivo "eclipse.ini" (disponível no diretório do eclipse).


Instalando o Flex Builder e o Flex Builder Eclipse Plug-in

Vou mostrar agora como instalar as versões do "Flex Builder Professional 3" e "Flex Builder Professional 3 Eclipse Plug-in" (versões trial, que estão disponíveis para download no site da Adobe e que podem ser ativadas através de um número serial, como informado anteriormente).

Dica: Caso você opte pela versão plug-in e não tenha o Eclipse na máquina, ou sua versão seja inferior a 3.3, poderá baixá-lo aqui. Escolha a distribuição desejada e, no lado direito da tela, escolha o sistema operacional (atualmente só estão disponíveis plugins do Flex Builder para Windows e Mac) - costumo utilizar a distribuição "for Java Developers" para Windows 32bits. Escolha então um mirror e realize o download. Após seu término, descompacte o arquivo zip no local desejado (não é necessária uma instalação).

Bom, as instalações tanto do Flex Builder como do Flex Builder Eclipse Plug-in são muito simples: basta executar os arquivos de instalação correspondentes (FB3_win.exe ou FB3_WWEJ_Plugin.exe) e seguir os passos do wizard.

O wizard para a versão plug-in vai ter uma pequena diferença: a tela observada abaixo, onde deverá ser selecionado o diretório onde foi colocado o Eclipse.

Uma outra tela que vai aparecer, para os dois tipos de instalação, é a que está abaixo. Desmarque as opções de instalação da versão debug do Flash Player 9 (depois iremos instalar a versão 10, que é a mais atual).

No mais, dê continuidade nas etapas do wizard, até acabar o processo de instalação.


Procedimentos pós-instalação do Flex Builder ou do Flex Builder Eclipse Plug-in

Após o fim da instalação, vamos instalar a versão para debug do Flash Player 10. O download pode ser feito aqui - escolha a versão compatível com seu sistema operacional e com seu navegador dentre as disponíveis na seção "Adobe Flash Player 10 - Debugger Versions" (para o Firefox, utilize a versão "for Netscape-compatible browsers"). Execute então o instalador (é necessário fechar o browser antes).

Obs.: Caso a versão de debug do Flash Player não esteja instalada, não será possível debugar a aplicação - irá aparecer um erro como "Flex Builder cannot locate the required debugger version of flash Player...".


O próximo passo é iniciar o Flex Builder ou o Eclipse (no caso da versão plug-in). Com o uso do Eclipse, pode ser solicitado que você escolha um local para armazenar seus projetos (workspace); para a versão Flex Builder, não será feito esse questionamento. De qualquer forma, pra ambos os casos, pode-se alterar posteriormente o diretório de trabalho através do menu "File", clicando em "Switch Workspace", em "Other" e escolhendo o diretório desejado.

Após abrir o Flex Builder, será solicitado o número de licença (com a opção de continuar a utilizar a versão como trial). Se estiver sendo utilizada a versão do Eclipse com o plug-in, será necessário ir no menu "Window", clicar em "Open Perspective" e em "Other", como pode ser observado na tela abaixo. Escolha então a opção "Flex Development" e clique em "OK".

Vai abrir então a mesma tela de ativação citada anteriormente. Se você já possui um número serial, cole-o no espaço determinado e clique em "OK"; caso contrário, escolha a opção pra continuar utilizando a versão trial.

Obs: Em qualquer momento, pode-se ativar o Flex Builder, informando o número serial através do menu "Help" e "Manage Flex Licenses".


Após fechar a tela de ativação do Flex Builder, se o Flash Player não estiver devidamente instalado, vai aparecer uma mensagem solicitando que isso seja feito.

Dica: O navegador padrão costuma ser o Internet Explorer. Se a versão instalada da versão debug do Flash Player 10 foi para outro navegador, pode aparecer essa mesma mensagem. Para trocar versão do navegador no Eclipse, clique no menu "Window", depois em "Preferences". Abra então a seção "General" e clique em "Web Browser". Clique em "Search" e selecione o diretório onde o navegador está instalado. Selecione o navegador recém adicionado e clique em "OK".


Bom, o ambiente para desenvolvimento Flex já está instalado e devidamente configurado. Nos próximos posts poderemos começar com a diversão... =)

terça-feira, 20 de janeiro de 2009

Palestra "Flex: o que pode fazer para nós"

Amanhã, dia 21, às 19:00h, haverá uma palestra sobre Flex na ACATE, em Florianópolis. Será a primeira palestra promovida pelo recém-criado grupo de usuários FloripaFlex. A mesma palestra será repetida na Quinta, dia 22, no mesmo horário.

Maiores informações em:
http://groups.adobe.com/posts/266d98c09e

Inscrições (gratuitas) em:
https://spreadsheets.google.com/viewform?key=pm6Yy7FNhz98d-TLYBjPkMw

segunda-feira, 19 de janeiro de 2009

Demonstração

Antes de começarmos a fazer alguma coisa nova, como um esporte, costumamos observar alguém as fazendo, para então começarmos a nos aventurar aos poucos. Quanto mais essa nova atividade nos chama a atenção, quanto mais desperta o nosso interesse, maior tende ser a energia que iremos dispender para aprender a fazê-la da melhor forma possível.

Com o Flex não deve ser diferente, por isso separei alguns links de aplicações que demonstram um pouco do poder visual e do potencial dessa plataforma.

Que tal essa loja de carros? Não se esqueça de dar uma olhada nos vídeos dos comerciais de cada carro.
E agora um caso real: compare os celulares da Sony Ericsson aqui.
E que tal saber mais sobre 195 países? Dê uma olhada no Country Finder.
Ache a casa dos seus sonhos no HomeLocator.
E quer saber como está a previsão do tempo para a sua cidade? Dê uma conferida no WaetherFleks.
Nesta aplicação, clique no botão de play para visualizar a evolução das vendas de cada vendedor.
Nesta outra, também clicando no botão de play, acompanhe o crescimento do Wall Mart nos EUA.
E mais uma aplicação com um mapa geográfico - dessa vez um dashboard empresarial.
Dê uma olhada nos gráficos e gauges desse outro dashboard. Arraste novos itens para os gráficos e alterne o radio button entre "Sales" e "Gross Profit" observando os gauges.
E que tal acompanhar a NASDAQ por esse aplicativo no estilo "GoogleFinance"?
Um gráfico em 3D pode ser bem útil na visualização de algumas informações.
Esse organograma com os cartões pessoais é muito interessante.
Vale a pena dar uma olhada também nesse efeito "fisheye".
Esse livro on-line é muito legal, é totalmente interativo e pode incluir até recursos multimidia.
E que tal o GoogleDesktop? Ainda está em desenvolvimento, mas já dá pra dar uma brincada.
Vale a pena também dar uma olhada no Jooce - é praticamente um desktop completo via web. É necessário realizar um cadastro antes.
E que tal um jogo on-line feito todo em Flex/Flash? Smallworld é um mundo virtual onde cada jogador controla um avatar, que pode explorar todo o cenário, comprar e vender coisas, interagir com outros jogadores e até jogar outros games em fliperamas virtuais. Na tela principal, clique em "join now", crie um avatar, preencha um pequeno cadastro e divirta-se.

Dica: Na seção showcase do site Flex.org existem diversas aplicações disponíveis, vale a pena dar uma olhada por lá.

Aquecendo...

Bom, aqui vamos nós! Esse é meu primeiro blog de tecnologia e pretendo fazer desse um ponto para expor minha experiência com a plataforma Flex.

Antes de ter o primeiro contato com o Flex, eu estava programando principalmente em Java e, como muitos que seguiram por esse caminho, não estava 100% satisfeito com o que a plataforma me oferecia - apesar de muito robusta, creio que sempre apresentou limitações no aspecto visual (além da dificuldade que eu encontrava em desenvolver algumas coisas para Web que deveriam ser relativamente simples). No início de 2008, tive meu primeiro contato com Flex e não parei mais.

É impressionante a experiência visual que essa plataforma oferece, encantando rapidamente os novos desenvolvedores e, sobretudo, os seus clientes. As soluções desenvolvidas com Flex costumam trazer o que se costuma chamar de "brilho no olho" dos clientes - e isso pode ter um grande peso na hora de optarem por essas soluções em detrimento de outras. Além disso, como eu e minha equipe continuamos a programar o back-end das nossas aplicações em Java, também pesa para nós o fato de que não é difícil fazer uma comunicação eficiente entre essas duas plataformas.


Além de contribuir com a comunidade Flex brasileira, acredito que com esse blog poderei também desenvolver e solidificar cada vez mais os meus próprios conhecimentos.

"Diga-me e eu esquecerei. Mostre-me e eu lembrarei. Envolva-me e eu aprenderei."