卷积地图的一点研究

假设游戏设定如下：

 

玩家沿着2d横版地图在走，走到屏幕的某一点后，玩家虽然在做走的动作，但是实际上是地图在向后走，而玩家不动，以此来保持玩家的视野。

玩家从左向右向右的过程，可以分为以下几个阶段。

第一阶段

假设玩家为this，地图为backgroundLayer，this.vx表示速度，this.direction表示玩家面向的方向，1为向右，-1为向左，那么代码如下

if(this.x < this.posA.x && this.backgroundLayer.x >=0){

              this.x += this.vx*this.direction;

}

第二阶段

此刻玩家已经到达了a点代码如下

else if(this.x >= this.posA.x && this.backgroundLayer.x >= this.posB.x){

              this.backgroundLayer.x -= this.backgroundLayer.moveSpeed*this.direction;

//如果玩家在向右的行进过程中，又向左，那么地图又会开始向右

              if(this.backgroundLayer.x >0){//适当修正地图和人物坐标

                  this.backgroundLayer.x = 0;

                  this.x = this.posA.x - 1;

              }

           }

 

第三阶段

代码如下：

else if(this.backgroundLayer.x < this.posB.x){

              this.x += this.vx*this.direction;//位移随着速度而发生变化

           }

还有一种情况，就是，玩家达到第三阶段后，继续向右走到底，然后又开始往左边走，那么此刻的代码应该如此：

else if(this.x < this.posA.x && this.backgroundLayer.x < 0){

              this.backgroundLayer.x-= this.backgroundLayer.moveSpeed*this.direction;           

              if(this.backgroundLayer.x< this.posB.x){//适当修正地图和人物坐标

                  this.backgroundLayer.x= this.posB.x;

                  this.x = this.posA.x + 1;

              }

           }

 

 

再来思考如果地图上面有敌人，敌人的运动改怎么办，照理说，敌人应该是位于地图上面，这样玩家走动的时候，敌人和地图的走路是正常的。这样做有个弊端，因为玩家和敌人不处于同一图层上，那么计算两者的距离就需要进行坐标转换，看起来有点麻烦，怎么解决这个问题，方法就是，还是让玩家和敌人在同一个图层，但是敌人的位移要加上地图的位移，那么最终代码如下

<span style="white-space:pre">		</span><pre name="code" class="javascript">	//更新
	update:function(enemyArr){
		this.currentEnemyArr = enemyArr;//当前游戏中的敌人		
		if(this.isMoving){
			if(this.x < this.posA.x && this.backgroundLayer.x >=0){
				this.x += this.vx*this.direction;//位移随着速度而发生变化
			}else if(this.x >= this.posA.x && this.backgroundLayer.x >= this.posB.x){
				this.backgroundLayer.x -= this.backgroundLayer.moveSpeed*this.direction;
				if(this.backgroundLayer.x >0){//适当修正地图和人物坐标
					this.backgroundLayer.x = 0;
					this.x = this.posA.x - 1;
				}
				this.moveEnemy();
			}else if(this.backgroundLayer.x < this.posB.x){
				this.x += this.vx*this.direction;//位移随着速度而发生变化
			}else if(this.x < this.posA.x && this.backgroundLayer.x < 0){
				this.backgroundLayer.x -= this.backgroundLayer.moveSpeed*this.direction;				
				if(this.backgroundLayer.x < this.posB.x){//适当修正地图和人物坐标
					this.backgroundLayer.x = this.posB.x;
					this.x = this.posA.x + 1;
				}				
				this.moveEnemy();
			}
			this.vx *= this.friction;//速度随着摩擦力而减少
			if(this.x>=1100){
				this.x = 1100;
			}
			if(this.x<=50){
				this.x = 50;
			}
		}
		this.seekEnemyAndAttack(enemyArr);

	}

<pre name="code" class="javascript">	//使得敌人和地图看起来保持一致
	moveEnemy:function(){
		for(var i in this.currentEnemyArr){
			var enmey = this.currentEnemyArr[i];
			enmey.x -= this.backgroundLayer.moveSpeed*this.direction;
		}
	},