SWF File article

5. January 2012

Excellent article describing SWF files…

Anatomy of a SWF File

Flash ,

LED Displays in Flash

5. January 2012

Developed a SWF using AS3 which provides displays for the following (Wiki links give better explanations of each display than I could provide).

1. 7 Segment LED

 

2. Dot Matrix Display

 

3. Digital LED Clock


The same SWF provides each of the displays.   A unique XML file is loaded for each instance of the SWF which contains the settings for the display.

How to do this:

1. Add the following to the html for flash object:

<param name=FlashVars value="xmlFileName=Clock.xml">

The FlashVars parameters are parameters you can name and set values for in the webpage that are passed to the SWF on initial load.   Excellent for configuring the SWF.  In this case, only one FlashVar parameter is set (name=xmlFileName, value=”Clock.xml”).

2. In your main file of the AS3 project, add the code to unpack the FlashVar parameter:

var flashVars:Object = LoaderInfo(this.loaderInfo).parameters;  // this get the FlashVar collection

var xmlFilePath:String = flashVars.xmlFileName;

Note: this gets a little tricky when you’re working in Flash CS4 since the FlashVars are not setup.  Either comment out or check to see whether the FlashVars are valid.

3. Now load in the XML file and get the configuration parameters:

var loader = new URLLoader(new URLRequest(xmlFilePath));

loader.addEventListener(Event.COMPLETE, XMLFileLoadedHandler);

private function XMLFileLoadedHandler(e:Event):void
{

_xml = XML (e.target.data);

}


Flash ,

Weather Radar Display

4. July 2011

Fun little project to add a FREE (really FREE) weather radar display to your website.

Did the radar display in Flash CS4 to animate the radar beam (from sample).

Added St. Louis weather image from NOAA (www.noaa.gov) to background layer in Flash. 

Update radar beam position programmatically on Enter Frame handler (30 times per second).

Going to hook up the buttons for display options when I get a chance.

  Weather Radar Display done in Flash
 

More background on how to get the radar images from NOAA:
Different overlays for the features (topography, cities, rivers, etc.) which you want to display.
Here’s a simple html page showing how to display Dallas Fort Worth weather:
<html>
<head>
</head>
<body>
<br />
DFW Radar Image overlayed over topography
<br />
<img style="position:absolute;x:100px;y:100px;" src="http://radar.weather.gov/ridge/Overlays/Topo/Short/FWS_Topo_Short.jpg">
<img style="position:absolute;x:100px;y:100px;" src="http://radar.weather.gov/ridge/RadarImg/N0R/FWS_N0R_0.gif">
<br />
</body>
</html>

John Dorsey

IT Brigade Inc.
www.itbrigadeinc.com
jdorsey@itbrigadeinc.com

Flash , , ,

Fine Art

20. May 2011

This was created via Flash software.  Enjoy!

Flash

Text writing itself in Flash

8. March 2011

This is an example of text writing itself using Flash CS4.  Very easy to do with Frame-based approach:

1. Create a layer with text (I used static light blue text here on a white background).

2. Add a mask layer above that.

3. Put solid rectangle on mask layer with its height greater than the height of the letters.

4. On frame 1, have make the rectangle width very small and position to the far left so that it doesn’t cover any letters.

5. Add a keyframe on frame n and increase the rectangle width to cover the letters on this frame.

6. Add a shape tween between the two frames.

You’re done…

Flash

External SWF Preloader

8. February 2011

Snake Flash Game

5. February 2011

 

This game was originally developed in AS2.  I converted to AS3 in Flash CS4.

Conversion details:

  1. Changed to MovieClip class from Action
  2. Used an Array for the snake body instead of eval
  3. Added KeyboardEvents and stored the current key state in an Array
  4. As frame is processed (in Event.ENTER_FRAME) look up current key state to find direction
  5. Use hitTestObject() to determine if snake's head is touching mouse

Flash , , , ,

as3 drawRect Memory Leak!

11. January 2011

Found an interesting issue with flash.display.graphics.  When doing a lot of drawing with drawRect(), program was consuming more and more memory to the point where it rapidly crashed.  I was using large bitmaps, so I thought they might be the cause of the issue.   I set up the program to use the same bitmap over and over again and so eliminated that as the issue.  I finally tracked it down to the drawRect() call which was very confusing since a draw routine does not normally consume memory.

This was my original function:

        public function Draw( backColor:int, hit:Boolean)
        {
            backColor = ( hit ) ? backColor: 0x000000;
            _shape.graphics.beginFill(backColor);
            _shape.graphics.lineStyle(1, 0x000000, 1);
            _shape.graphics.drawRect( _x, _y, _size, _size);
            _shape.graphics.endFill();
        }

I researched this on the web and found a person who had run across the same issue and had solved it: Flash AS3: graphics.drawRect Memory Leak

Trick is to clear the graphics before using it each time as shown below!

Solution:

        public function Draw( backColor:int, hit:Boolean)
        {
            backColor = ( hit ) ? backColor: 0x000000;
            // need clear graphics or consume huge amounts of memory otherwise
            _shape.graphics.clear();
            _shape.graphics.beginFill(backColor);
            _shape.graphics.lineStyle(1, 0x000000, 1);
            _shape.graphics.drawRect( _x, _y, _size, _size);
            _shape.graphics.endFill();
        }

 

Bottom line is that flash graphics are vector graphics and apparently uses a new shape for each draw routine.

 

Note: this is technically not a memory leak…

Flash ,

Setting up as3 source files in Flash project

21. July 2010

I have problems with this every time I start a new Flash CS4 project.  Not intuitive.  Keep getting the ActionScript Error #5001 where the class name in the .as file conflicts with the project settings.

 

Here are settings that worked: 

 

1. New .fla file in C:\flash\test\Project1 named Project1.fla.

2. New .as file in C:\flash\test\Project1\SourceFiles named Driver.as.

3. In Project1.fla flash settings: put the Document class as SourceFiles.Driver.

4. In Project1.fla flash settings: put the Source path as C:\flash\test\Project1 – points to .fla directory, not the code directory.

5. In Driver.as the package name is SourceFiles and the class is named Driver:

package SourceFiles

{

     import flash.display.MovieClip;

     import flash.display.Stage;

     public class Driver extends MovieClip

     {

          public function Driver()

          {

          }

     }

}

John Dorsey

IT Brigade Inc.

www.itbrigadeinc.com

Flash , ,

Interesting articles relating Flash AS3 and C++

11. April 2010