Animate CC - Pong Game
Part 5 & Part 6
Part 5 -Collisions
If the ball and the
playerPaddle share the same space then the ball’s speed is reversed by multiplying by -1 (do you remember the maze game?)
This code goes just above
of the other code in the function loop. It tests to see if the ball is moving
left (negative number that is < 0) so the ball does not get stuck behind the
paddle. The CPU paddle is treated similarly. Except the ball will be moving to
the right or have a positive value…so we test for that.
hit F9
The Code:
if( playerPaddle.hitTestObject(ball) == true ){
if(ballSpeedX < 0){
ballSpeedX
*= -1;
}
} else if(cpuPaddle.hitTestObject(ball)
== true ){ //add this
if(ballSpeedX > 0){
ballSpeedX
*= -1;
}
}
Do not forget the last
bracket!
Part 5b
Now to add some
functionality. This first function tests for ball angle and sets the y speed to
a number between 5 and -5 depending on where on the paddle it hits. Add this function
above the function loop NOT inside the loop like the others.
THE CODE:
function calculateBallAngle(paddleY:Number,
ballY:Number):Number
{
var ySpeed:Number = 5 * ( (ballY-paddleY) / 25 );
// (ballY-paddleY) /
25 will be between -1 and 1 depending on where the ball hits
return ySpeed;
}
Do not forget this last
bracket.
Now REPLACE the playerPaddle and cpuPaddle
hitTestObject code we just added (in 5 above) with this
The CODE:
if( playerPaddle.hitTestObject(ball) == true ){
if(ballSpeedX < 0){
ballSpeedX
*= -1;
ballSpeedY
= calculateBallAngle(playerPaddle.y, ball.y); //add this
}
} else if(cpuPaddle.hitTestObject(ball)
== true ){
if(ballSpeedX > 0){
ballSpeedX
*= -1;
ballSpeedY
= calculateBallAngle(cpuPaddle.y, ball.y); //add this
}
}
Do not forget this last
bracket.
Part 06 –scoring points
Start with ZERO, if you
miss a ball the other gets a point.
Add these variable where
the others are –at the very top-:
THE CODE:
var playerScore:int = 0;
var cpuScore:int = 0;
now add points – look for
the following code then make these changes:
the CODE:
//first check the left and right boundaries
if(ball.x <= ball.width/2){ //check if the x
position
ball.x
= ball.width/2; //then set the ball's x position
ballSpeedX
*= -1; //and multiply the ball's x speed by -1
cpuScore ++; //increase cpuScore
by 1
} else if(ball.x >= stage.stageWidth-ball.width/2){
//check to see if ball.x =
stage.stageWidth-ball.width/2; //and set the
ballSpeedX
*= -1; //multiply the x speed by -1
playerScore++; //increase
playerScore by 1
}
This
will not show up anywhere. We need to add a display for the scores. Note the
capitals!
With
the text tool write Player Score: 0 –
check its properties and set to Dynamic
Text and instance name to: playerScoreText
Again:
Write
CPU Score: 0 –dynamic text – instance name: cpuScoreText
Add
a new function – above the other new function (ball angle)
To avoid
an error message we need to add a font
Choose
– TEXT –Font Embedding
Find
your font –check box uppercase, lowercase and numerals
–
click the + sign (top left ish)
we added
Here’s
the code:
function updateTextFields():void
{
playerScoreText.text =
("Player Score: " + playerScore);
cpuScoreText.text =
("CPU Score: " + cpuScore);
}
Do
not forget the last bracket.
Make
some changes to your code again:
FIND
the CODE:
//first
check the left and right boundaries
if(ball.x
<= ball.width/2){ //check if the x position
ball.x = ball.width/2; //then set the
ball's x position
ballSpeedX *= -1; //and multiply the ball's
x speed
cpuScore ++; //increase cpuScore by 1
updateTextFields();
}
else if(ball.x >= stage.stageWidth-ball.width/2){ //check to see if
ball.x
= stage.stageWidth-ball.width/2; //and set the x position to that,
ballSpeedX *= -1; //multiply the x speed by
-1 so that the ball is now moving left
playerScore++; //increase playerScore by 1
updateTextFields();
}
CTRL-ENTER to play
WINDOW KEY + G to record
download as an animated GIF
=ALL DONE=
