Comunidad de diseño web y desarrollo en internet online

Borrar o recortar una imagen en Actionscript 3

En ocasiones hemos tenido la necesidad de quitar una parte de una imagen, para esto usualmente usamos mascaras, pero cuando se trate de una imagen tenemos otra opción con la ayuda de BlendMode.ERASE .

Código :

bitmapData1.draw( bitmapData2, null, null, BlendMode.ERASE);

Donde bitmapData1 es un BitmapData con la imagen que queremos recortar o borrar, y bitmapData2 es la imagen o clip con la forma deseada para el borrado.

Ahora que ya sabemos como borrar una parte de la imagen podemos jugar con sus 2 tipos de uso para simular un recorte, veamos como trabaja esto con un ejemplo:

Tenemos 2 botones, una foto cualquiera y otro clip que nos servirá para borrar la imagen. En este ejemplo lo que recortaré serán los ojos y la boca.


Código :

package  
{
   import flash.display.Bitmap;
   import flash.display.BitmapData;
   import flash.display.BlendMode;
   import flash.display.Sprite;
   import flash.events.MouseEvent;
   import flash.geom.Matrix;
   import flash.geom.Rectangle;
   
   public class ClabCut extends Sprite
   {
      private var content_mc:Sprite;
      
      public function ClabCut() 
      {
         content_mc = new Sprite();
         addChild( content_mc );
         
         mode1_btn.addEventListener(MouseEvent.CLICK, mode1ClickHandler);
         mode2_btn.addEventListener(MouseEvent.CLICK, mode2ClickHandler);
      }
      
      private function mode1ClickHandler(e:MouseEvent):void 
      {
         photo_mc.visible = false;
         eyes_mc.visible = false;

         // Hacemos una captura del clip a borrar
         var bmpPhoto:BitmapData = new BitmapData(photo_mc.width, photo_mc.height, true, 0x00);
         bmpPhoto.draw( photo_mc );
         
         // Hacemos el borrado y con una matriz mantenemos la ubicación
         bmpPhoto.draw( eyes_mc, new Matrix(1,0,0,1, eyes_mc.x - photo_mc.x, eyes_mc.y - photo_mc.y ), null, BlendMode.ERASE);
         
         // Limpiamos el contenedor y el resultado
         while ( content_mc.numChildren > 0 ) content_mc.removeChildAt(0);
         content_mc.addChild( new Bitmap(bmpPhoto) );
      }
      
      private function mode2ClickHandler(e:MouseEvent):void 
      {
         // Lo mismo que en el Modo1...
         
         photo_mc.visible = false;
         eyes_mc.visible = false;

         var bmpPhoto:BitmapData = new BitmapData(photo_mc.width, photo_mc.height, true, 0x00);
         bmpPhoto.draw( photo_mc );
         bmpPhoto.draw( eyes_mc, new Matrix(1,0,0,1, eyes_mc.x - photo_mc.x, eyes_mc.y - photo_mc.y ), null, BlendMode.ERASE);
         
         // ... Aquí se hace un borrado más para obtener el otro recorte
            // Hacemos una captura del clip a borrar (El mismo del inicio)
            var bmpEyes:BitmapData = new BitmapData(photo_mc.width, photo_mc.height, true, 0x00);
            bmpEyes.draw( photo_mc );
            
            // Hacemos el borrado y no nos preocupamos por la matriz porque la imagen ya es del mismo tamaño
            bmpEyes.draw( new Bitmap(bmpPhoto), null, null, BlendMode.ERASE);
         //--
         
         while ( content_mc.numChildren > 0 ) content_mc.removeChildAt(0);
         content_mc.addChild( new Bitmap(bmpEyes) );
      }
      
   }

}

Archivos del Ejemplo

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate