我对游戏开发相当陌生。我正在编写一个基本的JavaScript帆布游戏。每当我按下键,我的玩家就会从画布上飞下来。这是控制器代码
document.onkeydown = function(event){
if(event.keyCode === 87){
player.up = true;
}
else if(event.keyCode === 83){
player.down = true;
}
else if(event.keyCode === 65){
player.left = true;
}
else if(event.keyCode === 68){
player.right = true;
}
}
document.onkeyup = function(e){
if(e.keyCode === 87){
player.up = false;
}
else if(e.keyCode === 83){
player.down = false;
}
else if(e.keyCode === 65){
player.left = false;
}
else if(e.keyCode === 68){
player.right = false;
}
}
if(game.keys && game.keys[87]){
player.speedY += -0.4;
if(player.speedY > player.maxSpeed){
player.speedY = player.maxSpeed;
}
}
if(game.keys && game.keys[83]){
player.speedY += 0.4;
if(player.speedY > player.maxSpeed){
player.speedY = player.maxSpeed;
}
}
if(game.keys && game.keys[65]){
player.speedX += -0.4;
if(player.speedX > player.maxSpeed){
player.speedX = player.maxSpeed;
}
}
if(game.keys && game.keys[68]){
player.speedX += 0.4;
if(player.speedX > player.maxSpeed){
player.speedX = player.maxSpeed;
}
}
上面是控制器代码..。对上述代码应做哪些改进。
编辑我意识到您可能需要查看实体创建代码
function square(width, height, color, x, y) {
this.width = width;
this.height = height;
this.x = x;
this.y = y;
this.speedX = 0;
this.speedY = 0;
this.right = false;
this.left = false;
this.up = false;
this.down = false;
this.rend = function(){
ctx = game.context;
ctx.fillStyle = color;
ctx.fillRect(this.x, this.y, this.width, this.height);
}
this.movement = function() {
this.x += this.speedX;
this.y += this.speedY;
}
}
编辑最大速度积分。
var now = Date.now();
var delta = now - lastUpdate;
lastUpdate = now;
this.width = width;
this.height = height;
this.x = x;
this.y = y;
this.angle = 0;
this.maxSpeed = 3;
this.speedX = 0;
this.speedY = 0;
this.rend = function(){
ctx = game.context;
ctx.fillStyle = color;
ctx.globalAlpha = 1;
ctx.fillRect(this.x, this.y, this.width, this.height);
}
this.movement = function() {
this.x += this.speedX;
this.y += this.speedY;
}
}
_edit_added播放器制作功能。
发布于 2019-04-07 05:53:46
经过几个小时的努力解决这个问题,我想到了这个
function moving() {
if(game.keys && game.keys[87]){
player.speedY = -2;
}
else if(game.keys && game.keys[83]){
player.speedY = 2;
}
else if(game.keys && game.keys[65]){
player.speedX = -2;
}
else if(game.keys && game.keys[68]){
player.speedX = 2
}else{
player.stop();
}
}
this.stop = function(){
this.speedX = 0;
this.speedY = 0;
}
基本上,我检查这些键中没有一个被按下,然后说播放器速度X是0,速度Y是0。
感谢所有帮忙的评论员!
发布于 2019-04-06 19:08:11
我很确定我知道你的代码出了什么问题。(现在我真希望自己没有犯什么愚蠢的错误)。
您可以正确地检查是否按下控制按钮并存储该信息。不过!在代码的“移动”部分,你用相同的方向增加速度.很多次了。(每帧一次,可能每秒60次或更多次)。你可以想象它的扩展有多快。在代码的后面部分也会做同样的事情。你按速度调整位置,但每帧都要做。
想象一下:你想让你的玩家每秒移动10米。所以你把速度设定为10,然后用一种方法移动他,也就是10。但是代码并没有那么在意秒,它会尝试在一个帧中移动整个10米,60英尺的速度是每秒600米!
您想要做的是以某种方式检查所谓的增量时间。我不知道如何在javascript中这样做,但是每个游戏引擎都内置了类似的东西。你可能会查一查,或者试着检查框架?
deltaTime = 1 / framerate;
然后这样做:
this.movement = function() {
this.x += this.speedX * deltaTime;
this.y += this.speedY * deltaTime;
}
这应该有助于解决最大的问题。我看到一个较小的问题,可能会出现在你的游戏。
if(player.up == true){
player.speedY += -1;
}
在这里增加速度的方式是一个好主意,但从长远来看,您可能会遇到一些问题。
你不是在检查最高速度。您没有使用增量时间,所以再次您的加速可能会变得疯狂(而且它将是过于脆弱的依赖,所以玩家拥有更快的计算机可能有不公平的优势!)
如果你能加上“衰变”。换句话说,如果玩家没有主动增加速度,你可能会想慢一点。否则,你永远不会真正“停止”。你的速度会达到15这样的数字,所以你按相反的方向,但你永远不会达到15,所以你会以-2的速度结束.你懂我说的意思吗?
https://gamedev.stackexchange.com/questions/169778
复制