En el siguiente tutorial explicaré paso a paso como:
Crear una máscara a partir del uso de dos archivos externos.
El Problema:
Crear un máscara con archivos con archivos en el escenario resulta sencillo, igualmente al incluirlos mediante attach desde la biblioteca...la "guafafa" se presenta al querer hacerlo desde archivos externos. Para ello utilizaremos la clase moviecliploader y steMask.
¿Qué haremos en este tutorial?
Crearemos una mascara a partir de un archivo externo y le aplicaremos dos archivos diferentes como textura. Intercambiandolas mediante botones.
Preparando lo Necesario:
Crea un carpeta para almacenar todos los archivos allí
1) Crear la Textura 1
Tengamos en cuenta que todos los archivos se deben crear en las mismas proporciones de manera que encajen como quieres. Para este ejemplo se utilizó 550x400. Aca solo haz la textura que quieres enmascarar y publicamos para generar el SWF
2) Crear la Textura 2
Aqui solo dibujar la textura 2 y publicamos para generar el SWF
3) Crear el Enmascarador
Ok, aqui dibujaremos lo que servirá como mascara (El que contendrá las texturas) Publiquemos para generar el SWF
4) Crear la Pelicula Principal
Esta va a ser la pelicula principal y contendrá lo siguiente: 2 Botones que serviran para aplicar las texturas, "YO le coloque el sombreado de la palabra MASK por estetica y presentar un mejor efecto", tiene dos capas una para el fondo y uno para el script...Muy bien prosigamos
ActionScript (AS2)
{Script en linea de tiempo principal}
Primero crearemos un clip de pelicula vacío
Código ActionScript :
this.createEmptyMovieClip("mcImage", this.getNextHighestDepth());createEmptyMovieClip();
Crea un clip de película vacío como elemento secundario de un clip de película existente. Este método se comporta de forma similar al método attachMovie(), aunque no es necesario proporcionar un identificador de vinculación externo para el nuevo clip de película. El punto de registro de un clip de película vacío recién creado es la esquina superior izquierda.
En el codigo anterior de crea en "this" (pelicula principal) un clip vacio que se llamara "mcImage" y se le asignara la profundidad delante de todos los demás.
Ahora creamos un variable tipo texto con el nombre del archivo externo que queremos cargar en este caso "textura1.swf"
Código ActionScript :
var sURL:String = "textura1.swf";
Crearemos un segundo clip vacio y le cargaremos la pelicula que servira como mascara
Código ActionScript :
this.createEmptyMovieClip("mcMask", this.getNextHighestDepth());
mcMask.loadMovie("mascara.swf")Ahora crearemos el MoveclipLoader!! lo primero les invito a profundizar sobre su uso y eventos.
MoveclipLoader
Esta clase le permite implementar funciones callback de detector que proporcionan información de estado mientras se están cargando archivos SWF, JPEG, GIF o PNG en clips de película. Para utilizar las funciones MovieClipLoader, utilice MovieClipLoader.loadClip() en lugar de loadMovie() o MovieClip.loadMovie() para cargar archivos SWF.
Resumen de eventos
Evento
- onLoadComplete = function([target_mc: MovieClip])
onLoadError = function(target_mc: MovieClip, errorCode: String, [httpStatus: Number])
onLoadInit = function([target_mc: MovieClip])
onLoadProgress = function([target_mc: MovieClip], loadedBytes: Number, totalBytes: Number)
onLoadStart = function([target_mc: MovieClip]) {}
Código ActionScript :
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
onLoadComplete = function () {
mcImage.setMask(mcMask);
};
mcLoader.loadClip(sURL, mcImage);
stop();Se crea una variable tipo moviecliploader, se le agrega el listener y con el evento Onloadcomplete (Cuando se carge todo) eanmascaramos mediante setMask() "mcImage" con "mcMask" que son los dos clip vacios que creamos finalmente cargamos a mcimagen el sURL; es decir la textura. el codigo en el fotograma debera quedar así:
Código ActionScript :
//Crear Fotograma Vacío
this.createEmptyMovieClip("mcImage", this.getNextHighestDepth());
//Asignar a variable la URL de la textura
var sURL:String = "textura1.swf";
//Crear segundo Clip vacio
this.createEmptyMovieClip("mcMask", this.getNextHighestDepth());
//carga el clip de mascara
mcMask.loadMovie("mascara.swf")
//crear el Moviecliploader
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
onLoadComplete = function () {
mcImage.setMask(mcMask);
};
mcLoader.loadClip(sURL, mcImage);
stop();Prueben la pelicula debera mostrar esto:
Ahora queremos es poder intercambiarlas mediante los botones pues en realidad es bastante sencillo...
Solo debemos cambiar el valor de la variable "sURL" y ejecutar nuevamente la carga en el mcLoader, quedaria asi el codigo del boton:
Código ActionScript :
on (release) {
var sURL:String = "textura2.swf";
_root.mcLoader.loadClip(_root.sURL, _root.mcImage);
}Pruebe la pelicula y LISTO!!! ya tenemos nuestra mascar con archivos externos
Bueno este fue mi primer aporte a la comunidad que me ha contribuido tanto, espero sea de ayuda para los CL!
Miguel García - Anigrama
Venezuela
