Go to English Blog

Programando em ActionScript sem o Flash

Leia em 3 minutos

Estou refazendo a parte que faz o broadcasting de áudio e vídeo do Presentta, mas abrir o Flash e re-exportar o código-fonte para compilar o SWF estava se tornando um processo extremamente chato e demorado.

Eu já tinha usado o SDK do Flex para compilar ActionScript em SWF antes. A grande vantagem é que eu posso usar apenas a linha de comando para gerar os arquivos. Nada de uma IDE extramente lenta, como a do Flash. Além disso, ainda posso usar o Guard para compilar automaticamente sempre que um arquivo for modificado.

Instalando o Flex SDK no Mac OS X

A instalação do SDK é bastante simples. Após fazer o download do SDK, que tem por volta de 164MB, você precisa extrair os arquivos.

$ mkdir -p ~/local/flex
$ cd ~/local/flex
$ curl -O http://fpdownload.adobe.com/pub/flex/sdk/builds/flex4.6/flex_sdk_4.6.0.23201_mpl.zip
$ unzip flex_sdk_4.6.0.23201_mpl.zip

Agora, você precisa adicionar o diretório ~/local/flex/bin ao seu $PATH. Para isso, basta adicionar a linha abaixo ao arquivo ~/.bash_profile ou equivalente.

$ echo 'export PATH="$HOME/local/flex/bin:$PATH"' >> ~/.bash_profile

Recarregue suas configurações com o comando source ~/.bash_profile. Se tudo der certo, o comando which mxmlc está disponível.

$ which mxmlc
/Users/fnando/local/flex/bin/mxmlc

Compilando seu primeiro SWF

Diferente do que você está acostumado, para criar SWFs você usará apenas código ActionScript. Nada de IDE. E isso é uma coisa boa! Crie um arquivo chamado Main.as. Esse arquivo será o arquivo principal, que será equivalente ao stage principal do Flash.

package {
  import flash.display.Sprite;

  public class Main extends Sprite {
    public function Main() {
      trace("It works!");
    }
  }
}

Note que o nome do arquivo deve ser igual ao nome da classe, nesse caso, Main. Para compilar o arquivo Main.as você terá que executar o comando mxmlc.

$ mxmlc -output main.swf \
      -as3 \
      -static-link-runtime-shared-libraries \
      -default-size 130 50 \
      -optimize \
      -verbose-stacktraces \
      Main.as
Loading configuration file /Users/fnando/local/flex/frameworks/flex-config.xml
/private/tmp/main.swf (592 bytes)

Nada muito complicado. Estamos gerando o arquivo main.swf à partir do arquivo Main.as. O tamanho do stage será de 130x50. É óbvio que esse exemplo, não faz muita coisa. Se você abrir este arquivo no navegador será presenteado com uma bela tela branca que não faz nada!

Para visualizar uma descrição dos parâmetros aceitos pelo comando mxmlc, execute o comando abaixo.

$ mxmlc -help details list

Usando componentes

Um dos problemas que tive com a compilação foi que componentes não estavam sendo renderizados. O único modo que funcionou para mim foi exportar todos os componentes como uma biblioteca compartilhada. Como você precisa do Flash para fazer isso, resolvi disponibilizar este arquivo em https://s3.amazonaws.com/nandovieira/media/components.swc.

Vamos atualizar nossa classe Main para adicionar um botão. Ao clicá-lo, iremos alterar seu label para “Clicked”.

package {
  import flash.display.Sprite;
  import fl.controls.Button;
  import flash.events.MouseEvent;

  public class Main extends Sprite {
    public function Main() {
      var button:Button = new Button();

      button.label = "Click me!";
      button.move(15, 15);

      button.addEventListener(MouseEvent.MOUSE_DOWN, function(event:MouseEvent):void {
        event.target.label = "Clicked!";
      });

      addChild(button);
    }
  }
}

Para criar novos botões, você precisa carregar a classe flash.controls.Button, disponibilizada pelo arquivo components.swc. Esse arquivo deve ser carregado pela linha de comando.

$ mxmlc -output main.swf \
      -as3 \
      -static-link-runtime-shared-libraries \
      -default-size 130 50 \
      -optimize \
      -verbose-stacktraces \
      -include-libraries=`pwd`/components.swc \
      Main.as

O resultado final será algo como a imagem abaixo.

ActionScript 3 gerando botão

Compilando os arquivos automaticamente

Uma das melhores mudanças nesse processo é que agora posso executar tudo pela linha de comando. E posso, inclusive, cmpilar os arquivos automaticamente usando bibliotecas como o Guard. Primeiro, vamos instalar as gems necessárias.

$ gem install guard guard-shell

Na raíz de seu projeto, crie o arquivo Guardfile com o conteúdo à seguir.

guard :shell do
  watch(/\.as$/) do
    system <<-SHELL
      mxmlc -output main.swf \
            -as3 \
            -static-link-runtime-shared-libraries \
            -default-size 130 50 \
            -optimize \
            -verbose-stacktraces \
            -include-libraries `pwd`/components.swc \
            Main.as
    SHELL
  end
end

O código acima irá compilar o SWF toda vez que uma alteração for detectada em arquivos com a extensão .as. Para iniciar o monitor, basta executar o comando guard.

Finalizando

Por pior que o Flash seja, ele ainda é imbatível em uma coisa: broadcast de áudio e vídeo. É muito fácil publicar sua webcam e seu microfone. Já que não existe nenhuma outra alternativa viável, evitar o uso da IDE já ajuda bastante no dia-a-dia.

Para você ter uma ideia de como o Flex é (sic) flexível, veja o que fiz para o Presentta até agora:

Componente gerado com Flex

O componente acima conecta no media server, faz o broadcast, verifica as conexões e, em caso de queda, reconecta automaticamente. Muito bom para algumas horas de hacking. :)