Referencing Movie Clips in Flash MX

When the instance structure of a movie gets very complicated, composing references to movie clips and main movies can be laborious. We may not always recall the exact hierarchy of a series of clips and, hence, may end up frequently selecting and editing clips in the authoring tool just to determine their nested structure. The Actions panel’s Insert Target Path tool generates clip references visually, relieving the burden of creating them manually. The Insert Target Path button is shown in Figure13-6.

Figure 13-6.  The Insert Target Path button

To use Insert Target Path, follow these steps:

1. Position the cursor in your code where you want a clip reference to be inserted.
   
2. Click the Insert Target Path button, shown in Figure13-6.
   
3. In the Insert Target Path dialog box, select the clip to which you want to refer.
   
4. Choose whether to insert an absolute reference, which begins with_root, or a relative reference, which expresses the reference to the target clip in relation to the clip that contains your code (this).
   
5. If you are exporting to Flash 4 format, choose the Slashes Notation button for Flash 4 compatibility. (The Dot Notation button, selected by default, composes references that won’t work in Flash 4).

The Insert Target Path tool cannot generate relative references that ascend a hierarchy of clips. That is, the tool cannot be used to refer to a clip that contains the current clip (unless you want to begin the path from_rootand proceed downward). To create references that ascend the clip hierarchy, we must either use absolute references starting with_root(which therefore become descending references) or manually enter the appropriate relative references in our code using the_parentproperty.

Dynamic References to Clip Objects

Normally, we know the name of the specific instance or movie we are manipulating, but there are times when we’d like to control a clip whose name we don’t know. We may, for example, want to scale down a whole group of clips using a loop or create a button that refers to a different clip each time it is clicked. To handle these situations, we must create our clip references dynamically at runtime.

Using the array-element access operator

As we saw in Chapter 5 and Chapter 12, the properties of an object can be retrieved via the dot operator or through the array-element access operator, []. For example, the following two statements are equivalent:

  someObject.myProperty = 10;
  someObject["myProperty"] = 10;

The array-element access operator has one important feature that the dot operator does not; it lets us (indeed requires us to) refer to a property using a string expression rather than an identifier. For example, here’s a string concatenation expression that acts as a valid reference to the propertypropertyX:

  someObject["prop" + "ertyX"];

We can apply the same technique to create our instance and movie references dynamically. We already saw that clip instances are stored as properties of their parent clips. Earlier, we used the dot operator to refer to those instance properties. For example, from the main timeline we can refer toclipB—which is nested inside of another instance,clipA—as follows:

  clipA.clipB;           // Refer to clipB inside clipA
  clipA.clipB.stop();    // Invoke a method on clipB

Because instances are properties, we can also legitimately refer to them with the[]operator, as in:

  clipA["clipB"];          // Refer to clipB inside clipA
  clipA ["clipB"].stop();  // Invoke a method on clipB

Notice that when we use the[]operator to refer toclipB, we provide the name ofclipBas a string, not an identifier. That string reference can be any valid string-yielding expression. For example, here’s a reference toclipBthat involves a string concatenation:

  var clipCount = "B"; clipA["clip" + clipCount]; // Refer to clipB inside clipA clipA["clip" + clipCount].stop(); // Invoke a method on clipB

We can create clip references dynamically to refer to a series of sequentially named clips:

  // Here's a loop that stops clip1, clip2, clip3, and clip4
  for (var i = 1; i <= 4; i++) {
    _root["clip" + i].stop();
  }

Now that’s powerful!