将分数保留在屏幕上。 [英] Keep the score on screen.
本文介绍了将分数保留在屏幕上。的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在做一个划桨球比赛。一切都有效,除了一件事。显示分数。看起来数字只会出现而不是在瞬间消失。
例如:
如果你得分,你可以获得一分。数字1将出现在分数屏幕附近,但随后它将消失。
我尝试过:
这是我的代码。
I am making a paddle ball game. Everything works except one thing. The displaying of the score. It seems like the number would just appear than disappear within a flash.
For example:
If you scored a point, you earn one point. The number 1 will appear near the score screen, but then it will disappear.
What I have tried:
This is my code.
var canvas;
var context;
var timer;
var interval = 1000/60;
var player1;
var player2;
var prevX;
var ball;
var scoreText;
var p1Score = 0;
var p2Score = 0;
document.addEventListener("keydown", press);
document.addEventListener("keyup", release);
canvas = document.getElementById("canvas");
context = canvas.getContext("2d");
player1 = new GameObject();
player1.x = 50
player1.width = 21
player1.height = 200
player2 = new GameObject();
player2.x = 975
player2.width = 21
player2.height = 200
ball = new GameObject();
ball.vx = 2;
ball.vy = 2;
timer = setInterval(animate, interval);
function animate(){
context.clearRect(0,0,canvas.width, canvas.height);
context.fillText( "P1Score:",40, 30);
context.font = "30px Verdana";
context.fillText("P2Score:",830,30);
context.font = "30px Verdana";
if(w)
{
console.log("Moving Up");
player1.y += -5;
}
if(s)
{
console.log("Moving Down");
player1.y += 5;
}
if(player1.y > canvas.height - player1.height/2)
{
player1.y = canvas.height - player1.height/2
}
if(player1.y < 0 + player1.height/2)
{
player1.y = 0 + player1.height/2
console.log("colliding");
}
player1.drawRect();
if(up)
{
console.log("Moving Up");
player2.y += -5;
}
if(down)
{
console.log("Moving Down");
player2.y += 5;
}
if(player2.y > canvas.height - player2.height/2)
{
player2.y = canvas.height - player2.height/2
console.log("colliding");
}
//colliding up
if(player2.y < 0 + player2.height/2)
{
player2.y = 0 + player2.height/2
}
player2.drawRect();
ball.move();
{
ball.x += ball.vx;
ball.y += ball.vy;
}
ball.move();
if(ball.x > canvas.width - ball.width/2)
{
ball.x= canvas.width - ball.width/2
ball.vx = -ball.vx
p1Score += 1;
context.fillText( "P1Score:" + p1Score,40, 30);
alert('YOU GET 1 POINT!!!')//Win screen when ball hits right canvas
return ball.x = 500
}
if(ball.x < 0 + ball.height/2 )
{
p2Score += 1;
context.fillText("P2Score:" + p2Score, 830, 30);
alert('P2 GETS 1 POINT!!!')//Lose screen when it hits left side of canvas
return ball.x = 500
console.log(p2Score);//Adds score by 1
}
if(ball.y > canvas.height - ball.height/2)
{
ball.y = canvas.height - ball.height/2
ball.vy = -ball.vy
}
if(ball.y < 0 + ball.height/2)
{
ball.y = 0 + ball.height/2
ball.vy = -ball.vy
}
if(ball.hitTestObject(player1))
{
ball.x - ball.width/2;
ball.vx = -ball.vx;
}
if(ball.hitTestObject(player2))
{
ball.x - ball.width/2;
ball.vx = -ball.vx;
}
if(ball.hitTestObject(player2))
{
//ball hits top
if(ball.y < player2.y)
{
ball.vy = ball.vy
}
else if(ball.x < player2.x)
{
ball.vx = ball.vx
}
else if(ball.y > player2.y)
{
ball.vy = -ball.vy
}
}
if(ball.hitTestObject(player1))//collision detected
{
//ball hits top
if(ball.y < player1.y)
{
ball.vy = -ball.vy
}
//ball hits middle
else if(ball.x < player1.x)
{
ball.vx = -ball.vx
}
//ball hits bottom
else if(ball.y > player1.y)
{
ball.vy = ball.vy
}
}
ball.drawCircle();
}
推荐答案
if(ball.x > canvas.width - ball.width/2)
{
ball.x= canvas.width - ball.width/2
ball.vx = -ball.vx
p1Score += 1;
context.fillText( "P1Score:" + p1Score,40, 30);
alert('YOU GET 1 POINT!!!')//Win screen when ball hits right canvas
return ball.x = 500
}
而不是在改变时绘制得分,而不是在任何if语句之外绘制
Instead of drawing the score when it changes, draw it outside of any if statement
这篇关于将分数保留在屏幕上。的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文