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

Hour 23. Learning How to Learn Flash > Task: Learn from a Complex Sample File

Task: Learn from a Complex Sample File

In this task you extract a portion of code from someone else's sample file. Here are the steps to follow:

Adjacent to your installed version of Flash MX you should find a folder called “Samples”. Inside it is a folder called “fla” inside which you should open the file “maze.fla”. Test the movie to see how it runs. Notice the user can use their keyboard arrow keys to move the white box (at the top of the screen). We'll extract the code to do just that part.

Return to the source file. There are several ways to dig through the file to find the code; we'll use the Movie Explorer to help us. (Select Window, Movie Explorer.) The Movie Explorer panel gives you a view of the entire file. You can see the fonts used, every instance, all the Actions, and many more details (see Figure 23.1).

Figure 23.1. The Movie Explorer panel provides a hierarchical list of everything in a movie.

From the filtering buttons (the row of buttons next to “Show:”), select to show only Action Scripts by deselecting all the buttons except the one for Actions (as shown in Figure 23.2).

Figure 23.2. While viewing only ActionScript statements, you can go through each action until you find one with a lot of code.

Now you can try to find the bulk of the code in this file. Click the plus sign next to Scene 1 (which shows or hides the Actions for Scene 1). You want to see everything. Within Scene 1, step through each Action taking a peek inside each one. All you need to do is click the plus to expand an Action and then close it (if there's not much code) and continue to the next item. In this scene you'll find the first three (“actions for frame 1”, “actions for frame 2”, and “actions for frame 3”) only have one or two lines of code. However, when you get to “actions for maze” you'll see a ton of code. Open the Actions panel and single click on the little arrow next to “actions for maze”. Not only will you see the code in the Movie Explorer but the Actions panel displays the same code where it will be possible for you to copy it (as in Figure 23.3).

Figure 23.3. By clicking in the Movie Explorer we can make the script appear in the Actions panel.

Without explaining all the code, it basically does two things—moves the square in the direction of the user's arrow keys and prevents the square from passing through a wall. Also, it only does this once the game has started. Anyway, the programmer commented this code very nicely making it easier to figure out how it works. You can extract just the part that moves the square. In the Actions panel, select the line that starts “// keyboard controls” and then hold Shift and click the line right before the line that reads “// detect if…”. Copy it. Now before we go to an new file, notice all the code appears within the clip event enterFrame.

Start a new file, draw a box, and convert it to Movie Clip. With the clip instance selected, open the Actions panel and ensure it's in Normal Mode (from the options menu) and then paste. Notice your script is automatically surrounded by the clip event load (onClipEvent(load)). Select the first line and change the event to enterFrame (as was the case in the maze.fla). The result should look like Figure 23.4.

Figure 23.4. The modified script (extracted from another movie and attached to a clip instance) will make our movie work.

Test your movie. The box should move in four different directions depending on which arrow keys you press. Actually, you can hold two arrow keys to make the box move diagonally.



Not a subscriber?

Start A Free Trial

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