Controlling embedded media with ActionScript

Flash creates a new movie clip for each <img> tag and embeds that movie clip within the TextField object. The <img> tag's id attribute lets you assign an instance name to the movie clip that is created. This lets you control that movie clip with ActionScript.

The movie clip that Flash creates is added as a child movie clip to the text field that contains the image.

For example, the following example embeds a SWF file in a text field.

To embed a SWF file in a text field:

  1. Create a new Flash document.
  2. Resize the document's Stage size to 100 pixels by 100 pixels.
  3. Use the Rectangle tool to draw a red square on the Stage.
  4. Resize the square to 80 pixels by 80 pixels by using the Property inspector, and then move the shape to the center of the Stage.
  5. Select Frame 20 on the Timeline and then press F7 (Windows or Macintosh) to insert a new blank keyframe.
  6. Use the Oval tool to draw a blue circle on the Stage on Frame 20.
  7. Resize the circle to 80 pixels by 80 pixels by using the Property inspector, and then move it to the center of the Stage.
  8. Click a blank frame between Frame 1 and 20, and set the tween type to Shape in the Property inspector.
  9. Save the current document as animation.fla.
  10. Select Control > Test Movie to preview the animation.

    The SWF file is created in the same directory as the FLA. For this exercise to work correctly, you need the SWF file to generate so that you can load it into a separate FLA file.

  11. Create a new FLA file and save it as animationholder.fla.

    Save the file in the same folder as the animation.fla file you created previously.

  12. Add the following ActionScript code to Frame 1 of the main Timeline:
    this.createTextField("textField_txt", 10, 0, 0, 300, 200);
    textField_txt.html = true;
    textField_txt.htmlText = "Here's an interesting animation: <img src='animation.swf' id='animation_mc'>";
    

    In this case, the fully qualified path to the newly created movie clip is textField_txt.animation_mc.

  13. Save your changes to the Flash document and then select Control > Test Movie to preview the animation within the text field.

To control the SWF file as it plays in a text field, complete the next exercise.

To control a SWF file that plays in a text field:

  1. Follow the steps in the first procedure under Controlling embedded media with ActionScript.
  2. Create a button instance on the Stage and give it the instance name stop_btn in the Property inspector.
  3. Add the following ActionScript code beneath the existing code in Frame 1 of the main Timeline:
    stop_btn.onRelease = function() {
        textField_txt.animation_mc.stop();
    };
    
  4. Select Control > Test Movie to test the application.

    Now, whenever you click the stop_btn button instance, the timeline of the animation nested within the text field stops.

For information on making your embedded media into a hyperlink, see About making hypertext links out of embedded media.