My last few posts on the Flash/Flex/ActionScript drawing API gave me a few ideas... Everyone always says how it reminds them of old-school programming in BASIC or Pascal. I decided to make it easier for anyone to play with the drawing API, without having to compile any programs for themselves. I call this the "Drawing API Explorer". Using the drawing API explorer application, you don't have to override updateDisplayList or anything. All of the hard work is done.

This example uses runtime code evaluation to draw shapes using the ActionScript drawing API. Check it out below!

There are two tabs. The first tab allows you to type in code that will be executed when you click on the "run" button. The second tab shows you a bunch of ActionScript drawing API examples. Just click on an example name in the left, and the code will be displayed. You can run the examples by clicking on the "run this example" button, or you can edit the example code by clicking on the "edit this example" button. When you click on the "edit" button, it will switch over to the first tab and paste the code into there.... Be careful! It will clear whatever was in there previously.

You can use any kind of loops, if-statements, switch statements, etc... It supports all methods of the Graphics, Math, and Matrix ActionScript classes. You can use the variable g to represent the graphics object, the variable w to represent the draw target area width, and the variable h to represent draw target area height. I have tried the following, and know they work:

• g.lineStyle
• g.beginFill
• g.endFill
• g.moveTo
• g.lineTo
• g.curveTo
• g.drawRect
• g.drawRoundRect
• g.drawCircle

See the ActionScript drawing API documentation for more information about the drawing API syntax and capabilities.

Go ahead and test it out here:

The runtime code evaluation uses the D.eval() code library. The D.eval() API is a SWC library for Flex applications that enables the runtime generation and execution of code and expressions in ActionScript 3.

You can launch this application in a new window here:
http://www.tricedesigns.com/portfolio/DrawingAPIExplorer/DrawingAPIExplorer.html

View the source code here:
http://www.tricedesigns.com/portfolio/DrawingAPIExplorer/srcview/index.html

Or, download the source code here:
http://www.tricedesigns.com/portfolio/DrawingAPIExplorer/srcview/DrawingAPIExplorer.zip

Read more from Andrew Trice.