¿Quieres registrarte?

Clase de Actionscript 3 para dibujar sobre cualquier Sprite

Por: Zandy
13 de Octubre del 2009
1028 de clabLevel
Otros artículos de Zandy
3,233 visitas

Esta es una simple clase que permite convertir cualquier sprite y/o MovieClip en un pizarron para dibujar, teniendo la posibilidad de cambiar estilo de pintado, borrado de la pizarra asi como activar o desactivar el modo de pintado. Para entender la clase mira los comentarios en el código.

Código :

package 
{
   import flash.display.DisplayObject;
   import flash.display.MovieClip;
   import flash.display.Sprite;
   import flash.events.MouseEvent;
   
   /**
    * @version 1.0
    * @author Zandy Bierhoff
    */
   public class TPainter  
   {
      // Modos de pintado...
      public static const PAINT:uint = 1;            // Modo de pintado.
      public static const NONE:uint = 0;            // No hace nada.
      
      private var __target:Sprite;               // Instancia del objeto que se va a convertir en pizarra.
      private var __paintMode:uint = TPainter.NONE;   // Por defecto no pinta
      private var __thickness:Number = 5;            // 5 de grosor por defecto.
      private var __colorLine:uint = 0xFF0000;       // rojo por defecto.
      private var __alpha:Number = 1;               // Alpha de linea de pintado.
      private var __actualCanvas:Sprite;            // Objeto pizarra donde realmente se pinta.
      
      /**
       * Constructor.
       * @param   target Objeto que se convertira en pizarra.
       * @param   mode Modo de pintado que se quiere inicilizar.
       */
      public function TPainter( target:Sprite, mode:uint ):void
      {
         this.__target = target;
         this._paintMode = mode;
      }
      
      /**
       * Se invoca cuando se presiona el click sobre el target.
       * @param   event Obj MouseEvent lanzado por _target
       */
      private function onTargetMouseDown(event:MouseEvent):void 
      {
         this.__actualCanvas = new Sprite();
         this.__target.addChild( __actualCanvas );   // Agrego 
         
         __actualCanvas.graphics.moveTo(__actualCanvas.mouseX, __actualCanvas.mouseY);
         __target.addEventListener(MouseEvent.MOUSE_MOVE, onTargetMouseMove);
         __target.addEventListener(MouseEvent.MOUSE_UP, onTargetMouseUp);
      }
      
      /**
       * Se invoca mientras el usuario tiene el click presionado
       * @param   event Objeto MouseEvent lanzado por _target
       */
      private function onTargetMouseMove(event:MouseEvent):void 
      {
         if( this.__paintMode == TPainter.PAINT ) {
            __actualCanvas.graphics.lineStyle(this.__thickness, this.__colorLine, this.__alpha);
         }
               
         __actualCanvas.graphics.lineTo(__actualCanvas.mouseX, __actualCanvas.mouseY);
         event.updateAfterEvent();// Making a smoother transaction of lines
      }
      
      /**
       * Se invoca cuando se levanta el mouse... [dejar de pintar o borrar]
       * @param   event Objeto MouseEvent lanzado por _target
       */
      private function onTargetMouseUp(event:MouseEvent):void {
         this.__target.removeEventListener(MouseEvent.MOUSE_MOVE, onTargetMouseMove);
      }
      
      /** Borra la pizarra completa **/
      public function _clean():void
      {
         __actualCanvas.graphics.clear();
      }
      
      
      /** Propiedades  **/
      public function get _paintMode():uint 
      { 
         return __paintMode; 
      }
      
      public function set _paintMode(value:uint):void 
      {
         if ( value != TPainter.NONE ) this.__target.addEventListener(MouseEvent.MOUSE_DOWN, onTargetMouseDown);
         else this.__target.removeEventListener(MouseEvent.MOUSE_DOWN, onTargetMouseDown);
   
         __paintMode = value;
      }
      
      
      public function get _thickness():Number { return __thickness; }
      
      public function set _thickness(value:Number):void 
      {
         __thickness = value;
      }
      
      public function get _colorLine():uint { return __colorLine; }
      
      public function set _colorLine(value:uint):void 
      {
         __colorLine = value;
      }
      
      public function get _alpha():Number { return __alpha; }
      
      public function set _alpha(value:Number):void 
      {
         __alpha = value;
      }
   }
}

Y para usarla

Código :

var pizarra:TPainter = new TPainter( my_sprite, TPainter.PAINT );

Por defecto el trazo es color rojo con ancho 5, para hacer cambios setear las propiedades _thickness( grosor de la linea ), _colorLine( color de linea ), _alpha ( opacidad del pintado ).

Espero les sea de utilidad :-)

Enviar a twitter Enviar a facebook


También te interesa


Etiquetas actionscript_3 dibujo

Comentarios | Enviar un comentario
Hola, parece que es una buena clase y todo pero deberías considerar a futuro agregar un archivo ejemplo de tus clases y no solo el bloque soberano de texto... Digo, esto ayudaría mucho a todo los usuarios que buscan probar la clase antes de decidir por ella y tener que aplicarla.
Por: M@U
sobre-escribe la funcion _clean() por esta.

Código :

/** Borra la pizarra completa **/
public function _clean():void
{
      __actualCanvas.graphics.clear();
}

Por: Zandy
. . .q bueno q tengo traductor si no no entendia nada ...=teng 9. . .n entendi NADA.
Por: lis-blog
Buen tip Zandy, te lo agradezco, es algo que puede que en el futuro me valga

M@U :

...pero deberías considerar a futuro agregar un archivo ejemplo de tus clases y no solo el bloque soberano de texto... Digo, esto ayudaría mucho a todo los usuarios que buscan probar la clase antes de decidir por ella y tener que aplicarla.


Estoy de acuerdo con M@U, por ejemplo, a mi me hubiese gustado ver un ejemplo.

Saludos y gracias de todas formas, la probaré en el futuro.
Por: Distriker
Me muchas gracias por esta clase, de verdad es bien util, sin embargo me gustaria saber como puedo hacer para borrar lo dibujado
Por: Daniel-blog
Deja un comentario
IMPORTANTE

Recuerda ser respetuoso, no insultes a otras personas, ni uses palabrotas, hay una persona al otro lado de la pantalla.

Habla bien, NO ESCRIBAS EN MAYUSCULA TODO, no escribas como en un SMS, evita cosas como "ke", "x q" y demás abreviaciones.

Aquí funcionan las etiquetas de los foros, puedes usar [b] para negrita, [img] para las imágenes, [url] para los enlaces, etc.

Si tienes preguntas técnicas, envíalas mejor al foro.