Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > Adobe Flash

Using SmartClips

  • Print
  • + Share This
  • 💬 Discuss
From the author of
Flash 5 provides a way to preserve the complex programming that you do with ActionScript in reusable, customizable movie clips. This special form of movie clip is called a SmartClip. Here author Katherine Ulrich shows you the basics.

ActionScripting is complex and labor-intensive. Flash 5 provides a way to preserve the complex programming that you do with ActionScript in reusable, customizable movie clips. This special form of movie clip is called a SmartClip.

The task of defining a SmartClip's capabilities is beyond the scope of this book. But Flash provides three SmartClip objects in its SmartClips common library that you can play with to get the idea: a checkbox, a radio button, and a drop-down menu. You customize the SmartClip's features-the text label for each menu choice, for example-via the Clip Parameters panel.

To access the Clip Parameters panel:

  • If the panel is not currently open, from the Window menu, choose Panels > Clip Parameters.

To customize an instance of the menu SmartClip:

  1. Open a Flash document to which you want to add a menu.

  2. From the Window menu, choose Common Libraries > SmartClips.

  3. The Smart Clips Library opens.

  4. Drag an instance of the movie clip named Menu to the Stage in Keyframe 1.

  5. Notice that the SmartClip's icon is slightly different than that of a regular movie-clip symbol.

  6. With the SmartClip instance selected on the Stage, access the Clip Parameters panel. The customizable features of the menu appear in the panel (Figure 1).

  7. Figure 1

    The Clip Parameters panel shows the customizable features of a SmartClip selected on the Stage. For the Menu SmartClip double-click the word (Array[]) to open a window containing a list of values for the menu items.

  8. In the first line of parameters, under the heading Value, double-click the word (Array[]).

  9. The Values window opens (Figure 2). The values listed are the default names of the various menu choices. You can edit them to create menu lists with your own choices.

    Figure 2

    In SmartClips, values are elements that you can customize. Each defaultValue line in this Values window represents a menu item.

  10. To edit the name of the first value, double-click the name defaultValue1 and enter new text (Figure 3).

  11. Figure 3

    Double-click a value to edit it, and give it a new label. To add menu items, click the Add (+) button; to remove menu items, click the Remove (-) button. Use the up and down triangles to change a selected menu item's place in the list.

  12. Repeat the preceding step for as many menu items as you want to create. For this exercise create three menu items: Glinka, Borodin, and Shostakovich.

  13. Click OK.

  14. Flash sets the parameters, but the menu-clip instance on the Stage looks the same as it did before.

  15. To view your new menu, choose Control > Test movie.

  16. The menu items you created appear in a drop-down menu. On the Mac, when you open the menu, a check appears next to the currently selected item.

At this point, of course, your menu doesn't actually do anything. To make a working menu, you must assign actions to it. A good SmartClip developer will add comments that appear in the Clip Parameters panel to guide users in using the SmartClip.

To assign actions to a menu SmartClip:

  1. Open the file you created in the preceding exercise.

  2. In Frame 1, on the Stage, select the menu SmartClip.

  3. Access the Clip Parameters panel, and resize the window to view the notes in the Description window (Figure 4). Creators of SmartClips should include instructions about how to work with the SmartClip.

  4. The menu SmartClip requires you to activate the menu with a movie-clip handler and then create a special function to read the menu choices.

    Figure 4

    This cryptic description tells you to activate the menu with a clip handler. The first action within the handler must be a function that checks to see what menu item your viewer selects. After that, you can add actions to do whatever you want.

  5. To add a clip handler and start setting up the function, in the Object Actions panel, from the Add Statement menu, choose Actions > function.

  6. Flash updates the Actions list to look like Figure 5.

    Figure 5

    To create the onMenu function that allows the menu SmartClip to work, in the Actions List, add function (top). Enter the name and parameters outlined in the SmartClip's description (bottom).

  7. To name your function, with <not set yet> selected, in the Name field, enter onMenu.

  8. In the Parameters field, enter item, label. Flash updates the Actions List with the proper syntax:

  9. function onMenu (item, label).

  10. With the second line of code selected in the Actions List, from the Add Statement menu, choose another action-Actions > trace, for example.

  11. The trace action displays a message of your devising in a separate window named Output. The Output window and trace action are for use solely during the process of developing a script. They provide a quick way to test that everything up to a certain point in a script is working correctly.

  12. In the Message field, enter a text string or expression (Figure 6). For this exercise, enter "My favorite composer is" + label. This formula adds the label name of a selected menu item to the end of the text string.

  13. Figure 6

    The trace action (top) allows you to check your ActionScript at various points for debugging. The trace comments appear in the Output window (bottom) whenever you use the Test Movie or Test Scene command. Here, the trace action attached to the menu SmartClip adds a different message each time you select a new menu item.

  14. Check the Expression box.

  15. To see your menu in action, choose Control > Test Movie.

  16. When you select a menu item, Flash opens the Output window, and your message text appears. To make the menu fully functional, continue adding whatever actions you want. You probably would want to add actions that test which menu choices people make, for example, and deal with them accordingly.

  • + Share This
  • 🔖 Save To Your Account

Discussions

comments powered by Disqus