首页 > 解决方案 > 画布上的运动不起作用

问题描述

所以,我从使用 Phaser 转向使用 Canvas 元素制作游戏。

我让地图出现,并实现了一个占位符精灵表,但该移动仅适用于精灵面向的方向。

这是我的代码:

Player.prototype.checkDirection = function () {
var newDrawX = this.drawX,
    newDrawY = this.drawY,//draw specific specific points on x and y coordinates
    newMoveX = this.moveX,
    newMoveY = this.moveY;
    obstacleCollision = false;
if (this.isUpKey) {
    newDrawY -= this.speed;
    this.moveY -= 35;
    this.srcX = 48; //Facing North
    this.srcY = 72;
} else if (this.isDownKey) {
    newDrawY += this.speed;
    this.moveY += 35;
    this.srcX = 48; //Facing South
    this.srcY = 1;
} else if (this.isRightKey) {
    newDrawX += this.speed;
    this.moveX += 31;
    this.srcX = 48; //Facing East
    this.srcY = 36;
} else if (this.isLeftKey) {
    newDrawX -= this.speed;
    this.moveX -= 31;
    this.srcX = 48; //Facing West
    this.srcY = 108;
}

if (!obstacleCollision && !outOfBounds(this, newDrawX, newDrawY)) {
    this.drawX = newDrawX;
    this.drawY = newDrawY;
};

有想法该怎么解决这个吗?

标签: javascripthtml5-canvas

解决方案


我发现了我的问题。

只需删除这个:

&& !outOfBounds(this, newDrawX, newDrawY)

足以让角色移动。我解决了我自己的问题!


推荐阅读