DEFINING A BOUNDARY

Boundaries are something we contend with on a daily basis. Although boundaries can take many forms physical, financial, mental in the end they're nothing more than an indicator of something's limit. To make a boundary work, you must simply define its limits, then take appropriate action when (or just before) those limits are exceeded. Think of driving a car: Lines on the road define the boundaries our cars are supposed to remain within. If we're approaching the line on the left (the left boundary), we move our steering wheel to adjust; if we're approaching the line on the right, we once again make the requisite adjustment conditional logic in action! Written in ActionScript, those actions might look like the following:

 if (car._x > leftOfRoad) {    turnWheel ("right");  } else if (car._x > rightOfRoad) {    turnWheel ("left");  } 

To make a boundary work in Flash, you must define its limits, then use an if statement to check the affected element each time an event occurs that might cause it to exceed its defined boundaries. This will become clearer as we progress through this exercise.

In Flash, boundaries are used for the following:

• To prevent movie clip instance properties (including x, y, alpha, xscale, yscale, and so on) from being changed beyond specified amounts

• To invoke an action (property change or method) when something is within or exceeds a specified boundary

• To prevent data values from exceeding defined limits (useful when validating data)

In this exercise, we'll dynamically animate the red bars at the top of our project, which represent a moving "launch window" that our rocket must pass through to complete a successful launch.

1. Open rocketLaunch2.fla in the Lesson09/Assets folder.

   This file continues on the one we worked with in the last exercise.

2. With the Actions panel open, select one of the two red bars at the top of the stage and add this script:

    onClipEvent (enterFrame) {    if (_x < 0) {      direction = "right";    } else if (_x > 550) {      direction = "left";    }    if (direction == "right") {      _x = _x + 3;    } else {      _x = _x   3;    }  } 

   Obviously, the two red bars at the top of the stage are part of the composite movie clip instance to which this script is attached. This script uses two if statements to move this movie clip instance back and forth, from left to right. Using the enterframe event causes these statements to be evaluated 24 times a second (the frame rate of the movie).

   The first statement is used to analyze the position of this clip as it moves within a specified boundary. It says that if the horizontal position of this instance is less than 0 (that is, its center point exceeds the left side of the stage), set the value of direction to "right." Otherwise, if its horizontal position is greater than 550 (that is, its center point exceeds the right side of the stage), set the value of direction to "left." The way this is scripted, the value of direction changes only if one of the limits of the boundary is exceeded. This will occur as a result of the movie clip being put into motion, which is what the next if statement does. It says that if direction has a value of "right," move the instance to its current horizontal position plus 3. This moves the instance to the right. Otherwise (else ; if direction has a value of "left"), move the instance to its current horizontal position minus 3. This moves the instance to the left. With these two statements being analyzed as well as these actions executing 24 times a second, the red bars are set in motion, but their movement is restricted to a specified area.

   NOTE

   When creating boundaries in your scripts, it's important to note which event handler might cause an element to exceed a boundary so that you can use that event to analyze the boundary conditional statement. For example, if you wanted to take a specific action when a movie clip instance's vertical position exceeded an established boundary while being dragged around the stage, the mouseMove event handler would be ideal since it could easily cause a dragged movie clip instance to exceed its boundary.

   These two statements work in harmony: The direction of the red bars' movement is determined by which boundary it last exceeded (which sets the value of direction to either "left" or "right") that is, they will move in the opposite direction of the boundary exceeded. Eventually, a boundary will be exceeded again, and the process will be repeated in the opposite direction. In other words, if direction has a value of "right," the instance will move right, eventually exceeding the right part of the boundary at which point the value of direction is set to "left" and the process is reversed.

   

   NOTE

   The instance's initial position on the stage is 1 pixel past the left boundary. Thus, when this script is first executed, direction is set to "right" and the instance moves to the right.

3. Choose Control > Test Movie to test the project's functionality thus far.

   When the movie begins playing, the red bars are set in motion. When either of the boundaries we defined in the last step is exceeded, the bar is set in motion in the opposite direction.

4. Close the test environment to return to the authoring environment and save your work as rocketLaunch3.fla.

   We will build on this file in the next exercise.