Javascript运营商+ =赢得了负数

时间:2016-02-01 22:01:44

标签: javascript html5 canvas

编辑:我相信我找到了解决我的问题的方法当我没有按下右或左时,我将velX和velY设置为零所以我不知道为什么它不能在所有位置移动不可能,但这似乎是问题,将与答案更新

EDIT2:在与你们交谈之后,我确定这不是+ =问题,而是其他的东西,所以我做了第一次编辑,我想出了我的问题答案

            if (movementDirection.Left) {
                this.velX = -speed * zzoom;
            } else if((movementDirection.Left !== true) && movementDirection.Right !== true){
                this.velX = 0;
            }
            if (movementDirection.Right) {
                this.velX = speed * zzoom;
            } else if((movementDirection.Right !== true) && movementDirection.Left !== true){
                this.velX = 0;
            }

这也与velY, PS 感谢下来的投票......

原始帖子============================================= ============= 你好我正在尝试按下按键时制作一个平滑的移动物体,但是当输入负数时位置不会移动因此无法向右和向下移动(我的方向相反)这里是我的代码

if (movementDirection.Left) {
    console.log(-speed * zzoom);
    this.velX = -speed * zzoom;
} else if (movementDirection.Left != true) {
    this.velX = 0;
}
if (movementDirection.Right) {
    this.velX = speed * zzoom;
} else if(movementDirection.Right != true){
    this.velX = 0;
}

 if (movementDirection.Up) {
     this.velY = -speed * zzoom;
 } else if(movementDirection.Up != true){
     this.velY = 0;
 }

 if (movementDirection.Down) {
     this.velY = speed * zzoom;
 } else if(movementDirection.Down != true) {
     this.velY = 0;
 }

 if (movementDirection.noMovement) {
     this.velX = 0;
     this.velY = 0;
 }
 this.lPosX = this.lPosX + this.velX;
 this.lPosY = this.lPosY + this.velY;
 context.translate(this.velX, this.velY);

正如你所看到的,没有理由发生这种情况,我已经记录了当它不会移动的方向时,但是如果我记录这个

this.lPosX = this.lPosX + this.velX

或者这个

this.lPosX += this.velX

我最终得到一个不会是负数的数字,但是当我朝着一个正向的方向移动它会做它应该做的事情但是它不会因为某种原因而变为负数。

1 个答案:

答案 0 :(得分:0)

我重新创造了你的情况(假设有很多东西),除了我只能向右和向下移动。



var context = document.querySelector('canvas').getContext('2d');
var movementDirection = {
	Left: false,
  Right: false,
  Up: false,
  Down: false,
  noMovement: true
};
window.addEventListener('keydown', function(e) {
  movementDirection = {
    Left: false,
    Right: false,
    Up: false,
    Down: false,
    noMovement: false
  };
  switch (e.keyIdentifier) {
  	case 'Left':
    	movementDirection.Left = true;
    	break;
      
    case 'Right':
    	movementDirection.Right = true;
    	break;
      
    case 'Up':
    	movementDirection.Up = true;
    	break;
      
    case 'Down':
    	movementDirection.Down = true;
      break;
      
    default:
    	movementDirection.noMovement = true;
      break;
  }
}, false);
var speed = 1;
var zzoom = 1;
var obj = {
  velX: 0,
  velY: 0,
  locX: 125,
  locY: 125,
  draw: function() {
    if (movementDirection.Left) {
      console.log(-speed * zzoom);
      this.velX = -speed * zzoom;
    } else if (movementDirection.Left != true) {
      this.velX = 0;
    }
    if (movementDirection.Right) {
      this.velX = speed * zzoom;
    } else if(movementDirection.Right != true){
      this.velX = 0;
    }

    if (movementDirection.Up) {
      this.velY = -speed * zzoom;
    } else if(movementDirection.Up != true){
      this.velY = 0;
    }

    if (movementDirection.Down) {
      this.velY = speed * zzoom;
    } else if(movementDirection.Down != true) {
      this.velY = 0;
    }

    if (movementDirection.noMovement) {
      this.velX = 0;
      this.velY = 0;
    }
    this.lPosX = this.lPosX + this.velX;
    this.lPosY = this.lPosY + this.velY;
    context.translate(this.velX, this.velY);
  }
};

(function draw() {
  context.fillStyle = '#FFF';
  context.fillRect(0, 0, 250, 250);
  context.fillStyle = '#000';
  obj.draw();
  context.fillRect(obj.locX, obj.locY, 10, 10);
  requestAnimationFrame(draw);
})();

canvas {
  background: #FFF;
}

<canvas width="250" height="250"></canvas>
&#13;
&#13;
&#13;

这样做的原因是您如何检查他们要去哪个方向。看看这个:

if (movementDirection.Left) {
  // Move the character left, that makes sense
  this.velX = -speed * zzoom;
} else if (movementDirection.Left != true) {
  // Stop if they aren't pressing left
  this.velX = 0;
}

if (movementDirection.Right) {
  // Move the character right
  this.velX = speed * zzoom;
} else if (movementDirection.Right != true) {
  // Stop the player, even if they're moving left!
  this.velX = 0;
}

您在上/下部分看到了同样的问题。要解决此问题,请简化if语句:

if (movementDirection.Left) {
  // Move left
  this.velX = -speed * zzoom;
} else if (movementDirection.Right) {
  // Move right
  this.velX = speed * zzoom;
} else {
  // Don't move horizontally at all
  this.velX = 0;
}

我甚至更进了一步并使用&#34;方向修饰符&#34;拿起键盘输入时:

// When you're getting input
if (holdingLeft) {
  this.xDirection = -1;
} else if (holdingRight) {
  this.xDirection = 1;
} else {
  this.xDirection = 0;
}

然后当你更新他们的位置和速度时:

this.velX = this.xDirection * speed * zzoom;

瞧!它处理向左或向右。按照相同的模式进行垂直移动,你应该是金色的。