Comparison of basic geometry shapes in Actionscript and with Degrafa

Degrafa is a declarative graphics framework for Flex. Using Degrafa you can create some simple or complex graphic elements. In this cookbook example you can see how can you create three simple shapes using ActionScript or how to create some basic elements using Degrafa. In order to use this example you have to download Degrafa library.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:degrafa="http://www.degrafa.com/2007"
    layout="absolute" applicationComplete="makeAS()"
    backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#6FAFFF, #6FAFFF]">
<mx:Script>
    <![CDATA[
        import mx.utils.SHA256;
        import com.degrafa.geometry.Circle;
        import mx.utils.ColorUtil;
        import mx.controls.ColorPicker;
        private function makeAS():void
        {
            var roundObject:Shape = new Shape();
            var square:Shape = new Shape();
            var circle:Shape = new Shape();
                       
            // pravokutnik
            square.graphics.beginFill(0xFF0000, 0.5);
            square.graphics.drawRect(10, 10, 100, 100);
            square.graphics.endFill();

            // krug
            circle.graphics.beginFill(0x0000FF, 1);
            circle.graphics.drawCircle(170, 60, 50);
            circle.graphics.endFill();
           
            // zaobljeni pravokutnik
            roundObject.graphics.beginFill(0x00FF00);
            roundObject.graphics.moveTo(280, 10);
            roundObject.graphics.curveTo(330, 10, 330, 60);
            roundObject.graphics.curveTo(330, 110, 280, 110);
            roundObject.graphics.curveTo(230, 110, 230, 60);
            roundObject.graphics.curveTo(230, 10, 280, 10);
            roundObject.graphics.endFill();
           
           
            canvasAS.rawChildren.addChild(square);
            canvasAS.rawChildren.addChild(circle);
            canvasAS.rawChildren.addChild(roundObject);
        }
    ]]>
</mx:Script>   
    <mx:Label x="219" y="10" text="Actionscript API vs Degrafa" textAlign="center" fontSize="22" fontWeight="bold" color="#FFFFFF" width="390"/>
    <mx:Label x="10" y="58" text="ActionScript Canvas" fontWeight="bold" color="#FFFFFF" fontSize="17" width="200"/>
    <mx:Canvas x="10" y="84" width="400" height="200" id="canvasAS" borderStyle="solid" borderColor="#FFFFFF" cornerRadius="6">
    </mx:Canvas>

    <mx:Label x="418" y="50" text="Degrafa Canvas" fontWeight="bold" color="#FFFFFF" fontSize="17" width="200" textAlign="left"/>
    <mx:Canvas x="418" y="84" width="400" height="200" id="canvasDegrafa" borderStyle="solid" borderColor="#FFFFFF" cornerRadius="6">
   
        <degrafa:Surface>
            <degrafa:fills>
                <degrafa:SolidFill color="#FF0000"
                            id="rectFill" alpha="0.5" />
                <degrafa:SolidFill color="#0000FF"
                            id="circleFill" alpha="1" />
                <degrafa:SolidFill color="#00FF00"
                            id="roundedFill" alpha="1" />
            </degrafa:fills>

            <degrafa:GeometryGroup>
                <degrafa:RegularRectangle x="10" y="10"
                    width="100" height="100" fill="{rectFill}"/>
                <degrafa:Circle centerX="170" centerY="60"
                    radius="50" fill="{circleFill}"  />
                <degrafa:RoundedRectangle x="230" y="10"
                    width="100" height="100" cornerRadius="43"
                    fill="{roundedFill}" />
            </degrafa:GeometryGroup>
        </degrafa:Surface>
   
    </mx:Canvas>
</mx:Application>