PVZ系列三 | 僵尸

僵尸的生成逻辑与太阳的生成逻辑十分的相似。

效果预览

• 每隔一段时间随机一行生成一个僵尸
  
  僵尸遇到植物后开始吃菜，吃完后继续往前走。
  

实现过程详解

第一步：生成僵尸

其中，addZombie()函数是我们放在main函数中执行的。

//
// 初始化僵尸
//
function addZombies(){
	var zombieTimer = setInterval(newZombie, 3000);
}

//
// 增加一个新的僵尸
//
function newZombie(TimerEvent){
	var zombie = new lib.zombieMc();// 构造僵尸
	totalZombies++;
	zombieContainer.addChild(zombie);// 添加僵尸
	zombie.zombieRow=Math.floor(Math.random()*5);// 随机行数
	zombie.name="zombie_"+totalZombies;//僵尸取名
	zombiesArray[zombie.zombieRow].push(zombie.name);// 增加第row行的僵尸
	zombie.x=1000;// 把僵尸放在屏幕的右边
	zombie.y=zombie.zombieRow*gridHeight+borderTop;//把僵尸放到对应的行上
}

这样，每隔一会儿我们就会得到一只停在原地的僵尸。

接下来，我们会在每一帧遍历僵尸，让他们走动起来或者吃东西。

让僵尸前进！！

function onEnterFrm(){
	var i;
	//
	// 僵尸吃菜
	//
	var zombieColumn;
	for (i=0; i<zombieContainer.numChildren; i++) {//遍历僵尸
		movingZombie=zombieContainer.getChildAt(i);
		zombieColumn = Math.floor((movingZombie.x-borderLeft)/gridWidth);// 得到僵尸所在的列
		//console.log("zombieColumn"+zombieColumn);
		// 判断是否有植物在同一块中
		if (zombieColumn<0||zombieColumn>8||plantsArray[movingZombie.zombieRow][zombieColumn]==0) {
			movingZombie.x-=0.5;// moves each zombie left by 1/2 pixels
		} else {
			// 僵尸打人
			var attackedPlant = plantContainer.getChildByName("plant_"+movingZombie.zombieRow+"_"+zombieColumn);
			attackedPlant.alpha-=0.01;// 植物逐渐死亡
			// 植物死了
			if (attackedPlant.alpha < 0) {
				plantsArray[movingZombie.zombieRow][zombieColumn] = 0;//removes the plant from the array
				plantContainer.removeChild(attackedPlant);//removes the plant Display Object from Display List
			}//if
		}//else
	}//for
}

OK，僵尸碰到植物就会把它吃掉了！
关于僵尸动画的替换，我们在后面单独讲。