Overview of the Debugger in Flash CS4

Using the Debugger Overview

Ok, this is not the sexiest Flash topic out there, but I've found very little on this topic when I did a search so I thought I'd make this contribution for the collective benefit of Flashinistas world-wide.

The Debugger in Flash CS4 is a window and set of related tools to help you “debug” or troubleshoot Actionscript code that is not executing properly. Typically to make full use of the Debugger you’ll need to set a breakpoint in your code that tells the Flash player to stop executing your Actionscript at the particular line in your code where the breakpoint is set. Think of it as a tool that allows you to freeze time, or at least the time during which your Actionscript code is executing.
Then using tools in the Debug Window you can very deliberately choose to execute the specific line of code in which the breakpoint is set and then observe what happens. This ability, to step through your code (among other related tools which will be described in greater detail below) line by line can be extremely useful when trying to find the fly in the ointment (or the bug in your code).

Try this simple example:

Create a new file.
Select the keyframe in frame one , open the Actions panel and add the three trace statements, one on each line:

trace(“first”);|
trace(“second ”);
trace(“third ”);

Add a breakpoint by only after before the first trace, clicking to the left of the number 1 (the line numbers that should automatically be generated as you write Actionscript code. A red circle indicating the break point should appear.

Select Debug Movie from the Debug menu to enter the debugging window.
You’ll notice a set of interrelated panels: in the upper left the Debug Console; lower left Variable Panel; The area at the top center display a line (or lines if more than one) where Actionscript was encountered in the file, below that the code for the currently selected frame or a selected external Actionscript file; and the Output panel at the bottom .
You will notice that the string “First” being evaluated from the first trace function has not yet appeared in the Output panel, the reason is the break point stopped the execution of the code just before that line was executed.

In the Debug Console panel in the upper left hand side click on the green “Continue” button which will execute all the code till another break point is encountered. . Note that the evaluation of the trace function now appears in the output panel and all three trace statements appear: “first”, “second”, “third”.

Close the Debug window by either clicking on the large red X in the Debug Console or clicking on the close button for the swf file that was generated when you first choose Debug movie.
Go back to the Flash file and execute Debug Movie again.
This time click on the Step Over button which will cause the debugger to jump to the next line of code and stop. Continue clicking on the Step Over button to step through your code line by line. If there were any variables and properties in your code you can seethem and check their values changing in the Variables panel in the lower left corner.

Note the other two buttons:
Step In will jump to any function or method reference on the current breakpoint line and then step through the code of that function or method a line at a time.
Step Out moves the debugger to the exit point of the current function or method, typically to where the function or method returns a value (if it returns a value.

Mastering the debugger just takes a little knowledge and a bit of practice, and it's on the ACE test!

SmartSketch Lives! (Inside of Flash)

A long time ago (1993) , in a place far, far away (San Diego, California) there lived a small company called FutureWave Software. They produced a software program named SmartSketch a vector-based drawing program and at one time the number one drawing program on the Macintosh in Japan.

SmartSketch had all kinds of "friendly" features, very different from the dominant drawing program of the day, Adobe Illustrator.

In 1995 they decided to add animation to vector drawing and released FutureSplash Animator, a program for creating animations on the web. Soon after, Macromedia acquired FutureWave and in a victory for the Society of Short Syllabic Words changed the name to Flash.

Macromedia however didn't release SmartSketch under the Macromedia banner, they had already acquired Freehand, another vector-based drawing program which competed with Illustrator and saw no need to muddy the market further... but don't despair, SmartSketch still lives!

Even though Macromedia, and now Adobe, have tweaked it, the guts of the drawing program in Flash today is still essentially SmartSketch. If you've used the drawing program in Flash you know what I mean: the" intelligence" behind the pencil tool options: "straighten", "smooth" and "ink"; the "knocking out" and joining together of graphics, the "natural drawing" tools, that's all from SmartSketch now playing nicely and in the same family as the program it once tried to rebel against, Illustrator.

People coming to Flash with no Illustrator experience enjoy working with it once they get the hang of it; Illustrator users may complain a bit, but additions to the Flash drawing program, the Pen tool, for instance, make Illustrator user's feel a bit more at home, still it's different enough to be a bit of a pain for hard core Illustrator power users and certainly it's not as powerful.

Illustrator user may want to skip it: these days with better integration between Flash CS3 and Illustrator CS3, there's less need to use the drawing program in Flash, just create in Illustrator and import into Flash.

More on that some other time.

If you're not an Illustrator aficionado yet you may just want to stick with SmartSketch, otherwise known as the drawing program inside of Flash.