PVZ系列六 | 僵尸动画转换

这篇将会用影片剪辑内部跳转的方式转变僵尸的状态。

效果预览

修改僵尸影片剪辑

我们需要在一个影片剪辑内把会用到的僵尸动画都包含进去。
像这样↓

整个影片剪辑包含了三段动画，除去死亡动画，其余动画片段的最后一帧均包含了this.gotoAndPlay()语句，用来形成动画循环。示意图如下：

所以，我们对于僵尸显示效果的转换只需要在他需要转换时跳转到相应状态的头一帧就好了。

另一种思路

把不同状态放在不同的图层，转换时控制图层的可见与不可见。

怎么把不同动画放到同一个影片剪辑

把需要用到的动画全部导入到库里。
举个例子，到ZombieAttack_gif中，拷贝对应的图层，然后在zombieMc中粘贴图层。

有一个坑

Animate2019 在进行影片剪辑内部跳转时会出问题，我们需要在编辑影片剪辑时，按下ctrl+j，在文档设置中把高级图层的勾选框取消掉。

新建僵尸时增加一些新的属性

//
// 增加一个新的僵尸
//
function newZombie(TimerEvent) {
	var zombie = new lib.zombieMc(); // 构造僵尸
	totalZombies++;

	zombie.blood = 10;
	zombie.isDead = false;
	zombie.isAttacking = false;
	zombie.isWalking = true;
	zombie.zombieRow = Math.floor(Math.random() * 5); // 随机行数
	zombie.name = "zombie_" + totalZombies; //僵尸取名
	zombie.x = 1000; // 把僵尸放在屏幕的右边
	zombie.y = zombie.zombieRow * gridHeight + borderTop; //把僵尸放到对应的行上

	zombiesArray[zombie.zombieRow].push(zombie.name); // 增加第row行的僵尸
	zombieContainer.addChild(zombie); // 添加僵尸
}

修改遍历僵尸的函数片段

	//
	// 僵尸状态管理
	//
	var zombieColumn;
	for (i = 0; i < zombieContainer.numChildren; i++) { //遍历僵尸

		movingZombie = zombieContainer.getChildAt(i);//得到僵尸
		zombieColumn = Math.floor((movingZombie.x - borderLeft) / gridWidth); // 得到僵尸所在的列

		//先判断是否死亡（细细品品为啥这个先）
		if (movingZombie.blood < 8) {
			movingZombie.isDead = true;
			movingZombie.isAttacking = false;
			movingZombie.isWalking = false;
		}
		//如果没死亡，并且格子里没有植物
		else if (zombieColumn < 0 || zombieColumn > 8 || plantsArray[movingZombie.zombieRow][zombieColumn] == 0) {
			movingZombie.isWalking = true;
			movingZombie.isDead = false;
			movingZombie.isAttacking = false;
			
			movingZombie.x -= 0.5; 
		}
		//没死亡，碰到植物
		else {
			movingZombie.isAttacking = true;
			movingZombie.isWalking = false;
			movingZombie.isDead = false;
			
			var attackedPlant = plantContainer.getChildByName("plant_" + movingZombie.zombieRow + "_" + zombieColumn);
			attackedPlant.alpha -= 0.01; // 植物逐渐死亡
			// 植物死了
			if (attackedPlant.alpha < 0) {
				plantsArray[attackedPlant.plantRow][attackedPlant.plantCol] = 0; //removes the plant from the array
				plantContainer.removeChild(attackedPlant); //removes the plant Display Object from Display List
			}
		}

		
		
		if(movingZombie.isWalking && movingZombie.currentFrame > 77){
			movingZombie.gotoAndPlay(0);
		};
		if(movingZombie.isAttacking && (movingZombie.currentFrame<78 || movingZombie.currentFrame>142)){
			movingZombie.gotoAndPlay(78);
		};
		if(movingZombie.isDead && movingZombie.currentFrame <142 ){
			movingZombie.gotoAndPlay(143);
		};
		
		//判断死亡移除
		if(movingZombie.currentFrame == movingZombie.totalFrames-1){
			zombiesArray[movingZombie.zombieRow].splice(zombiesArray[movingZombie.zombieRow].indexOf(movingZombie.name), 1);
			zombieContainer.removeChild(movingZombie); // 移除显示列表
		}

	}

结构如下：

1. 判断当前僵尸处于什么状态：isDead isWalking isAttacking。
2. 判断动画是否对应状态，不是的话就跳转。
3. 判断僵尸该不该移除。