Re sizable Canvas

<?xml version="1.0" encoding="utf-8"?>
<mx:Application backgroundColor="#fffffff" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
<mx:Style source="resources/css/style.css"/>
<mx:Script>
<![CDATA[
import mx.controls.Image;
import mx.controls.Label;
import mx.containers.Canvas;



public function init():void
{

var rCnv:ResizableCanvas = new ResizableCanvas();
rCnv.width = 200;
rCnv.height = 150;
rCnv.setStyle("horizontalCenter", 0);
rCnv.setStyle("verticalCenter", 0);
 
var inCnv:Canvas = new Canvas();
inCnv.percentWidth = 100;
inCnv.percentHeight = 100;
inCnv.setStyle("cornerRadius",16);
inCnv.setStyle("color",0x777777);
inCnv.setStyle("backgroundColor",'gray');
inCnv.setStyle("borderStyle","solid");
inCnv.setStyle("borderThickness",0);
inCnv.setStyle("borderAlpha",0);
inCnv.setStyle("cornerRadius",16);
rCnv.addChild(inCnv);



addChild(rCnv);

rCnv.minWidth = 80;
rCnv.maxWidth = 400;
rCnv.minHeight = 80;
rCnv.maxHeight = 270;
}
]]>
</mx:Script>
</mx:Application>

OUTPUT