link to Canfield Studios

Flash 5 Example Files

The links here are for browsers that have the Flash 5 plug-in (Netscape/Opera) or activeX control (Internet Explorer) already installed and working properly. For ease of editing and to keep files as simple and small as possible, none of these samples includes browser- or plug-in/activex-control detection — so if you don’t have it, you’ll get a big fat nothing.

Still threatening (albeit faintly) to impose some sort of visual continuity on the various sample files available here. These are items created, on the fly, while visiting various newsgroups and message forums, in an attempt to answer user questions by demonstration.

Most of the samples include links to download the source FLA files in Zipped (PKZip) format. Some of them, however, contain fonts that may not be on the receiving system, in which case, they may look significantly different.

You are welcome to download the sample files to dissect them and learn from them, but please be sensible and ethical and DON’T post them on YOUR website as your own work.

These samples are provided as is. They contain precious little text, as yet, explaining anything about what’s going on, but I figure since the FLA is available, you’ll probably be able to figure it out. I make no warranty as to the servicability of these files for any particular purpose, and will not be responsible for any damages resulting from showing these to your friends. They will not make your car run faster, or get you the guy/gal of your dreams, and you’ll still have to brush your teeth, and don’t put that in your mouth; you don’t know where it’s been.

Here is a link to the most current list of web sites devoted to Macromedia Flash and Flash developers, which you may find useful in your pursuit of Flash Perfection (you are in pursuit of perfection, aren’t you?).


Animated Pie Chart
This demonstrates how to use a pair of mask/masked layers to create a clock-like object that can be filled gradually in the manner of a pie chart.

Array-Based Quiz (Multiple Choice)
This example uses a movie clip to load data in the form of a delimited string, which is then split to a two-dimensional array. This quiz provides and option for sequential display of questions (in the order they appear in the data file) or random presentation. It also provides an option (via a value in the data file) that will randomize none, all, or the first N number of the multiple choice answers. This makes it possible to leave the last answer as the last answer (i.e., "All of the above"). There is an option to display the answer to a particular question immediately after the user has answered, as well. User may continue by hitting the Enter key or clicking on the continue button. The user's response to each question is stored in the array, as well, and score is tabulated at the end.

Button Fade
Fades-in external movie clip on rollover of button. Fades-out clip on rollout. Makes clip disappear on click and resets previously clicked button.

Button of Glass
This example shows application of highlights and shadows using vector shapes to simulate specular reflections common to glass objects.

Button — 3-Way
This example shows a method, though certainly not the only method, of creating a button that can detect a click, a double-click, or a click-and-hold.

Button Scaling of Clip
This example has a clip that is controlled by the rollOver and rollOut states of a button. On rollOver, the clip begins shrinking to a minimum size specified in the clip’s onClipEvent(load). Once it reaches the minimum size, it stops. On rollOut, whether the clip has stopped or not, it begins returning to 100 percent size.

Button States (2 Buttons)
This example demonstrates one method of deactivating a button (physically unclickable), with a corresponding visual cue to the user.

Button States (5 Buttons)
This example is similar to the one above, but keeps track of which button of 5 buttons was last deactivated and reactivates it prior to deactivating the one being clicked.

Channel Knob
This example shows a TV channel changing knob whose direction of rotation is controlled by clicking (and holding) on the left or right side of the knob. As the knob turns, the channels fade in and out.

Checkbox Grocery List
This example uses a set of nested movie clips, an array, and duplicateMovieClip() to generate a list of checkbox items. The check is a movie clip, itself, which is toggled on and off with the visibility property, whose status is also used as the flag indicating whether the particular item is checked.

Clip Event Scaling
This sample contains a movie clip that constantly scales between an upper and a lower scale limit, all controlled with an onClipEvent.

Clip Event Motion
This example demonstrates how to move a clip back and forth from a minimum and maximum set of coordinates, all under the control of an onClipEvent. The clip also contains a button with a rollover action that stops the clip from moving, and, on rollout, allows it to continue in the direction it was going when stopped.

Clip Rotation, Button Controlled
This sample uses a button controlled onClipEvent. If there is a rollover, the clip launches. While it is moving forward, it is uninterruptible, but it will remember a subsequent rollout, and if it has received one by the time it reaches the end of the clip’s timeline, it will reverse direction, otherwise, it will stop on the last frame and wait. Upon receiving a rollout, it will reverse direction and play back to the beginning, but while in backward motion, it is interruptible by another rollover, at which time it reverses direction again, and goes forward (and is again uninterruptible). Whew!

Control Multiple Clips with Multiple Buttons
I know — that’s kind of a stupid title, but I couldn’t think of anything better. This example shows how to use a single movie clip that determines internal actions based on a number appended to its own instance name.

Currency Formatting
This sample includes a function that receives parameters for value, number of decimal places, and the character to use as a separator in the great-than-zero part of the number, for instance, commas in “1,000,000.00”. If no separator character is specified (comma is default), none will be used. If no places are specified, or places is specifed as zero, the number will be a rounded integer. This example uses input textfields for allowing the user to specify the values, but the function has also been built to accept actual numeric values, and includes error trapping. Function includes verbose commenting.

Currency Rounding
This sample shows how to always display currency values with two digits past the decimal. This can be modified to show however many decimal places you choose.

Dashed Line Animation
Somehow, the description of this example disappeared -- I'll have to see if I can dig it up (2002/09/09).

Disco Grid
This just a set of movie clips comprising floor tiles on a faux dance floor, circa 1975, where each tile turns on and off for random durations and when on, with a random choice from a set of colors (stored in an array).

Emboss Text — without Breaking Apart
This example shows a “poor man’s” method of creating embossed text (best if limited to 1 pixel or less thickness), without having to break apart the text, such that the text remains editable. This one is with static text, but it could be done with dynamic text as well, as long as the fonts are embedded.

Fading Clip with Buttons
This example consists of three buttons, each in a movie clip, and one other clip. One button changes the fading direction, even if the clip is in the process of fading already, and if it is not, after changing the fade direction, launches the fading. The other button simply halts fading, or restarts it, if it’s stopped. If it is stopped at either extend of the fading range, it also changes the direction before launching the fading. The third button toggles continuous play of the fading. All three buttons contain a text field, whose contents are toggled by an onClipEvent applied to each button’s container clip.

Fade Picture Sequence
This example uses a controller clip on a sequence of pictures (here, just numbered rectangles) to fade in over a specific duration, display for a specific duration, and fade back out, then moving to the next picture and repeating the process, all by varying the display values in the controller clip — NO TWEENS. All fading and display is time based, so executes at the same speed on any machine. After the last picture displays, it wraps back around to the beginning of the sequence, and starts over.

Fade-in/Fade-out Pictures
This example displays five pictures. On the first click of a button, the corresponding picture fades in. On subsequent clicks, the last picture to fade in fades out while the picture corresponding to the latest button click fades in. The values for minimum and maximum alpha, applied after the first click, are stored in an array in the controller movie clip, which performs all the fading. While a fade is in progress, button clicks have no effect, and the button last clicked is disabled. The controller re-enables the previous button on the next button click.

Grid Image Fade-in/Fade-out
This example duplicates a movie clip containing a masked image clip in a grid matrix which is then faded in or faded out, one grid element at a time, with the process launched by a button click. The trigger for the fading can just as easily be put in any timeline, as opposed to the button.

Guidepath Duplication of Movie Clips
This example duplicates a movie clip, repositions it, and rotates it, to match the coordinates and rotation of an object that was previously motioned tweened on a guide path. The motion tweened clip stores its coordinates and rotation value in an array, which is then used during the duplication process to establish positioning and rotation of each duplicate. Since the coordinates and rotation are established with an onClipEvent applied to the tweened clip, this method supports any easing that may be applied to the motion tween, as well.

Interactive Motion: Buttons or Cursor
This example toggles between two different modes of applying motion to an object -- one with directional control buttons, and the other, with the cursor, including acceleration/deceleration depending on distance between cursor and object.

Lines & Points on a Circle
Based on user input, triggered by button, calls function to duplicate points on a circle, and then connect them with duplicated movie clips of line.

Magnifying Lens
What the title says. Magnifying lens is draggable with slider or button control for power of magnification.

Masked & Motion-Guided Movie Clip
This is an example of how to nest movie clips so that a movie clip with a motion-guide can also be masked.

Mouse Alpha — Mouse Position Controlling Alpha Property
This example uses the user positionable boundaries and the mouse position to change the alpha property of a movie clip, as the cursor moves from side to side.






Multiple Event Interations
(Description to come...maybe...if I ever get around to it.)

Nested Loop Matrix Construction
This example shows how to use a pair of nested loops to build a matrix of duplicated movie clips and position them in grid formation.

Nested Loop Diagonal Matrix Construction
This example shows how to use a pair of nested loops to build a matrix of duplicated movie clips and position them in grid formation, with the sequential numbering on a diagonal.

Outline Text — without Breaking Apart
This example shows a method of creating quasi-outline text (best if limited to 1 pixel or less thickness), without having to break apart the text, such that the text remains editable. This one is with static text, but it could be done with dynamic text as well, as long as the fonts are embedded.

Paving the Plane
This example shows how to use a nested loop to cover a given area of a scalable area with multiple duplicates of a scalable object (simultaneously applying random colors).

Pause/Play Button — Multiple targets
Demonstrates using a pause/play button toggle to control multiple movie clips.

Pause/Play Button (Toggle)
This demonstrates a couple a button toggling a boolean value in a variable inside a movie clip. The movie clip controls it’s own motion with an onClipEvent constantly monitoring the state of that Boolean variable.

Perimeter Duplication — Duplicating movie clips around a perimeter
Establish size and position of rectangle via a movie clip onClipEvent, and then populate the perimeter with duplicated movie clips, quantity based on dimensions of perimeter, size of movie clip, and specific gutter.

Play to Label
Demonstrates how to use a button to play from the current position to a specific frame label name and stop on that frame.

Position Swap
Demonstrates how to use a button to cause to movie clips to switch positions, each gradually moving to the other’s position on the button press.

Radio Button Poll
This example uses a set of nested movie clips, an array, and duplicateMovieClip() to generate a list of radio button items. The dot inside the radio button is a movie clip, itself, which is toggled on by clicking the radio button, and toggled off by clicking another radio button, with the visibility property, whose status is also used as the flag indicating which item is on. Alternately, the nDotCurr value, in the main timeline, can be used to determine which radio button is on. Each click of a radio button turns off the last clicked radio button, and performs NO action if the dot is currently visible.

Random Duplication — And Everything Else
This example duplicates an arrow movie clip, placing it in a random location, randomly scaling it, with a delay between each duplication. In addtional, the arrow clip performs its own fading in and out, starting at zero, and then fading between two random values until a random number of iterations have been performed, at which time, it fades back to zero and removes itself.

Random Clip Motion with Reentry
This example has a clip on stage that changes directly, randomly, and moves across the stage and different rates of speed. As it touches a boundary, it is duplicated such that it appears to re-enter the stage on the exact opposite side from the boundary that was just reached.

Random Lines
Lines radiating from the a point on the stage, with only the end points moving to new locations -- all time-based motion -- randomized items include: coordinates, travel time, and wait time (also color of end point clips).

Random Movie w/ Button
This movie loads 10 movies into levels 1 through 10, and then provides a button which runs a random selection. Runs all 10 movies with no repeats. (Remake of version on Flash 4 samples page.)

Random Tiling of a Matrix
This example shows how to randomly place non-overlapping rectangular tiles to cover a rectangular area.

Reverse/Forward Timeline Control
This example has a control panel with a Pause/Play button (last direction of play, if paused, is remembered and reinstituted when played), a Reverse/Forward button (to change direction with a single button), a Continuous/One-Time button (to select whether the timeline should loop continuously, in whichever direction it is going), a Back button and a Forward button (both simultaneously select direction and play the timeline, if stopped), and a Rewind button and a Fast Forward button (to go to the apparent ends of the timeline and stop).

Rotating Dial
Controlling the rotation of a movie clip with buttons, rotating in distinct degree divisions, but smoothly, and with self-contained labels that remain upright (counter-rotation).

Rotation Control
Controlling the rotation of an antenna-like movie clip with buttons, rotating in distinct degree divisions, but smoothly. Will not rotate a full circle, but is limited to a 330-degree rotation (changeable). Direction does not change unless antenna comes to a complete stop first, or if a button is clicked that is out of range of the current rotation direction, it rotates all the way to the “stop”, reverses direction, and rotates to the selected position.

Rotation with Arrow Keys
Controlling the rotation multiple objects using the arrow keys, but with button selection of the object to be rotated (after selecting an object, press left or right arrow key).

Selection Toggle — On RollOver
This example builds a matrix of buttons, embedded in movie clips, using a nested set of for loops. Each button's rollover event will either add that clip’s identifying number to an array or remove it from the array, and display the total items selected, as well as which items are selected. Each clip keeps track of its own index in that array, so that it can perform the removal.

Sine Wave
This example builds dynamic sine wave, duplicating a master clip, placing the duplicates, end to end, and then moving them behind a rectangular mask to give the appearence of endless motion. A button changes the direction of the motion on press, and on rollover and rollout, triggers change in the amplitude of the wave form.

Spreadsheet Simulation
This is an example of parsing loaded data to a 2-dimensional array, and then, from all those elements, constructing a simulation of a rudimentary spreadsheet.

String Build
Hmmm. Hard to describe. Displayed (in a textfield) variable is initialized with alternative 1s and 0s (ones and zeros), length determined by a user-defined string of actual text. Textfield begins at user specified alpha and fades into view, all the while, randomly changing 0s to 1s, and vice versa, until a user-specified time is reached, at which point, characters from the string are randomly inserted in their appropriate character positions, at intervals determined by string length and time remaining before target completion time. Thereafter, only the 1s and 0s still remaining are randomly changed to the opposite. Eventually, all the 1s and 0s are replaced with the characters from the string, at which time the string is complete, though it may continue to fade-in, depending on user settings.

Time Delay
This example uses an attached movie clip to cause a delay in a given timeline. There is a clock that can be made visible to show elapsed time, based on a boolean flag (variable) set in the _root.

Time Elapsed — Simple Textfield Elapsed Time Indicator
This example accesses the Flash player’s built-in clock and simply presents elapsed time in digital form in a textfield (converting hours, minutes, seconds, and hundredths of seconds to strings of two digits).

Time Lap
This example accesses the Flash player’s built-in clock and presents elapsed time both digitally (converting hours, minutes, seconds, and hundredths of seconds to strings of two digits), as well as with a clock face with rotating hands for each increment type.

Tween Control
This example uses buttons to control movie clips that contain motion tweens. The one on the left will loop as long as the cursor is over the button. The middle on will loop once (play twice) on each rollOver). The third plays only once on each rollOver. In all three, however, the tween will always play to its conclusion before stopping.