Vector graphics & animation using Flex

Question

Hi,
I want to draw a vector graphics in flex 3 then later on I
need to do some animation on it. But I encounter some problem and I
cannot solve it and I get this error message "1120: Access of
undefined property circle". Thanks... Here is the code:
<mx:Script>
<![CDATA[
import flash.display.*;
private var circle:Shape = new Shape()
var xPos:Number = 100;
var yPos:Number = 100;
var radius:Number = 50;
circle.graphics.beginFill(0xFF8800);
circle.graphics.drawCircle(xPos, yPos, radius);
addChild(circle);
]]>
</mx:Script>

Answer 1

You can declare and initialize variables in a <script>
tag outside a function, but manipulating them must be done in a
function. In this case, having a function for the creationComplete,
or perhaps the initialize events works well.
Also, you can't add shapes by themselves to the app, you must
wrap them in a UIComponent.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
creationComplete="init()">
<mx:Script>
<![CDATA[
import mx.core.UIComponent;
import flash.display.*;
private var circle:Shape = new Shape();
private function init():void{
var xPos:Number = 100;
var yPos:Number = 100;
var radius:Number = 50;
circle.graphics.beginFill(0xFF8800);
circle.graphics.drawCircle(xPos, yPos, radius);
var comp:UIComponent = new UIComponent();
comp.addChild(circle);
addChild(comp);
]]>
</mx:Script>
</mx:Application>