Criação de projetos no Adobe Flash Builder 4.5

Adobe Flash Builder é uma ferramenta para desenvolvimento de software, para construção de aplicações WEB, Desktop, Móvel, utilizando ActionScript e MXML. O Adobe Flash Builder foi baseado no IDE Eclipse.

Eclipse é um IDE (Integrated Development Environment ou ambiente de desenvolvimento integrado), ou seja, um programa de computador que reúne ferramentas para o desenvolvimento de software, com objetivo de agilizar esse processo.

Segundo Eclipse (2012), o projeto foi iniciado pela IBM em novembro de 2001 e apoiado por um consórcio de fornecedores de software. A Eclipse Fundation foi criada em 2004 como uma corporação sem fins lucrativos e seus projetos são open source (código aberto).

A respeito do Flash, atualmente o SDK (Software Development Kit ou Pacote de Desenvolvimento de Software) foi doado para a fundação Apache. Os SDK são pacotes que possuem todos os recursos para que programadores desenvolvam projetos em plataformas especificas. Maiores informações a respeito do SDK podem ser acessadas no site.

A construção do projeto é detalhada, abordando passo-a-passo, buscando facilitar o entendimento do leitor:

1. Com a ferramenta Adobe Flash Builder aberta, clique em File – New – Flex Project, conforme apresenta a Figura 1.

   O usuário cria um novo projeto Flex, acessando a tela 'New Flex Project'.

2. Na aba Project Location, apresentada na Figura 2.
   • Project name: informar o nome do projeto (na Figura informada como exemplo);
   • Folder: informar o diretório do projeto (na Figura exemplificado como P:\www\flex\exemplo)
   • Application Type: escolher o tipo da aplicação, WEB ou Desktop (AIR), na figura foi escolhida 'WEB'.
   • Flex SDK Version: escolher a versão do SDK (Software Development Kit), conforme Figura 2. No exemplo foi escolhida a opção default.

   . Aba Localização do Projeto

   Para seguir com as configurações, o usuário deve pressionar botão “Next”.

3. Na aba Server Settings, a qual pode ser observada na Figura 3, devem ser informadas configurações do servidor.
   • Application server type: deve ser escolhido o tipo de aplicação, no caso do exemplo, escolhe-se a opção None/Other;
   • Output folder: nesse campo deve ser informado o diretório onde devem ser gerados os códigos compilados do projeto, no exemplo, conforme a Figura 3, é informado public.

   . Configurações do Servidor

4. Na aba Build Paths, são realizadas as configurações finais.
   • Add SWC: botão que permite adicionar um componente de terceiros no projeto. Neste projeto genérico não será adicionado nenhum componente de terceiros.
   • Main application file: onde deve ser informado o nome do mxml principal, no exemplo informado index.mxml, conforme a Figura 4.

   . Configurações Finais do Projeto

   O index foi informado para que ao gerar o código compilado, automaticamente seja gerado um index.html.

5. Pelo botão 'Finish' é possível concluir o projeto, criado com sucesso, porém devem ser realizadas configurações para o mesmo poder ser utilizado;
6. Com o click do botão direito do mouse em cima do projeto, conforme Figura 5.

   Opção Properties, acessando a tela 'Properties for exemplo'.

7. Aba Flex Compiler: permite ao usuário configurar o compilador correspondente, conforme Figura 6.

   Additional compiler arguments: os componentes do Flex permitem que as propriedades vinculadas ao idioma sejam alteradas via código.

   Informar no campo -locale pt_BR, que corresponde a internacionalização i18n.

   Importante:: internacionalização consiste de processos de desenvolvimento e/ou adaptação de um software para um idioma. Por exemplo: Inglês, Português, Francês, etc.
8. Pela aba Flex Build Path, Figura 7, são realizadas configurações da url.

   Output folder URL: campo onde deve ser informada a url do projeto. Destacando que é recomendado buscar a url do projeto através do browser.

9. O exemplo de como a aplicação criada ficou pode ser observado na Figura 8.

10. Também pode ser observada na Figura 8, a inserção de um “Label” na aplicação, sendo setado seu atributo “text” no Exemplo, como pode ser observado na codificação do label abaixo.
    Listagem 1. Exemplo de componente Label

    <s:Label fontFamily="Georgia" fontSize="36" horizontalCenter="0" text="Exemplo" verticalCenter="0"/> 

11. Com o projeto concluído, pode ser gerada a primeira Release e liberada versão para o cliente.

    No Adobe Flash Builder 4.5 a geração do release é possível através da opção no menu Project – Export Release Build, conforme Figura 9.

12. Para concluir a geração da Release (Figura 10) deve ser acionado o botão Finish. Será criada no seu projeto uma pasta “bin-release”, com todos os arquivos necessários para execução do projeto no cliente.

    A opção Enable view source habilita a apresentação do código fonte do sistema desenvolvido, ficando a critério da equipe de desenvolvimento essa ativação.

13. A Figura 11 apresenta a pasta “bin-release” criada com sucesso.

    Também são apresentados pela Figura 11 os arquivos necessários para disponibilizar uma “Release” para o cliente.

Conclusão

Neste artigo foi apresentada de forma prática e didática a criação de projetos na ferramenta Adobe Flash Builder 4.5, a fim de que leitores possam utilizar em suas aplicações.

O projeto de exemplo está disponível para download no topo dessa página, na opção “código fonte”.

Referências

• About Eclipse IDE
• Adobe Flex 3, Application Server Type
• Adobe Flex 3, SWC
• Apache SDK (2012)
• Internacionalização