1
J'espère vraiment que vous pourrez peut-être me capable. Je suis un novice total et j'essaie simplement d'apprendre. J'essaye de créer un jeu de pong.Créer un jeu de pong dans Netbeans
Mon problème est maintenant qu'il n'y a pas de collision entre les palettes et les balles.
Voici mon code. C'est salissant, je dois admettre.
</head>
<body>
<canvas id="canvas" width="500" height="500" style="border:1px solid #000000;"></canvas>
<script type="text/javascript">
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var gradientMag = 375;
var gradient = ctx.createLinearGradient(0,0,0, gradientMag);
var ball_x = canvas.width/2;
var ball_y = canvas.height-30;
var dx = -2;
var dy = -2;
var ballRadius = 5;
var p_Height = 100;
var p_Width = 10;
var player1x = (canvas.width-p_Width);
var player1y = canvas.height-p_Height;
var player2y = 0;
var player2x = 0;
var player2Right = false;
var player2Left = false;
var player1Right = false;
var player1Left = false;
var startScreen = true;
var gameRunning = false;
var player1wins = false;
var player2wins = false;
document.addEventListener("keydown", keyDownHandler, false);
document.addEventListener("keyup", keyUpHandler, false);
function keyDownHandler(e) {
if(e.keyCode == 40) {
player1Right = true;
} if(e.keyCode == 38) {
player1Left = true;
} if(e.keyCode == 83) {
player2Right = true;
} else if(e.keyCode == 87) {
player2Left = true;
} }
function keyUpHandler(e) {
if(e.keyCode == 40) {
player1Right = false;
} if(e.keyCode == 38) {
player1Left = false;
} if(e.keyCode == 83) {
player2Right = false;
} if(e.keyCode == 87) {
player2Left = false;
}
else if (e.keyCode == 13){
gameRunning = true;
startScreen = false;
player1wins = false;
player2wins = false;
}
}
/*
function loadGame(){
if (startScreen){
var gradient = ctx.createLinearGradient(0,0,0,gradientMag);
gradient.addColorStop(0,blue);
gradient.addColorStop(1,red);
ctx.fillStyle = gradient;
ctx.fillRect(0,0, 500, 500);
ctx.font = "40px Verdana";
ctx.fillstyle = "blue";
ctx.fillText("Press Enter to begin", 150, 110);
}
}
*/
function ball() {
ctx.beginPath();
ctx.arc(ball_x, ball_y, ballRadius, 0, Math.PI*2);
ctx.fillStyle = "red";
ctx.fill();
ctx.closePath();
}
function paddle() {
ctx.beginPath();
ctx.rect(player1x, player1y, p_Width, p_Height);
ctx.fillStyle = "green";
ctx.fill();
ctx.closePath();
}
function player2() {
ctx.beginPath();
ctx.rect(player2x, player2y, p_Width, p_Height);
ctx.fillStyle = "blue";
ctx.fill();
ctx.closePath();
}
function draw() {
if (startScreen){
/*var gradient = ctx.createLinearGradient(0,0,0,gradientMag);
gradient.addColorStop(0,blue);
gradient.addColorStop(1,red);
ctx.fillStyle = gradient;
ctx.fillRect(0,0, 500, 500);
*/
ctx.font = "20px Verdana";
ctx.fillstyle = "blue";
ctx.fillText("Press Enter to begin", 100, 90);
}
if (gameRunning){
ctx.clearRect(0, 0, canvas.width, canvas.height);
ball();
paddle();
player2();
//bounce of the walls
if(ball_y + dy > canvas.width-ballRadius || ball_y+dy < ballRadius){
dy = -dy;
}
//if the ball hits the top
if(ball_x + dx < ballRadius) {
//if the ball hits the paddle of player 2
if(ball_x + dx < player2x + p_Height && ball_y > player2y && ball_y < player2y + p_Width){
console.log("hit the paddle");
dx = -dx;
}
//if the ball hits the top - do this first
else if(ball_x + dx < canvas.height)
{
//alert("Player 1 Wins!");
//document.location.reload();
player1wins = true;
gameRunning = false;
}
}
//if the ball hits the bottom
if(ball_x + dx > canvas.height-ballRadius) {
//the ball hits the paddle
if(ball_x + dx > player1x && ball_y > player1y && ball_y < player1y + p_Width){
dx = -dx;
}
//the ball hits the base
else if(ball_x + dx > canvas.height)
{
//alert("Player 2 Wins!");
//document.location.reload();
player2wins = true;
gameRunning = false;
}
}
if(player1Right && player1y < canvas.width-p_Width) {
player1y += 5;
}else if(player1Left && player1y > 0) {
player1y -= 5;
}
if(player2Right && player2y < canvas.width-p_Width) {
player2y += 5;
}else if(player2Left && player2y > 0) {
player2y -= 5;
}
ball_y += dy;
ball_x += dx;
}
else if (player1wins) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
//background();
ctx.font = "20px Verdana";
ctx.fillstyle = "blue";
ctx.fillText("Well done player 1, you win!", 100, 90);
ctx.fillText("Hit F5 to play again!", 100, 110);
} else if (player2wins) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
//background();
ctx.font = "20px Verdana";
ctx.fillstyle = "blue";
ctx.fillText("Well done player 2, you win!", 100, 90);
ctx.fillText("Hit F5 to play again!", 100, 110);
}
}
setInterval(draw, 10);
//loadGame();
</script>
</body>
</html>