Efecto nieve / hojas cayendo

Os pongo un tutorial en AS2 a petición de Jordi, que simula el movimiento de las hojas, yo lo he adaptado de uno que encontré en cristalab que hacía lo mismo con los copos de nieve. (Os pondría el link pero me da un poco de pereza ) Si alguien lo quiere en as3 también lo tengo, ya lo colgaré.

El código está todo en un mismo frame, que se encuentra dentro de un Movie contenedor que está en la escena principal.

Además hay un mcHoja, que se repetirá y con código cambiaremos su tamaño y su transparencia.

Definimos el ancho, la altura a lo largo de donde queremos los copos u hojas. Y el máximo tamaño de los mismos.

Código:


var width2 = 100;
var height2 =  stage.stageHeight;
// Máximo tamaño copos y cantidad
var max_tamaño = 300;



Con esta funcion obtenemos un número aleatorio, supongo que ya la conocéis.

Código:


//////////////////////////////////////////////////////////////////
function randRange(min:Number, max:Number):Number {
    var randomNum:Number = Math.floor(Math.random() * (max - min + 1)) + min;
    return randomNum;
}
//////////////////////////////////////////////////////////////////


La siguiente función es la que se va actualizando con el enterFrame, y que contiene los parámetros máximos
hasta donde llegan las hojas.
Si os fijáis, las hojas nunca se eliminan, si no que vuelven arriba para no cargar de movies la escena.

Código:


function moveSnow() {
   
      this._rotation+=this.rot;
      this._y  += this.k;
      this._x += this.viento;
      if (this._y>height2+10) {
           this._x = -(width2/2)+Math.random()*(3.5*width2);
            this._y = -20;
         
      }

         if (this._x>width2+30)  {
         this._x = -(width2/2)+Math.random()*(3.5*width2);
            this._y = -20;
         
        }
      if (this._x<-20){
         this._x = -(width2/2)+Math.random()*(3.5*width2);
            this._y = -20;
      }
   
}


//////////////////////////////////////////////////////////////////

En la función init hacemos el bucle de 70 hojas, o las que queramos.
Sería más limpio cambiar el setente y poner una constante que queráis cambiar a vuestro antojo.
También aquí definimos cómo queremos el viento, la alteración de por dónde nacerán las hojas y la rotación
que podrán tener para darle más realismo.

Código:


function init(){
   for(var j=0;j<70;j++){
   i = this.getNextHighestDepth();
   tmp = this.attachMovie("mcHoja","hoja_mc" +j,i);
   tmp._x = -(width2/2)+Math.random()*(3.5*width2);
   tmp._y =-(height2/20)+Math.random()*(3.5*height2);
   tmp._alpha = randRange(50, 100);
   tmp._xscale = tmp._yscale=0.5+Math.random()*(max_tamaño*0.5);
   tmp._yscale = tmp._xscale;
   tmp.k=1+Math.random()*2;
   tmp.viento = -1.6+Math.random()*(1.4*3);
   tmp.num=Math.random()*1;
     tmp.aux=Math.random()*2-1;
   
   if (tmp.aux==0) {
     tmp.aux=1;
    }
   tmp.num=tmp.k*tmp.aux;
   tmp.rot=tmp.num;
   
   tmp.moving = true;
   tmp.onEnterFrame = moveSnow;
   }
}
//////////////////////////////////////////////////////////////////


Finalmente tenemos la llamada a init().

Código:


init();



Muy interesante, Cuando tenga un ratillo ya le hecharé un ojo.

Interesante... cuando tenga tiempo si no lo has colgado ya lo pasaré yo a as3