< Day Day Up >
Defining aBoundary
We contend with boundaries every day. Although boundaries can take many forms—
physical, financial, mental—in the end they're nothing more than an indication of a limit.
To make aboundary work, you define its limits and take appropriate action when (or just
before) those limits are exceeded. Think of driving a car: lines on the road define the
boundaries within which the car is supposed to remain. If you're approaching the line on
the left (the left boundary), you move the steering wheel to adjust; if you're approaching
the line on the right, you adjust in the opposite direction—conditional logic in action!
Written in ActionScript, those actions might look like this:
if (car_mc._x < leftOfRoad) {
turnWheel ("right");
} else if (car_mc._x > rightOfRoad) {
turnWheel ("left");
}
To make aboundary work in Flash, you must define its limits and use an if statement to
check the affected element each time an event occurs that might cause the element to
exceed its defined boundaries. This concept will become clearer as we progress through
the following exercise.
For example, boundaries in Flash might be used to do the following:
• Prevent the properties of movie clip instances (including x, y, alpha, xscale,
yscale, and so on) from being changed beyond specified amounts
• Invoke an action (property change or method) when an element is within or
exceeds a specified boundary
• Prevent data values from exceeding defined limits (useful when validating data)
In the following exercise, we'll dynamically animate the red bars at the top of the project
to represent a moving "launch window" through which the rocket must pass to complete a
successful launch.
1. Open rocketLaunch2.fla.
We'll continue building on the file you worked with in the preceding exercise.
2. With the Actions panel open, select Frame 1 of the Actions layer and add this
script at the end of the current script:
3.
4. var direction:String;
5.
6. function launchWinMove(){
7.
8. if (launchWindow_mc._x < 0) {
9.
10. direction = "right";
11.
12. } else if (launchWindow_mc._x > 550) {
13.
14. direction = "left";
15.
16. }
17.
18. if (direction == "right") {
19.
20. launchWindow_mc._x = launchWindow_mc._x + 3;
21.
22. } else {
23.
24. launchWindow_mc._x = launchWindow_mc._x - 3;
25.
26. }
27.
28. }
29.
30. _root.onEnterFrame = launchWinMove;
31.
Three changes occur with this added script: you create the direction variable,
define the launchWinMove() function (which uses the direction variable), and set
the launchWinMove() function to be triggered with an onEnterFrame event. Let's
look at how the function works.
The two red bars at the top of the stage are part of the composite movie clip
instance named launchWindow_mc. The function in this step uses two if
statements to move this movie clip instance back and forth from left to right.
Triggering this function using the onEnterFrame event causes these statements to
be evaluated 24 times per second (the frame rate of the movie).
The first statement analyzes the position of the launchWindow_mc instance as it
moves within a specified boundary. The statement says that if the horizontal (x)
position of this instance is less than 0—that is, its center point exceeds the left
boundary of the stage—set the value of direction to "right". If the horizontal
position is greater than 550—its center point exceeds the right boundary of the
stage—set the value of direction to "left". 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 instance being put into motion in the next if statement. This statement
says that if direction has a value of "right", move the instance to its current
horizontal position plus 3. This action 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 action moves the instance to the left. When these two if
statements are analyzed and their actions executed 24 times a second, the red bars
are set into motion, but the movement of the bars is restricted to a specified area.
NOTE
When creating boundaries in your scripts, note which event handler might cause
an element to exceed a boundary, and use that event to analyze the boundary
conditional statement. For example, if you want to take a specific action whenever
a movie clip instance's vertical position exceeds an established boundary while
being dragged around the stage, the mouseMove event handler would be an ideal
choice because it can easily cause a dragged movie clip instance to exceed its
boundary.
These two if statements in our script work in harmony. The direction of the
movement in launchWindow_mc is determined by the boundary it last exceeded
(which sets the value of direction to either "left" or "right")—that is, movement is
in the opposite direction of the boundary exceeded. Eventually aboundary 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.
The instance's initial position on the stage is one pixel past the left boundary.
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 so far.
When the movie plays, the red bars are set into motion. When either boundary
defined in Step 2 is exceeded, the bar moves in the opposite direction.
4. Close the test environment to return to the authoring environment, and save your
work as rocketLaunch3.fla.
We'll build on this file in the next exercise.
< Day Day Up >
. < Day Day Up >
Defining a Boundary
We contend with boundaries every day. Although boundaries can take many forms—
physical, financial, mental—in. boundary, and use that event to analyze the boundary
conditional statement. For example, if you want to take a specific action whenever
a movie clip instance's