Clase para usar cualquier Imagen de fondo en ActionScript 3

Esta clase la tenía escrita para crear un fondo de mosaico a partir de una imagen de la biblioteca, de forma similar aar a lo que se puede hacer con background:url() en CSS. Así esta usará ajustará la imagen del fondo cuando el stage la requiera.

Su uso es muy sencillo, ya que solo debes identificar una imagen con el nombre de clase Pattern, como se muestra en la siguiente imagen:



Esta es la clase:

Código ActionScript :

package
{
import flash.display.*;
import flash.events.*;
import flash.display.Sprite;
import flash.geom.Matrix;
//
dynamic public class AddPattern extends MovieClip
{
private var maxWidth:Number;
private var maxHeight:Number;
private var Bitmap:BitmapData;
private var RadialGradient:Sprite;
private var BackGround:Sprite;
//
public function AddPattern() : void
{
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
Bitmap = new Pattern(0, 0);
//
BackGround = new Sprite();
addChild(BackGround);
//
RadialGradient = new Sprite();
RadialGradient.graphics.beginGradientFill(GradientType.RADIAL,[0x000000,0x000000],[0,.5],[0,255],new Matrix().createGradientBox(stage.stageWidth,stage.stageHeight,0,0,0));
RadialGradient.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
addChild(RadialGradient);
//
maxWidth = stage.stageWidth - 1;
maxHeight = stage.stageHeight - 1;
//
stage.addEventListener(Event.RESIZE, fillStage);
stage.addEventListener(Event.ADDED, fillStage);
}
//
public function fillStage(event:Event) : void
{
if (stage != null)
{
if((stage.stageWidth > maxWidth) || (stage.stageHeight > maxHeight))
{
with (BackGround)
{
graphics.beginBitmapFill(Bitmap, null, true, true);
//
if(stage.stageWidth > maxWidth){maxWidth = stage.stageWidth;}
if(stage.stageHeight > maxHeight){maxHeight = stage.stageHeight;}
//
graphics.drawRect(0, 0, maxWidth, maxHeight);
graphics.endFill();
}
}
updateRadialFilter();
}
}
//
public function updateRadialFilter() : void
{
RadialGradient.width = stage.stageWidth;
RadialGradient.height = stage.stageHeight;
}
}
}

Y aquí hay un ejemplo de su uso, que como verás, también es sensible a un cambio de tamaño en la ventana del navegador, expandiéndose y manteniéndose a pantalla completa.

Finalmente recomendaría que se considere el tamaño de una imagen al vincularla ya que cuanto más pequeña sea esta, mayor sera el esfuerzo que hará procesador para duplicarla hacerla ajustar al tamaño completo de la pantalla.

Por cierto. Los que tengan una CPU "Delicada" que vigilen con el ejemplo

Si empiezas a redimensionar la ventana, se te sube el uso de CPU por las nubes. Creo que Flash debería soportar trabajar con la tarjeta gráfica de forma opcional o si empieza a sobrecargar la CPU principal.

Primero que nada, he logrado un par de grandes cambios a favor acerca de esta clase.

Primero, cuando Bleend, Zah y un poco Zguillez me ayudaron a checar que tanto procesador se tragaba el ejemplo al jugar como acordeonistas maníacos con el tamaño de la ventana, ambos estuvieron de acuerdo en que era una cifra notable. En mi caso, con FireFox el uso del CPU se disparaba temporalmente hasta un 47-68% por un par de segundos y luego se estabilizaba.

Esto me hizo cuestionarme mucho sobre que era el causante de tal fallo, y como podría solucionarlo... Por fortuna me ayudo a optimizar la Clase (mas adelante).

Ahora, jamas me puse a probar una diferencia real entre el procesador que ocupaba mi ejemplo y el procesador que ocupa FireFox al cambiar el tamaño de la ventana como un acordeonista maníaco. Grata sorpresa me llevo cuando descubro que con cualquier pestaña abierta YA se come un buen trozo de procesador, sin importar de que este dentro de esta.

Mi Conclusión: El procesador se dispara a los altos cielos (60%) cuando cambias el tamaño de brutal manera la ventana por acción y culpa misma de FireFox y NO por el reescalado que ejecuta el Listener en mi clase. Como sea, ajuste el Listener de la clase para que cargue la BitmapData únicamente cuando el tamaño de esta es inferior a la que el stage exige.

Código ActionScript :

package
{
   import flash.display.*;
   import flash.events.*;
   import flash.display.Sprite;
   import flash.geom.Matrix;
   //
   dynamic public class AddPattern extends MovieClip
   {
      private var maxWidth:Number;
      private var maxHeight:Number;
      private var Bitmap:BitmapData;
      private var RadialGradient:Sprite;
      private var BackGround:Sprite;
      //
      public function AddPattern() : void
      {
         stage.scaleMode = StageScaleMode.NO_SCALE;
         stage.align = StageAlign.TOP_LEFT;
         Bitmap = new Pattern(0, 0);
         //
         BackGround = new Sprite();
         addChild(BackGround);
         //
         RadialGradient = new Sprite();
         RadialGradient.graphics.beginGradientFill(GradientType.RADIAL,[0x000000,0x000000],[0,.5],[0,255],new Matrix().createGradientBox(stage.stageWidth,stage.stageHeight,0,0,0));  
         RadialGradient.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
         addChild(RadialGradient);
         //
         maxWidth = stage.stageWidth - 1;
         maxHeight = stage.stageHeight - 1;
         //
         stage.addEventListener(Event.RESIZE, fillStage);
         stage.addEventListener(Event.ADDED, fillStage);
         return;
      }
      //
      public function fillStage(event:Event) : void
      {
         var evt:* = event;
         if (stage != null)
         {
            if((stage.stageWidth > maxWidth) || (stage.stageHeight > maxHeight))
               {
                  var a:* = BackGround;
                  with (BackGround)
                  {
                     graphics.beginBitmapFill(Bitmap, null, true, true);
                     //
                     if(stage.stageWidth > maxWidth){maxWidth = stage.stageWidth;}
                     if(stage.stageHeight > maxHeight){maxHeight = stage.stageHeight;}
                     //
                     graphics.drawRect(0, 0, maxWidth, maxHeight);
                     graphics.endFill();
                  }
               }
         updateRadialFilter();
         }
      return;
      }
      //
      public function updateRadialFilter() : void
      {
         RadialGradient.width = stage.stageWidth;
         RadialGradient.height = stage.stageHeight;
         return;
      }
   }
}

¿Esto a la final pasó a portada?

Freddie escribió:

Aqui. Por cierto, quiero modificar drasticamente el tip ya que puli la clase a grado que ya ni se parece... Y de hecho, no se en que estaba pensando aquel día, ya que si te fijas bien ni siquiera es una clase realmente, sino un archivo as externo.

Pues cambiala, eres un editor para eso.

Freddie escribió:

Ooh, bueno. Pensé que debía pedir permiso para cambiar de tal manera el contenido de un tip. Luz verde, ando en ello.