Практическая работа № 14
Creating Pong Game
Objective: This tutorial will teach you how to make a Pong Game.
1. Launch "T5-pong.swf" to have a preview of what can be accomplished from this tutorial.
2. Run Macromedia MX, create a new flash document file and save as "T4-Fighting.fla". Set the frame rate to 36 fps. (Click Modify>Document…):
3. Point to the First Frame in the timeline, press F9, in the actions panel for the first frame type the following code:
This will stop the flash movie from playing. Add any text you want to this frame.
4. Create 3 buttons, each button entitled “Easy”, “Medium” and “Hard” respectively as show below:
To create a button, draw your button using the tools in the toolbox. Select it by dragging a box around your button, Press F8 on the keyboard, Select button in the pop up box and give your button a name, Click OK.
5. Add the following code to you buttons (Right click the button and select 'Actions' from the menu):
Button Easy Code:
Button Medium Code:
Button Hard Code:
You should now have something that looks like this:
6. Now it is time to create the Score Bar for the game. Create a new blank key frame on your main timeline (press F7) and label it as 'play'.
7. On this frame create a score bar at the top, make it 28px high for this tutorial. Add 3 “Dynamic text” boxes like below. You can use any font you like.
This will mean that the boxes are all ready at 0 when the movie loads and we do not need to set them using action script.
8. Set “Var” property of "Player: 0" to the “playertxt”, "00:00" to “timetxt” and "CPU:0" to “cputxt”
9. Click “character” button in the properties for each of the dynamic text created and make sure you set “character” to “Lowercase”, “Uppercase”, “Numbers” and “Punctuation”.
10. To create the Paddles, draw a 5px thick line horizontally while holding shift on your keyboard, press “R” and drag, make it about 100px wide. Select it and convert it to a movie clip. Name it “Paddle” (To see how movie clip is created, see No. 3).
11. Move this paddle to the top of your movie and give it the instance name of “cpu”:
12. Click to “Paddle”, press F9 and add the following code to it:
This will cause the paddle to move towards the ball at the speed we set using our buttons earlier.
13. Press Ctrl + L, drag another instance of the “Paddle” movie clip out of the library and place it at the bottom of your movie, give it the instance name “player”.
14. Add the following code to it:
This will cause the paddle to move when we press the left or right arrows. You should now have something like this, we will add the ball next.
15. Create a small circle in the center of your movie, select it and turn it into a movie clip called 'Ball' and give it the instance name of 'ball'. Add the following actions to it:
This will cause the ball to move and bounce off the walls and paddles, it also calls a function if the ball hits the top or bottom of our movie.
If you test your movie now (Ctrl + Enter) you should be able to move your paddle, not much else will happen, we will fix that next.
16. The Game (Bringing It All Together): Right click your second frame and press F9, add the following code (For this round, because it is lengthy, so just copy and paste):
This sets all our start variables and defines the win, lose, reset and timer functions, it also creates a 1 second interval that updates the timer. Run your movie now and you should be able to play the game. Now we'll add the win and lose screens.
17. The win and lose screens: Add another 2 key frames (press F7) to your main timeline and label them “win” and “lose” (See No. 5 on how to label your frame). Add any text you want to these frame such as “You Win” or “You Lose” then go back to your first frame.
Drag a box around your 3 buttons (easy, medium and hard) then copy then by pressing CTRL + C on your keyboard. Go back to your win frame and right click then click “Paste in Place”, do the same on your lose frame.
The final thing to do is to clear the interval we set for the timer, add the code below to both your win and lose frames (point to the 3rd frame, press F9 and paste. Do the same for the 4th Frame).
clearInterval(timerint);
_root.cpu.score = 0;
_root.player.score = 0;
_root.playertxt = 'Player: 0';
_root.cputxt = 'CPU: 0';
That's all, run your movie and check it all works. If not go back though this tutorial and check you haven't missed anything,