Flash libre, fácil

[Please note that this post was originally posted on January 2006, and although MTASC and SWFMill is still very valid toolset, there are other options for Open Source Flash development such as the Flex SDK or haXe.]

[Este artículo fue publicado en Enero de 2006, y aunque MTASC y SWFMill son perfectamente válidos, hay otras opciones para desarrollar Flash con herramientas libres como el SDK de Flex o haXe.]

Introducción

Desarrollar Flash con Software Libre no es tan fácil como alguno dice ni tan complicado como parece al principio. Muchas letras juntas (FAMES, AMES, MTASC,…) que incluso a veces es difícil recordar qué significan.

Para empezar hay que tener claro que lo único que hace falta para generar swfs es un compilador, MTASC. El “problema” es que no puede generar la librería, por lo que necesitaremos SWFMill. SWFMill lo que hace es, partiendo de un xml de definición y de elementos externos (jps, pngs, swfs…), generar un swf.

RECORDAR:

  • SWFMill genera swf con librería partiendo de xml y elementos externos.
  • MTASC inyecta el código necesario.

Podéis descargar los archivos de ejemplo aquí.
Podéis descargar el artículo en pdf + los archivos aquí.

Instalación de MTASC y SWFMill

Lo primero que necesitamos son los ejecutables de MTASC y SWFMill, que se bajan de sus respecticvas webs (al final del artículo están los enlaces). Una vez descargados los descomprimimos donde nos interese, por ejemplo en “Archivos de programa”. Podemos dejar el nombre con la versión, pero yo normalmente lo dejo como “mtasc” y “swfmill”, más sencillo.

Aunque no es necesario, sí es recomendable crear variables de sistema con sus respectivas rutas:

Botón derecho sobre “Mi PC” > Propiedades > Opciones Avanzadas > Variables de entorno > Variables del sistema > Nueva

Hay que agregar una para MTASC y otra para SWFMill. Para la de MTASC ponemos en un alarde de originalidad “mtasc” (sin comillas). En el valor hay que poner la ruta al ejecutable que acabamos de descomprimir, en mi caso:

  • “C:\Archivos de programa\mtasc\mtasc.exe”
  • “C:\Archivos de programa\swfmill\swfmill.exe”

¡Incluyendo las comillas!, esto es así por los espacios en la ruta.

Para comprobar que hemos hecho esto bien, abrimos una consola de dos (Inicio, Ejecutar, cmd) y escribimos:

  1. %mtasc% (enter)

Si nos muestra la “ayuda” de MTASC, bien, en caso contrario, mal. A veces es necesario reiniciar la sesión. Lo mismo para SWFMill.

Esto que cuento es para WinXP que es lo que tengo yo instalado. Para Win2000 será parecido y para Mac y Linux no tengo ni idea, pero seguro que hay algo parecido a las variables de entorno. Si algún usuario caritativo me quiere mandar la explicación de cómo hacerlo o un enlace con una explicación decente, la añadiré gustoso.

Empieza lo divertido

Recordemos que en principio basta con MTASC para generar swfs 100% funcionales. Vamos a ello. Hay que recordar que a MTASC lo único que le gusta es AS2, así que vamos a hacer una clase sencilla:

  1. class MTASCTest{
  2.  
  3.    function MTASCTest(){
  4.  
  5.       _root.createTextField("field",100,0,0,0,0);
  6.       _root.field.autoSize = true;
  7.       _root.field.text = "You rock! \m/";
  8.  
  9.    }
  10.  
  11.    public static function main():Void{
  12.       var app = new MTASCTest();
  13.    }
  14.  
  15. }

Abrimos una consola de DOS si no la tenemos abierta, nos movemos hasta el directorio donde hayamos creado la clase y escribimos esto (se puede copiar y pegar en la consola con el botón derecho):

  1. %mtasc% -swf MTASCTest.swf -main -header 200:200:12 MTASCTest.as (enter)

¡Olé! En el mismo diretorio se ha tenido que crear el archivo MTASCTest.swf que podemos ejecutar para alegria de nuestas mentes. Ahora veamos qué hacen los parámetros que hemos utilizado:

  • -swf nombreArchivo.swf. Esta claro, el archivo generado de salida
  • -main. Este parámetro lo que hace es crear un “punto de entrada” a la aplicación. Básicamente lo que hace MTASC es añadir a la línea de tiempo principal algo como:
    1. MTASCTest.main(this);

    Es importante notar que a la función main se le pasa una referencia de la línea de tiempo principal (this).
    En el ejemplo anterior no lo hemos utilizado, pero luego ya veremos cómo hacerlo.

  • -header ancho:alto:fps. Dimensiones y velocidad de la película
  • Archivo_origen.as. La clase por la que tiene que empezar el compilado.

Es MUY recomendable pasar por la web de MTASC para ver qué hacen el resto de parámetros posibles, que hay unos cuantos.

Ahora lo mismo pero con gracia

Ya que tenemos controlado(!) MTASC, vamos a ponerle alegría a la película, vamos a utilizar SWFMill. Como ya hemos dicho antes, de lo que se encarga SWFMill es de generar archivos swf a partir de un xml y elementos externos. De esa forma podemos tener una biblioteca de la que importar elementos con attachMovie.

XML de ejemplo (de la propia web de SWFMill)

  1. <?xml version="1.0" encoding="iso-8859-1" ?>
  2. <movie width="200" height="200" framerate="12">
  3.    <background color="articulos/flash_libre_facil/#ffffff"/>
  4.    <frame/>
  5. </movie>

Nos vamos a la consola, navegamos hasta el directorio y escribimos:

  1. %swfmill% simple library.xml SWFMillTest.swf (enter)

Este comando lo que hace es tomar “library.xml” como definición y crear el archivo “SWFMillTest.swf” como salida con el ancho, alto y velocidad definida. Como esto es poco útil, vamos a agregarle algo que podamos usar luego:

  1. <?xml version="1.0" encoding="iso-8859-1" ?>
  2. <movie width="300" height="200" framerate="12">
  3.    <background color="articulos/flash_libre_facil/#ffffff"/>
  4.    <frame>
  5.       <library>
  6.          <clip id="paradise" import="items/arecibo-beach.jpg"/>
  7.       </library>
  8.    </frame>
  9. </movie>

Con esto lo que hacemos es coger el objeto “items/arecibo-beach.jpg” y crear un objeto en la librería con nombre de exportación “paradise”, para luego poder hacer un attachMovie que es lo que nos interesa.

¡¡¡¡¡¡¡¡¡¡¡¡¡OJO!!!!!!!!!!!!! El jpg se está incluyendo en el swf, NO es una carga dinámica. Esto es lo mismo que crear en el IDE un objeto en la librería e importar un archivo jpg que luego irá incluido DENTRO del swf.

También vale y mucho la pena pasarse por la web de SWFMill para un listado completo de lo que se puede y no hacer. Se pueden importar archivos jpg, png, swf, fuentes y alguna cosa más interesante como definir en qué frame estarán disponibles qué elementos.

El toque final, unir SWFMill y MTASC

Pues llegó el momento, tenemos un generador de swfs y un inyector de código, estamos tardando. Con el mismo xml anterior, modificamos los comandos de MTASC para dejarlo así:

  1. %mtasc% -swf Application.swf -main Application.as

Como veis lo primero que hemos hecho es quitar el parámetro -header, ya que el swf ya está creado previamente con SWFMill, ahora lo único que hacemos es inyectar el código que nos interesa. En este caso un attachMovie de un elemento de la bibliteca. Modificamos la clase para dejarla así:

  1. class Application{
  2.  
  3.    function Application(){}
  4.  
  5.    public static function main(m:MovieClip):Void{
  6.       m.attachMovie("paradise","paradise",100);
  7.    }
  8.  
  9. }

Voilá!

Os dejo una pequeña utilidad para hacernos la vida más fácil. Abrimos un archivo de texto y escribimos:

  1. @echo off
  2.  
  3. echo ** SWFMIll **
  4. %swfmill% simple library.xml Application.swf
  5.  
  6. echo ** MTASC **
  7. %mtasc% -swf Application.swf -main Application.as

Y guardamos el archivo como “compile.bat”. Ahora solo tenemos que ejecutar este archivo (se puede hacer desde las acciones propias de SEPY, por ejemplo) para que el sólo ejecute SWFMill y luego MTASC :D

Lo siento otra vez por los MacPollo y los Linuxeros, pero seguro que también se puede hacer algo similar.

Conclusión

La conclusión es que desarrollar Flash con Software Libre es YA una realidad para muchos proyectos, siempre que tu campo no sea la animación tradicional (cosa que dudo porque no habrías ni abierto el link).

Hay que reconocer que no todo va a ser tan sencillo como esto. A día de hoy MTASC puede dar problemas con ciertas cosas como los componentes de Macromedia (bueno, yo diría que son los componentes de MM los que dan problemas con MTASC), pero repito que yo creo que está lo suficiente maduro para muchos proyectos.

También hay algunas librerías previas a la aparición de MTASC (como las de XPath de XFactorStudio) que no compilan en el modo estricto (-strict), lo cual es una pena, pero yo supongo que poco a poco las irán puliendo.

Bueno gentes, espero que esto ayude un poco a tirar de software libre cuando sea posible. No sólo porque sea gratuito Y abierto, sino porque es de CALIDAD.