• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Hour 23. Learning How to Learn Flash > Task: Watch Your Movie with the Debugger

Task: Watch Your Movie with the Debugger

In this task, you'll use the Debugger to analyze a movie. Here are the steps to follow:

Open the file “paycheck_calculator.fla” that's located in the FLA folder inside the Samples folder which is adjacent to your installed version of Flash MX. Then select Control, Debug Movie (Ctrl+Shift+Enter). This is identical to Test Movie except that the Debugger window is visible and you must click the green Continue button on the right side of the of the Debugger.

This is just a sample of Flash's text entry abilities. They've purposely left out some of the functionality. See if you can figure out what's not working.

The “Married”/”Single” option is turned off. For the purpose of learning, let's consider this to be a bug and work towards resolving the problem.

The first thing I noticed was that there wasn't even an active button near the Married option. Return to the movie and try to fix that first. On stage you can double-click the instance of “radio button” (in the layer “text fields”). Once inside this clip you should see two frames. The Action on the first keyframe (stop()) means you won't see that frame initially. In frame 1 of the radio buttons symbol there are no buttons. However, if you go to frame 2 you can copy the invisible button that's on top of the “single” option. (The button shows up as a semi-transparent circle.) Click the keyframe in frame 1 of layer 1. Paste the button you just copied and move it up to cover the “married” option.

With the copied button still selected, open the Actions panel and take a look at the code. The idea in this unfinished clip is that when you pick an option (either “married” or “single”) the clip jumps to the other frame (1 when on 2 or 2 when on 1) and sets the “maritalstatus” variable to true or false. Because this code is also on the copy (in frame 2) we need to change the first line to read gotoAndPlay(2) and the second line to read _root.actions.maritalstatus=false as shown in Figure 23.11.

Figure 23.11. A copy of the “Single” button becomes a “Married” button when the script changes as shown here.

Debug the movie again (Ctrl+Shift+Enter) and click the green Continue button. See if it's fixed. The button changes visually, but otherwise, it's not fixed. (Try typing 12000 into the “Annual Salary” field and then toggle between single and married—when working, the “Paycheck” value changes.)

While you're still debugging, click “_level0” in the hierarchy of objects. Then, click the Variables tab. You should see all the important variables the programmer is using listed in the bottom left pane (as in Figure 23.12).

Figure 23.12. While debugging, you can view all the variables stored in the main timeline.

Most interestingly, there's one called maritalstatus (move the vertical divider if necessary to read “maritalstatus”). Notice that when you click the toggle button (on stage) this variable does not change, although you might expect it to. Let's go back to the code and set a breakpoint to see if we can narrow down the problem.

Return to the source file and get to the code on the “Married” button (in frame 1 of the radio button symbol, single click the invisible button and open the Actions panel). Finally, select the line _root.actions.maritalstatus=true and then select Set Breakpoint from the Debug Options menu and you'll see a little dot in front of the line of code (as shown in Figure 23.13).

Figure 23.13. Insert a Breakpoint for this line of code to force it to pause the Debugger.

Finally, debug the movie again (and press Continue). This time, before you click Married make sure you have selected _level0. Now, click Married, and notice the Debugger pauses and displays a little yellow arrow that points to the line of code (with the breakpoint). That line is about to execute, but Flash has paused to let you have the choice to “Step In” (that is, execute and pause at the next line of code), “Step Over” (to skip it entirely and it won't execute), or “Step Out” (which doesn't really apply as this lets you out of a function previously stepped into). Anyway, click Step In button and just that line of code will execute (then the Debugger pauses on a stop()). At this point we know that line of code is not working. (One theory might have been that that line of code was working, but another one was resetting maritalstatus back to false.)

Knowing the exact line where the problem is you can now concentrate on fixing it. When you selected _level0 (to reveal the variables including maritalstatus), that was effectively the same as _root. If you look at the line of code, however, it's setting _root.actions.maritalstatus to true. You just need to change the code to read: _root.maritalstatus=true (and on the button in frame 2—the Single option—change it to _root.maritalstatus=false).

Now you can test the movie and type 12000 into Annual Salary and then toggle between Married and Single to see the numbers change. I realize that I showed you the solution to this bug, but the main goal was to explore the Debugger. Remember, the Debugger doesn't remove the bugs, it just helps you find them.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint