Flash AS3 Tutorials Center | Interesting Flash Animation Tutorials | Valuing Flash Animation Tutorials | Flash ActionScript and Animation Home

AS3 Beginner Tutorials | AS3 Basic Lessons | AS3 Valuing Courses | AS3 Components Tutorials | AS3 and PHP Interaction Tutorials
AS3 Practical Tutorials | AS3 Animation Techniques | AS3 Transition Effects Tutorials | AS3 Download Upload Files | AS3 Particle Systems
Communication Between Flash Movies with AS3 | AS3 and JavaScript interaction | AS3 Matrix Transformation | AS3 Physics Simulation Tutorials

ActionScript 3 Tutorial: Change Depth of Objects on Stage

Even all objects had been loaded to the stage, the depth the objects can still be changed. The secret is:setChildIndex(Object_Name, depth)

Please update flash player to view this Flash ActionScript tutorial!

Flash Tutorial Content:

Sometimes you wish to change the depth of objects on the stage, this can create some interesting animation effect. This Flash ActionScript tutorial shows you how to change the depth of objects on the stage.

The complete Flash Movie is shown as above, you may try how it works before you start this Flash ActionScript tutorial.

Flash ActionScript Codes:

/*
Preparation: Create Linkage for the MovieClip

STEP 1: Prepare MovieClips
You already prepared three MovieClips in the library
In this example, the name of the MovieClips are:
- Tree
- Sun

 

STEP 2: Create Linkage
Select the movieclip from the library window
Select "Linkage..." from the pop up window
The Linkage Properties window appear
Check the "Export for ActionScript"
Enter Name in the Class field
In this example, we used "Tree" and "Sun" for the class name
*/

 

//Set the Apple RadioButton to be selected by default
sun_rb.selected = true;

 

//Declare the Radio group (belong to same group)
//This can be done by using the first RadioButton (apple_rb)
var myRadioGroup:Object = tree_rb.group;

 

enter_btn.addEventListener(MouseEvent.CLICK, changeDepth);

 

function changeDepth(evt:MouseEvent):void {

if (String(myRadioGroup.selectedData) == "TreeBack") {

// Change the depth of Tree to zero
// so that the Tree is behind the Sun
setChildIndex(myMovieClip1, 0);

// Display message
output_txt.text = "The depth of Tree is set to ZERO. Therefore the Tree will be put behind the Sun.";
} else if (String(myRadioGroup.selectedData) == "SunBack") {// Change the depth of Tree to zero
// so that the Tree is behind the Sun
setChildIndex(myMovieClip2, 0);

// Display message
output_txt.text = "The depth of Sun is set to ZERO. Therefore the Sun will be put behind the Tree.";
}

}

Download Flash Source File:

Flash Source File depth-3.fla

Remarks:

This Flash ActionScript tutorial show how to change the depth of object on the stage of Flash Movie..