home page icon Flash Bestiary / Oddments / American Flag

American Flag

The American flag shown here was generated completely algorithmically using the dynamic drawing routines. As a result, the movie is very small - only about 1k!

The flag is divided up into narrow vertical strips using masks. Then the strips are rotated slightly using sin waves. This produces apparent motion in both the x and y directions.

The motion propagates from the left edge of the flag to the right edge, producing the effect that the wind is blowing from the left.

The function that animates the flag reads as follows:

function myWaveFlag(evt)
  for (var i = kNbrStrips-1; i>0; --i) {
    flags[i].rotation = flags[i-1].rotation;
  var t = getTimer();
  flags[0].rotation = Math.sin(t*.001+Math.cos(t*.0005)*Math.PI*2)*2;

The next movie in this sequence shows how to apply this effect to a photographic image.

UPDATE: The source code below now contains an Actionscript 3 version, and a Flash 8 (bitmapped) version, in addition to the original Flash MX code.


sourcecode iconDownload the flash project
book iconJim's Favorite Actionscript Books
wiki iconAsk Jim about Actionscript
Next: Waving Image

Having trouble opening the project? You may need to Upgrade to Flash CS3

Copyright © 2003,2008 by Jim Bumgardner. All Rights Reserved.        Leave Jim some feedback