Introdução
Faz todo o sentido que a primeira entrada no blog seja como preparar um ambiente de desenvolvimento na plataforma Flash, mas neste caso com uma nuance: Open Source.
Quem já teve contacto com o Flash IDE sabe que o editor de código é pouco prático e a performance do compilador deixa um pouco a desejar, felizmente existem alternativas (open source ou comerciais). A minha preferência recai sobre o FlashDevelop (Windows) em conjunto com os compiladores MTASC (AS2.0) e mxmlc (AS3.0 e MXML) contido no Flex SDK.
Ferramentas
- FlashDevelop 3.0.0Beta 7
- Gestão de projectos AS3 e integração com o Flex SDK
- Gestão de projectos AS2 e integração com o compilador MTASC
- Code completion e introspecção de classpaths
- Gerador de Actionscript, e.g. snippets, event handlers, acessor methods
- Introspecção de símbolos e classes em ficheiros SWF e SWC
- Compilador AS2.0
- swf2xml e xml2swf (swfmill)
- Flex 3 SDK
- Compilador AS3.0 e MXML
- Flex 3 Framework
- AIR Debugger Launcher
Nota: É também necessário instalar a versão debug mais recente do Adobe Flash Player para testar aplicações Flex e AIR.
Actionscript 2.0
Começamos por criar um projecto AS2 a partir do template:
"Project>New Project>Default Project"
A estrutura do projecto é a seguinte:
- src: Pasta onde que contem o código fonte, os ficheiros com seta verde indicam que são sempre compilados. É possível activar/desactivar através do botão direito do rato.
- bin: O resultado da compilação vai ser colocado nesta pasta sempre que se execute "Project->Build Project".
Na pasta src já está criada uma classe Main.as contendo um método estático (main) que é o ponto de entrada da nossa aplicação, isto é, a primeira intrução a correr quando o swf for inicializado no Flash Player.
No entanto esta situação não é a ideal, principalmente para quem esteja habituado a trabalhar no Flash IDE dado que este ponto não corresponde ao 1º frame da timeline principal num fla. Que no fundo é um objecto MovieClip adicionado aquando da compilação.
O que fazer?
Tornar uma instância de uma subclasse de MovieClip como novo "ponto de entrada", Document Class. Este processo foi chamado de Natural Entry Point por Aral Balkan.
Como?
A ferramenta swfmill (incluída no editor) permite compilar um swf a partir de um ficheiro xml de configuração e vice-versa, a versão final da nossa aplicação vai ser compilada utilizando esta ferramenta enquanto que o build normal do projecto vai apenas compilar a biblioteca.
- Nas opções do projecto:
- Evitar que o compilador procure pelo método estático como ponto de entrada:
(Compiler Option>Use Main Entry Point) - false
- Definir a localização da compilação da biblioteca:
(Output>Output file) - src\library\classes.swf
- Definir o comando a executar após a compilação da biblioteca:
(Build>Post-Build Command Line)
"$(ToolsDir)\swfmill\swfmill.exe" simple src/application.xml bin/$(ProjectName).swf
- Evitar que o compilador procure pelo método estático como ponto de entrada:
- Na pasta src:
- Criar o ficheiro xml a partir do qual o swfmill vai construir o swf: application.xml
XML:<?xml version="1.0" encoding="iso-8859-1"?>
- Criar o ficheiro xml a partir do qual o swfmill vai construir o swf: application.xml
- Finalmente, editar a classe Main (Document Class):
{
public function Main()
{
}
}
Exemplo
Está na altura de ver algo em prática, colocar uma imagem (presente na biblioteca) no centro da timeline principal.
É necessário colocar os assets dentro da pasta library (ou outra, mas é mais cómodo juntar todos os elementos na mesma pasta) através da opção:
(Add>Library Asset...). O linkage ID é gerado automaticamente com o caminho do ficheiro do tipo {pasta.subpasta.nomedoficheiro}.
Finalmente, a Document Class:
{
public function Main()
{
buildUI();
}
private function buildUI():Void
{
var img:MovieClip = this.attachMovie("src.library.imagem.jpg", "minhaImagem", this.getNextHighestDepth());
img._x = (Stage.width - img._width) * 0.5;
img._y = (Stage.height - img._height) * 0.5;
}
}
Actionscript 3.0
Como compilador mxmlc não pode ser distribuido fora do Flex SDK, temos de indicar a sua localização ao editor em:
(Tools>Program Settings>AS3Context>Flex SDK location) - e.g. "C:\flex_sdk_3"
E isto é tudo que basta para começar a desenvolver aplicações em AS3, Flex ou AIR. =)
Exemplo:
Agora o mesmo exemplo anterior mas em AS3.
Criar um projecto a partir do template, Project>New Project>Default Project
Agora qualquer classe que seja uma subclasse de Sprite ou MovieClip pode ser o nosso ponto de entrada no programa, neste caso o projecto já criou a classe Main.
Criar uma pasta library para colocar os assets necessários aquando da compilação e adicionar a imagem.
Add>Library Asset...
Em AS3.0 não existem mais linkage ID's, agora cada asset está associado a uma classe que para ser adicionada a uma DisplayList precisa descender de DisplayObject ou de uma qualquer das duas subclasses. A metatag embed informa o compilador que deve colocar esse elemento no swf.
A classe Main fica:
{
import flash.display.DisplayObject;
import flash.display.Sprite;
public class Main extends Sprite
{
[Embed(source = 'library/imagem.jpg')]
private const Imagem:Class;
public function Main():void
{
buildUI();
}
private function buildUI():void
{
/*O compilador faz a tradução automática da superclasse de Imagem
com base no conteúdo embebido, por isso não é necessário fazer o cast para DisplayObject*/
var img:DisplayObject = new Imagem();
img.x = (stage.stageWidth - img.width) * 0.5;
img.y = (stage.stageHeight - img.height) * 0.5;
addChild(img);
}
}
}
Flex
Novamente basta criar um projecto a partir do template (Flex 3 Project) e começar a programar.
Pegando no exemplo anterior:
<![CDATA[
import flash.events.Event;
import mx.controls.Image;
import mx.core.BitmapAsset;
[Embed(source = '../assets/imagem.jpg')]
private const Imagem:Class;
private function completeHandler(evt:Event):void
{
var img:BitmapAsset = new Imagem() as BitmapAsset;
myImage.source = img;
}
]]>
AIR
Ainda não fiz o deploy de uma aplicação AIR a partir do FlashDevelop, os ficheiros batch para criar os certificados estão a dar um erro que ainda não consegui resolver. Assim que conseguir escrevo um post sobre o assunto.
Conclusão
Este é apenas um dos vários workflows para desenvolver na plataforma Flash que tem como vantagem a comodidade de ser semelhante para as várias tecnologias, no entanto o Adobe Flex Builder continua a ser a ferramenta por excelência para desenvolver aplicações Flex e AIR.
Nota: A Adobe oferece licenças educativas para estudantes e membros de instituições educativas.
1 Comments.