Практическая работа № 10
Controlling Object Movement
Part 1: Controlling and Moving a Floating Fish
1. Open “T1-fish.swf” for a preview of what can be accomplished from this tutorial.
2. Open “T1-fish.fla”, click on the fish movie clip and then press F9 and type the following code:
3. That's all, run your movie (Ctrl + Enter) and check it all works. If not, go back though this tutorial and check you have not missed anything.
Part 2: Controlling and Moving an object (using variables)
Part 2a:
1. Open “T1-part2a.swf” for a preview of what can be accomplished from this tutorial.
2. Draw a circle, but you can use as much detail as you want.
Use this tool
3. Next, highlight the “player” movie clip, press F8 and name it as "player". Put the “player” movie clip to the stage.
4. Point to the “player” movie clip, press F9 and add the following code:
5. Ctrl + Enter to play your movie. The arrow keys now make your player slide around. If it's choppy, change your frame rate to 30 fps (frame per second).
Part 2b:
1. Open “T1-part2b.swf” for a preview of what can be accomplished from this tutorial.
Now, you may be thinking, “this is all well and good, but I want to have a side-scroller where the player changes directions.” This is a very simple effect to achieve using the _xscale property.
3. First draw a cartoon as follows:
To make your movie clip move only left and right and face the direction it's moving you just need to doctor the above code like so:
By changing the _xscale to -100, you are stretching the movie clip's right edge to where the left edge is, and vice versa. This effectively flips the movie clip left-to-right. Setting _xscale back to 100 restores the movie clip to it's original position. Using this trick always you to have a walk cycle that faces right, and have it work seamlessly when you want the player to face left.
You are going to apply this in Tutorial 4: Creating character
Part 2c:
1. Open “T1-part2c.swf” for a preview of what can be accomplished from this tutorial.
2. For part 2b, there's only one thing missing from the side-scroller controls: jumping. Adding a jump key is also simple and here's how we are going to do it: when the user presses the spacebar we'll set a variable that makes the player jump. It's that simple. Using some math, we'll calculate the jump arc on a frame-by-frame basis.
Part 2d:
1. Open “T1-part2d.swf” for a preview of what can be accomplished from this tutorial.
2. May be you want to be able to retain some left/right control while in the air. This is a simple tweak and looks like this:
How the new jumping code works is that when the player is jumping, the left/right speed is reduced and then, upon landing, the speed is restored.
Part 3: Moving ellipse using ActionScripts
Objective: In this tutorial we will construct an elliptical motion using Action Script instead of the tweening functionality. This requires only a few short steps.
1. Open “T1-ellipse.swf” for a preview of what can be accomplished from this tutorial.
2. Open a new movie. You can easily alter the frame rate, background color, and other features by selecting Modify > Document. Change the setting as follows:
3. Make a circle (or ellipse) and then set this circle as movie clip. This is done by highlighting the circle and then presses F8:
4. Open “Properties” panel of the “circle” movie clip and give the “circle” an instance name “planet”.
5. In Layer 1 position the cursor in Frame 2 and insert a frame (F5), NOT a Keyframe. Do the same in Frame 3. Your Timeline will now look like this:
6. Next create a new layer. You may give the layer the name: Code. [Layers may be given names by double-clicking on their created name and typing in a new name.] Position the cursor in the first layer. Then type the following action into Frame 1:
stop();
Your Timeline will look as follows:
7. Now select Frame 2 with the mouse, press F7 to create a blank keyframe, and type the code as shown below. This creates the new x and y pixel position of the planet. As you can see, we have the parametric equations for an ellipse.
8. Now place a Keyframe (press F6) in Frame 3 of your Code layer. In the Frame Action dialog box type in the time increment statement and the go to frame 2 statements. The statement, "i = (i+1)%60" will increase the time counter by one but compute the remainer modulo 60. Thus the ellipse will cycle around (You could as well leave off the "%60."). Now you should have this script:
9. We are almost done. First create a new layer. Position the cursor in Frame 1 and make a button as before. Do this by drawing a circle or square, choosing the Arrow tool (or press “v”), and selecting the graphic. Then press F8 and make the button.
10. Now choose the button, press F9 and type in the following code:
On(press){
i=0;
gotoAndPlay(2);
}
The "i = 0" statement will initialise the time step. In fact this could be any number - but it must be defined!
11. Ctrl + Enter to play your movie.
*Add- ons. On new layers, you can enter text messages, a center of the orbit (e.g. sun), a stop button, another planet. But if you put in another planet, you will need to give it an Instance name and replicate the code for this planet. Change the radius so they don't overlap. You may also alter the motion to just about anything you want. If you use mathematical commands, such as sin, cos, exp, and the like, be sure to refer to them as Math.sin, Math.cos, Math.exp, and so on.