Question

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="640" minHeight="480">
    <s:layout>
        <s:BasicLayout/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import flash.display.Shape;
            import flash.display.Sprite;

            import mx.core.UIComponent;

            import spark.core.SpriteVisualElement;
            private var rectangle:Sprite = new Sprite();
            private var insterter:UIComponent = new UIComponent();
            private var theme:SpriteVisualElement = new SpriteVisualElement();
            private function main():void
            {

                rectangle.graphics.lineStyle(1,0x0000FF,1.0);
                rectangle.graphics.drawRect(0,0,200,50);
                theme.addChild(rectangle);
                this.addElement(theme);  //tried canvas.addElement
                const WIDTH:int = 20;
                const HEIGHT:int = 20;

                /*var grid:Array = new Array();
                for(var y:int = 0; y < HEIGHT; y++) {
                    var row:Array = new Array();
                    for (var x:int = 0; x < WIDTH; x++) {
                        row.push(/*random object*//*);
                    }
                /   grid.push(row);
                            }*/

            }

        ]]>
    </fx:Script>
    <!--<spark:Canvas id="canvas" x="34" y="10" width="90%" height="90%" textAlign="center">

    </mx:Canvas>-->
</s:Application>

Basically this is not working. I used this question to improve – still nothing.
Why doesnt this Flex App draw a simple rectangle?

Answer 1

Why don’t you just use UIComponent.graphics drawing abilities, instead of creating three different objects ?

var uic:UIComponent = new UIComponent();

this.addElement(uic);

uic.width = uic.height = 50;
uic.graphics.lineStyle(1,0x000000);
uic.graphics.drawRect(0,0,50,50);