Showcase and discover digital art at yex

Follow Design Stacks

Subscribe to our free newsletter to get all our latest tutorials and articles delivered directly to your inbox!

Behavior 3: Set URL from List Component

Behavior 3: Set URL from List Component

The Set URL from List Component behavior allows you to set up a list of video choices in a List component and then load the selected video from the list as the source of the media component. The list should specify valid paths to the FLV files in the Data property in each item contained in the list. The Labels property for each list item can contain names for each video that are user-friendly. The following instructions show you how to set up the List component and add this behavior to a custom button.

To use this behavior:

  1. Add a Media Playback component to the Stage.
  2. Add a List component to the Stage.
  3. Select the List component and view the component parameters in the Property inspector.
  4. Click the Labels parameter. A dialog box opens. Click the plus (+) icon and enter the label for the first video. Repeat this step to add as many labels as you need. Click OK when you are finished.
  5. Click the Data parameter. Another dialog box opens. Click the plus (+) icon to enter the actual path to the first video. (The path is usually a relative path to a video sitting next to the Flash file or in a nearby directory.) Repeat this step to add a path for each label you previously added, making sure the order of the video paths matches the order of the labels. Click OK when you are finished.
  6. Add a button to the Stage and select it.
  7. Open the Behaviors panel and click the plus (+) icon to access the list of Behavior categories. Select the Media Controls category and choose Set URL from List Component from the list. The behavior’s dialog box opens (see Figure 3).

    figure 3

    Figure 3. The Set URL from List Component dialog box shows the target List (myListControl) and the target MediaDisplay (myMediaControl3) selected. The Autoplay video option is set to True.

  8. In the dialog box, browse for the list component instance in the target list in the top portion of the dialog box. This targets the list of video choices.
  9. Browse for the media component instance in the target list in the bottom portion of the dialog box. This targets the instance name of the component displaying the video. A best practice is to use the Relative option for the path, as shown above. If you have problems adding paths to component buttons, try using the Absolute option instead.
  10. Set the Autoplay video option to True or False.
  11. Click OK.

Here’s the code that is added to the button:

// Start Set URL From List Component Behavior
var m = myListBox;
var n = myMediaControl3;
var p = true;

n.setMedia(m.selectedItem.data);

if (p)
  n.play();
else
  n.stop();
// End Set URL From List Component Behavior

Tips:

  • When using this behavior, it’s a good idea to make sure that the List has a default item selected. If the button that sets the video source is clicked and the List’s selectedItem property is undefined, no video will be loaded. The sample FLA contains a code example on the timeline of the screen for Behavior 3.
  • At the time I wrote this article, there is a known issue with the setMedia function when loading the same FLV file repetitively. If a button containing this behavior is clicked in repetition to call the same video file, the video may not appear on some clicks. Loading different FLV files each time works without error, however.

Comments