Ayuda ejercicios unidad 23: Animaciones avanzadas



Ejercicio 1: Nieve

  1. Abre un nuevo documento haciendo clic en ArchivoNuevo.
  2. Selecciona ActionScript 3.0 y pulsa Aceptar.
  3. Guárdalo como nieve.fla.
  4. Selecciona el fotograma 1 y abre el Panel Acciones desde VentanaAcciones.
  5. Escribe lo siguiente para dibujar el fondo e importar las clases necesarias:
    // Importamos las clases necesarias
    import flash.filters.BlurFilter;
    
    // Creamos el fondo de la película
    var fondo:MovieClip = new MovieClip;
    fondo.graphics.beginFill(0x993333);
    fondo.graphics.moveTo(0,0);
    fondo.graphics.lineTo(550, 0);
    fondo.graphics.lineTo(550, 400);
    fondo.graphics.lineTo(0, 400);
    fondo.graphics.lineTo(0, 0);
    fondo.graphics.endFill();
    addChild(fondo);
    Si lo pruebas, verás que se rellena el fondo con un tono rojo.
  6. Escribe lo siguiente para dibujar la estrella y situarla en el centro de la pantalla:
    //Creamos la estrella
    var estrella:MovieClip = new MovieClip ;
    estrella.graphics.lineStyle(10, 0x000000, 100, true, "normal", "none", "miter", 0);
    estrella.graphics.beginFill(0xCCFF33, 85);
    estrella.graphics.moveTo(20+stage.width/2, -91+stage.height/2);
    estrella.graphics.lineTo(22+stage.width/2, -21+stage.height/2);
    estrella.graphics.lineTo(84+stage.width/2, 0+stage.height/2);
    estrella.graphics.lineTo(22+stage.width/2, 21+stage.height/2);
    estrella.graphics.lineTo(20+stage.width/2, 91+stage.height/2);
    estrella.graphics.lineTo(-22+stage.width/2, 37+stage.height/2);
    estrella.graphics.lineTo(-86+stage.width/2, 56+stage.height/2);
    estrella.graphics.lineTo(-50+stage.width/2, 0+stage.height/2);
    estrella.graphics.lineTo(-86+stage.width/2, -56+stage.height/2);
    estrella.graphics.lineTo(-22+stage.width/2, -37+stage.height/2);
    estrella.graphics.lineTo(20+stage.width/2, -91+stage.height/2);
    estrella.graphics.endFill();
    addChild(estrella);
    Ahora, ya tenemos el fondo y la estrella en el centro.
  7. Escribe lo siguiente para añadirle un brillo dinámico a la estrella:
    var brilloMax:Boolean = false;
    var miBrillo:Number = 80;
    
    import flash.filters.GlowFilter;//Necesitamos importar el filtro
    estrella.addEventListener(Event.ENTER_FRAME, cambiarBrillo);
    function cambiarBrillo(event):void
    {
    	//Hacemos que el brillo se vaya intensificando y atenuando
    	var brillo:GlowFilter = new GlowFilter(0xCCCC88,100,miBrillo,miBrillo,1,1);
    	estrella.filters = [brillo];
    	if (brilloMax) {
    		miBrillo +=  3;
    		if (miBrillo > 120) {
    			brilloMax = false;
    		}
    	} else {
    		miBrillo -=  3;
    		if (miBrillo < 80) {
    			brilloMax = true;
    		}
    	}
    }
  8. Por último, añademos las funciones que nos permitan arrastrar y soltar la estrella.
    // Funciones para poder mover la estrella
    estrella.addEventListener(MouseEvent.MOUSE_DOWN, arrastrar);
    function arrastrar(event:MouseEvent):void {
    	estrella.startDrag();// Al mantener pulsada la estrella podremos arrastrala
    }
    estrella.addEventListener(MouseEvent.MOUSE_UP, soltar);
    function soltar(event:MouseEvent):void {
    	estrella.stopDrag();// Cuando soltemos, la estrella permanecera en el lugar que deseemos
    }
  9. Como la estrella era un único objeto, lo hemos creado directamente en el panel de acciones. En cambio, como los copos son muchos objetos iguales, es más útil que creemos una clase. Haz clic en el menú Archivo Nuevo... y elige Clase de ActionScript 3.0.
  10. En el cuadrod e diálogo, especifica Copo como nombre de la clase.
  11. El siguiente código lo introduciremos en la Clase (archivo .as) donde incluiremos todas las funciones y variables para un copo. Calcularemos las posiciones, los tamaños y las velocidades aleatorias. Mediante la variable vidaCopo controlaremos si el copo se derrite o no.
    package {//Importamos las clases necesarias
    	import flash.display.MovieClip;//Necesitamos MovieClip que es lo que crearemos
    	import flash.filters.BlurFilter;//El filtro que emplearemos
    	import flash.events.Event; //Utilizaremos evento
    	import flash.events.EventDispatcher; //Y un generador de eventos
    	//Y creamos nuestra clase como una subclacse (extends) de MovieClip, para que disponga de sus métodos
    	public class Copo extends flash.display.MovieClip {
    		private var velocidad:Number;// Velocidad de caída del copo
    		private var estrella:MovieClip;// Objeto estrella que utilizaremos para saber si choca con ella
    		private var fondo:MovieClip;// Objeto sobre el que aparecerán los copos
    		private var vidaCopo:Number=300;// La vida que tendrá el copo antes de derretirse
    
    		public function Copo(_estrella:MovieClip, _fondo:MovieClip) {
    			this.estrella=_estrella;//Asignamos los parámetros a sus respectivas propiedades
    			this.fondo=_fondo;
    			//dibujamos el copo
    			this.graphics.beginFill(0xFFFFFF);
    			 this.graphics.moveTo(20, -91);
    			 this.graphics.lineTo(22, -21);
    			 this.graphics.lineTo(84, 0);
    			 this.graphics.lineTo(22, 21);
    			 this.graphics.lineTo(20, 91);
    			 this.graphics.lineTo(-22, 37);
    			 this.graphics.lineTo(-86, 56);
    			 this.graphics.lineTo(-50, 0);
    			 this.graphics.lineTo(-86, -56);
    			 this.graphics.lineTo(-22, -37);
    			 this.graphics.lineTo(20, -91);
    			this.graphics.endFill();
    			// Inicializamos las variables, posición del copo, el desenfoque y su velocidad
    			this.width=num_aleatorio(2,6); //Tamaño aleatorio
    			this.height=this.width;
    			this.velocidad=num_aleatorio(2,5); //Velocidad aleatoria
    			var des:Number=num_aleatorio(3,5); //Desenfoque aleatorio
    			var desenfoque:BlurFilter=new BlurFilter(des,des);
    			this.filters=[desenfoque];
    			//Posición aleatoria, con respecto al fondo
    			this.x=num_aleatorio(fondo.x,fondo.width);
    			this.y=fondo.y; 
    			//El evento added se produce al agregar el elemento a la escena o a un contenedor
    			//Así, no comenzará a caer hasta que no se visualice.
    			this.addEventListener("added", iniciarCaida);
    		}
    		private function iniciarCaida(event):void {
    				this.addEventListener("enterFrame", caerCopo);
    		}
    		// Función para saber si choca contra la estrella o llega al suelo
    		private function parado():Boolean { //Comprobamos si ha llegado al fondo o chocado con la estrella
    			return this.y>=fondo.height-this.height/2 || estrella.hitTestPoint(this.x, this.y, true);
    		}
    		// Función que hará caer o parar al copo
    		private function caerCopo(event) {
    			if (! parado()) {//Si está cayendo
    				this.y+=this.velocidad; //Aumentamos Y
    			} else { //Si está parado...
    				if (this.vidaCopo) { //Y le queda vida...
    					this.vidaCopo-=1; //Le quitamos vida
    				} else { //Si no le queda vida
    					this.alpha-=0.1; //Lo vamos haciendo transparente
    					if (this.alpha<=0) {//Cuando ya no se vea...
    					   //Lo eliminamos, quitando sus eventos
    						this.removeEventListener("added", iniciarCaida);
    						this.removeEventListener("enterFrame", caerCopo);
    						// y lanzando un evento que diga a la película que lo tiene que borrar
    						dispatchEvent(new Event("copoDerretido", true));
    					}
    				}
    			}
    		}
    		
    		// Función para crear el numero aleatorio
    		private function num_aleatorio(min:Number ,max:Number) {
    			//Genera un número aleatorio dentro de un rango
    			max++;
    			max=max-min;
    			return min+(Math.floor((Math.random()*(max*10)))%max);
    		}
    	}
    }
  12. Guara el archivo con el nombre de la clase, es decir, guárdalo como Copo.as.
  13. Para acabar, añade a la película principal (nieve.fla) las funciones que lanzarán el copo, y la que los borra cuando se produzca el evento copoDerretido.
    addEventListener(Event.ENTER_FRAME, nevar);
    function nevar(event):void{
    	addChild(new Copo(estrella, fondo));//Creamos un copo y lo agregamos a la escena
    }
    addEventListener("copoDerretido", borrarCopo);
    function borrarCopo(e:Event):void{
    	removeChild(Copo(e.target));
    }
  14. Prueba la película. Nota: en nuestro ejemplo, funciona a 24fps.


Volver






Página inicial  Cursos Informática Gratuitos

Síguenos en:   Facebook       Sobre aulaClic            Política de Cookies


© aulaClic. Todos los derechos reservados. Prohibida la reproducción por cualquier medio.