Tire fotos dos seus componentes

Blz?!

A primeira vista o título pode soar no mínimo estranho, mas logo logo você vai entender e concordar (ou continuar achando que sou louco).

 Mas vamos ao que interessa, nesse post vou mostrar como você pode gerar uma imagem de qualquer componente da sua aplicação e apartir dai é só usar a criatividade. A classe responsável em "gerar a imagem" é a UISnapShot e o restante é a parte do "usar a criatividade"

package Componente {
  import flash.display.BitmapData;
  import flash.geom.Matrix;
  import flash.display.Bitmap;
  import mx.controls.Image;
  import mx.core.UIComponent;
  
  public class UISnapShot extends Image {
    public function UISnapShot() {
        /* Definindo largura e altura para que a imagem ocupe
        100% do espaço onde for adicionada */
        this.percentWidth = 100;
        this.percentHeight = 100;
        super();
    }
  
    public function set targetUI(Target: UIComponent): void {
        // Método set para definir o alvo 
        drawUISnapShot(Target);
    }
  
    private function drawUISnapShot(Target: UIComponent): void {
        var UIBData:BitmapData = new BitmapData(Target.width, Target.height);
        var UIMatrix:Matrix = new Matrix();
        UIBData.draw(Target, UIMatrix);
        source = new Bitmap(UIBData);
        invalidateDisplayList();
    }
  }
}

Agora que já vimos como "tirar foto do componente", vamos a parte de criatividade. Desde que eu instalei o W7 uma das poucas coisas que eu gostei foi a miniatura do aplicativo minimizado que aparece sempre que você coloca o mouse na barra de tarefas então para esse exemplo eu fiz uma classe bem simples para fazer as miniaturas das telas minimizadas na aplicação. E para isso eu fiz uma classe chamada FDockBarW7 (apesar de não ser uma dockBar foi o primeiro nome que me veio na cabeça).

package Componente {
  import Function.FParam;
  
  import flash.events.MouseEvent;
  import flash.events.TimerEvent;
  import flash.utils.Timer;
  
  import mx.containers.Canvas;
  import mx.core.UIComponent;
  import mx.effects.Fade;

  public class FDockBarW7 extends Canvas {
    private var _uParam: FParam = FParam.getInstance();
    private var _uParent: Object = new Object();
    private var _uTarget: Object = new Object();
    private var _uImgDock: UISnapShot = new UISnapShot();
    
    private static var _rInstance: FDockBarW7;
    
    public function FDockBarW7(Type: PrivateFDockBarW7) {
      super();
      addEventListener(MouseEvent.MOUSE_OVER, removeSnapShot);
      if (Type == null)
    throw new Error('Obtenha uma instância da classe usando o método getInstante().');
    }
    
    public static function getInstance(): FDockBarW7 {
   if (_rInstance == null)
    _rInstance = new FDockBarW7 (new PrivateFDockBarW7());
   return _rInstance;
  }
  
    public function showSnapShot(Parent: Object, Target: Object = null, Time: int = 3000): void {
      var
        _rTimer: Timer = new Timer(Time, 1);
        
      _rTimer.addEventListener(TimerEvent.TIMER, proRemove);
      _rTimer.start();
      
      function proRemove(evTimer: TimerEvent): void {
        dispatchEvent(new MouseEvent(MouseEvent.MOUSE_OVER));
      }    
      _uParent = Parent;
      _uTarget = Target;
      
      this.x = _uParent.x;
      this.y = _uParent.y - 160;
      _uImgDock.width = 300;
      _uImgDock.height = 150;
      
      if (_uTarget != null)
        _uImgDock.targetUI = _uTarget as UIComponent;
      else
        _uImgDock.targetUI = _uParent as UIComponent;
       
       this.addChild(_uImgDock);
      
      _uParam._sMDIApp.addChild(this);
    }
        
    public function removeSnapShot(e: MouseEvent): void {
      try {
      // _sMDIApp é o canvas principal da minha aplicação
        _uParam._sMDIApp.removeChild(this);
      }
      catch (e: Error){
      
      }
    }    
  }
}

internal class PrivateFDockBarW7 {
  public function PrivateFDockBarW7() {
  }
}

Já temos duas classes, UISnapShot para "tirar a foto" e a FDockBarW7 para montar a miniatura da janela. Nesse exemplo estou usando o MDIWindow.

public static function openTela(Componente: DisplayObject, Caption: String): void {
  var
    _rDock: FDockBarW7 = FDockBarW7.getInstance(), 
    _rTela: MDIWindow = new MDIWindow();
  
  // Listener para detectar o mouse sobre a tela  
  _rTela.addEventListener(MouseEvent.MOUSE_OVER, show);
  
  // Configuração da tela
  _rTela.title = Caption;
  _rTela.height = 400;
  _rTela.width = 500;
  _rTela.layout = 'vertical';
  _rTela.addChild(Componente);
  
  /* _sMDIApp mais uma vez o canvas principal da aplicação
  é o canvas de base usado pora adicionar telas, alert
  personalizado entre outros . . .*/
  _uFparam._sMDIApp.windowManager.add(_rTela);
  
  function show(e: MouseEvent): void {
    // se a tela estiver minimizada . . .
    if (_rTela.minimized)
      _rDock.showSnapShot(_rTela, Componente);
  }
}

private function cliBntAbrirTela(): void {
  var _r: FParam = FParam.getInstance();
  var _t: Teste = new Teste();

  _r._sMDIApp = cvApp;
 
  FncUtil.openTela(_t, 'teste');
}

Clique aqui para ver o exemplo

Bons estudos e bom trabalho a todos.


Abraços