interactive scripting - CGR C/092 - fall 2004
Philip van Allen - v a n a l l e n @ a r t c e n t e r . e d u

room 142, Monday 4:00pm-7:00pm
all materials on this web site © copyright 2004, Philip van Allen
 
week 06b - project 2 assignment, dynamically created clips

dynamically : 


created clips

Rather than creating all of your movie clips in the authoring environment, it is possible to generate movieClips dynamically, while the movie is playing. So the movie can start with nothing on the stage, or with just a "seed" clip. Then at run time, copies of clips in the library or of the seed clip can then be generated as needed. This allows the designer to:

  • generate graphics in response to user input
  • create a varying number of graphics each run time
  • delete objects when they are no longer needed (only dynamically created movieClips can be removed from the stage)

There are two ways to dynamically create movieClips:

  • duplicateMovieClip(): duplicate an existing clip on the stage. An exact copy of the specified clip instance is created. This has the advantage of replicating the seed clip, including all of its scripts and current property settings. For example, if the object has been moved and scaled, and has event handlers to respond to mouse clicks, the duplicated clip will appear in the same location with the same scale and event handlers. The disadvantage of this approach is that there must be a clip on the stage to start with. This starting clip is often referred to as the "seed" clip. A trick is to hide the seed clip off to the left of the stage.
  • attachMovie(): attaching a movie clip that's in the library. A new instance of the library clip is created at the 0,0 point on the stage. This approach eliminates the need for a seed clip already on the stage. A disadvantage is that the new instance will not have any scripts attached to it--but there is a method for assigning event handlers to the new instance of the clip.

 


duplicateMovieClip() : 

make a copy of an existing clip

The format for using duplicateMovieClip() is:

movieClipToBeDuped.duplicateMovieClip(newInstanceName, depth);

  • newInstanceName is a unique name for the new movieClip
  • depth is a unique positive integer for the instance depth - the higher the number more in front the instance will be on the stage.

The new clip is placed on the timeline of the clip being duplicated. An example of creating three new clips when clicking on an existing clip that's on main timelime:

 
on(release) {
    var newClipName;
    for(i = 1; i <= 3; i++) { // loop three times
        // set the name of the new clip 
        newClipName = "clip" + i; 
        // duplicate the clip
        this.duplicateMovieClip(newClipName, i); 
        // set the new x position up to 80 pixels away 
        _root[newClipName]._x += (Math.random() * 160) - 80; 
        // set the new y position up to 80 pixels away 
        _root[newClipName]._y += (Math.random() * 160) - 80; 
    }
}

Notice that this code only permits a total of 4 clips on the stage. This is because it keeps re-using the same numbers (1-3) for the duplicateMovieClip() depth argument. An alternative would be to create a global variable to keep track of the number of clips created, so each new time the loop is run, higher numbers are used for depth. To do this, place this line of code in the actions layer, frame 1:

var clipCount = 0;

and use the following on(release) code on the movieClip:

on(release) {
    var newClipName;
    for(i = 1; i <= 3; i++) { // loop three times
        // increment the global clip count
        _root.clipCount++;            
        // set the name of the new clip 
        newClipName  = "clip" + _root.clipCount; 
        // duplicate the clip
        this.duplicateMovieClip(newClipName, _root.clipCount); 
        // set the new x position up to 80 pixels away 
        _root[newClipName]._x += (Math.random() * 160) - 80; 
        // set the new y position up to 80 pixels away 
        _root[newClipName]._y += (Math.random() * 160) - 80; 
    }
}

 

 
attachMovie() : 

create a new clip from the library

attachMovie() requires that a library clip be exported from the library so that it is included in the .swf file. To do this, control click on the clip in the library, modify the Linkage property to "Export for ActionScript", and provide an ID name that will be used when the movie is attached.

The format for using attachMovie is:

timelineForNewClip.attachMovie(libraryID, newInstanceName, depth);

  • libraryID is the name given to the clip when it was exported
  • newInstanceName is a unique name for the new movieClip
  • depth is a unique positive integer for the instance depth - the higher the number more in front the instance will be on the stage.

The new clip is placed on the timeline of the movieClip specified by timelineForNewClip. An example of a button event that creates 10 new instances from a clip in the library with an ID of "test":

on(release) {
    for (i = 1; i <= 10; i++) { // loop ten times
        // set the name of the new clip 
        newClipName = "clip" + i;
        // attach the clip to the _root timeline
        _root.attachMovie("test", newClipName, i);

        // add event handler to the clip for the release event
        //
        _root[newClipName].onRelease = function() {
            this._x += 30; // or whatever you want
        }

        // set the new clip's x position 30 pixels * i to the right
        _root[newClipName]._x  = i * 30;
        // set the new clip's y position 30 pixels * i down
        _root[newClipName]._y = i * 30;
    }
}

 

 
removeMovieClip : 

delete a clip off the stage

removeMovieClip() is used to delete any movieClip that has been created with duplicateMovieClip() or attachMovie(). It cannot be used to delete clips created in the authoring environment.

The format for removeMovieClip() is:

movieClipToBeDeleted.removeMovieClip();

The clip instance identified by movieClipToBeDeleted will be removed. An example of deleting a dynamically created clip after 30 seconds is:

onClipEvent(load) {
    // intialize the frame counter
    var frameCount = 0;
}


onClipEvent(enterFrame) {
    // increment the frame counter
    frameCount++;
    // have we been running longer than 10 seconds @ 12fps?
    if (frameCount > 120) {
        // - delete ourself (only works if clip was created w/duplicateMovieClip or attachMovie)
        this.removeMovieClip();
    }
} 

 

all materials on this web site © copyright 2004, Philip van Allen

top