[FlexJS] How to make the drawing APIs work from MXML

[OmPrakash Muppirala]

I am quite satisfied with the way the drawing APIs are shaping up.  Before
I continue adding more APIs, I would like to make them work from MXML so
that I can start importing some real graphics (exported from Adobe
Illustrator) and see it render in Flash and HTML5.

Here is a basic requirement:

When I write:

    <svg:Rect id="myRect" width="300" height="300" x="10" y="10">
        <svg:fill>
            <basic:SolidColor color="#FF0000" />
        </svg:fill>
    </svg:Rect>

It must get converted into this code:

var myRect:Rect = new Rect();
myRect.fill = new SolidColor();
myRect.fill.color = 0xFF0000;
myRect.drawRect(10,10,300,300);

How would I go about doing this?

I am guessing I need to make changes to my API to make it work from MXML,
obviously which I am willing to do.

Thanks,
Om