Gabriela Trindade Perry: HCI, Design Cognition, Flex

This is something that worths sharing. For those, like me, that are learning to create custom components, a tip on the measure method. Check this script. Check the docs.
/********************************************

Isso é algo que vale a pena compartilhar. Para todos que, como eu, estão aprendendo a criar componentes customizados, uma dica sobre o método measure. Dá uma olhada no script. Dá uma olhada nos docs.

[code lang="actionscript"]package examples
{
import mx.containers.Canvas;
import mx.controls.LinkButton;

public class Measuring extends Canvas {

private var _closeButton:LinkButton;

public function Measuring(){
super();
}

override protected function createChildren():void{
super.createChildren();

if(!_closeButton){
_closeButton= new LinkButton;
_closeButton.label="FOO";
addChild(_closeButton);

trace("/******* createChildren *******/")
trace("LinkButton width: "+_closeButton.width); //WTF! 0!
trace("LinkButton explicitWidth: "+_closeButton.explicitWidth); //WTF! NaN!
trace("LinkButton measuredWidth: "+_closeButton.measuredWidth); //WTF! 0!
trace("/******* createChildren *******/")
}
}

override protected function measure():void{
super.measure();
trace("/******* measure *******/")
trace("LinkButton width: "+_closeButton.width); //WTF! 0!
trace("LinkButton explicitWidth: "+_closeButton.explicitWidth); //WTF! NaN!
//Of course… it MEASURES… Now it makes sense…
trace("LinkButton measuredWidth: "+_closeButton.measuredWidth); //Good kid: 45
trace("/******* measure *******/")
}

}
}[/code]

Essa classe converte um UIComponent num bitmap. Eu devia ter marcado o link de onde saiu isso…

[code lang="actionscript"] package utils
{
import mx.core.UIComponent;
import flash.display.BitmapData;
import flash.display.Bitmap;
import flash.geom.Matrix;public class UIComponentToBitmap extends UIComponent{

private var _contentBitmap:Bitmap;

public function UIComponentToBitmap():void{
super();
}

public static function draw(content:UIComponent):Bitmap{
var bitmapData:BitmapData = new BitmapData(content.width,
content.height,
true,
0xFFFFFF);
var m:Matrix= new Matrix();
bitmapData.draw(content, m);
return new Bitmap(bitmapData,"auto", false);
}
}
}[/code]

E aqui um exemplo de uso:
[code lang="actionscript"]
import mx.core.UIComponent;
import utils.UIComponentToBitmap;

public function initApp():void{
	var mypanel:Panel=new Panel;
        addChild(mypanel);

        var comp:UIComponent=new UIComponent;
	addChild(comp);

	var uic2bmp:Bitmap= UIComponentToBitmap.draw(mypanel);
	comp.addChild(uic2bmp);
}
[/code]

This problem raised on Flex-Brasil (read the post, in portuguese, of course). After a google search I found it was very common, and the solution is pretty widespread, but thought that it worth a post ;0)

See the example (view source enabled, as always).

***************************************************

Esse problema surgiu na Flex-Brasil (leia o post). Depois de procurar no google vi que era um problema bem comum, e que a solução era bastante divulgada, mas achei que valia um post ;0)
Veja o exemplo (com view source, como sempre).