MACROMEDIA FLEX BUILDER-USING FLEX BUILDER Use Manual page 56

Assign the event handler to the thumbnail view button by clicking anywhere in the first
6.
tag in the flexstore.mxml file and setting the following property in the Events panel
<mx:Image>
of the Tag inspector:
mouseDown
When the user clicks the image, the
Assign the event handler to the grid view button by clicking anywhere in the second
7.
tag and setting the following property in the Events panel:
<mx:Image>
mouseDown
Save the flexstore.mxml file.
8.
Click the Run button on the Document toolbar to test the buttons in the embedded browser.
9.
You discover a bug. When you click the grid view button at the lower edge of the product
catalog, the application doesn't switch to the grid view. The view should change when you click
the button.
You decide to run the ActionScript debugger to locate and fix the problem.
Debug the view buttons
One of the catalog view buttons is broken: it won't display the catalog's grid view. You believe you
can find clues to the problem in the ActionScript file that contains the buttons' event handler.
You decide to run the ActionScript debugger to pinpoint the problem.
Make sure both the flexstore.mxml and flexstore_script.as files are open in Flex Builder.
1.
Switch to the flexstore_script.as file and review the event handler for the view buttons:
2.
function changeView(view) {
currentView=view;
if (view=="thumb") {
bodyStack.selectedChild=thumbView;
} else if (view=="grid") {
bodyStack.selectedChild=gridView;
}
}
The changeView function will select
function's
view
function.
Set a breakpoint on the following line by Control-clicking the line's gutter:
3.
currentView=view;
A breakpoint marker appears in the gutter. You set a breakpoint on this line because it
immediately follows the line that assigns a value to the
here, the
view
Switch to the flexstore.mxml file and click the Debug button on the Document toolbar.
4.
Flex Builder compiles the application and runs it in its embedded browser.
56 Chapter 2: Flex Builder Tutorials
: changeView('thumb')
: changeView('thumb')
argument. You decide to set a breakpoint to check the value passed to the
variable will have a value.
function is called.
changeView()
only if the string "grid" is passed to the
gridView
view
variable. When the debugger stops