Phaser实战系列教程第二课，以飞机大战为素材，讲述了Phaser中精灵的使用，定位技巧，逐帧动画和渐变动画的使用技巧，介绍了Phaser中的物理引擎，详细讲述了Arcade，最后介绍了Group的用法和技巧！
目录：
l 精灵、按钮、定位、拖动
l 逐帧动画和渐变动画
l Arcade 物理引擎
l Group 的用法
Phaser 游戏中的精灵
Image ： game.add.image ，可以旋转，缩放，裁剪，响应输入，但是没有物理属性和动画效果。
Sprite ： game.add.sprite ，可以旋转，缩放，裁剪，有物理属性，可以响应输入，添加动画以及和相机之间交互。
TileSprite ： game.add.tileSprite ，纹理平铺，主要用来做背景，背景滚动等。
调用原型： game.add.tileSprite(x, y, width, height, key)
Button ： game.add.button ，按钮。
调用原型： game.add.button(x, y, key, callback, callbackContext, overFrame, outFrame, downFrame, upFrame)
最后四个参数分别是， hover 时，鼠标在 button 外时，鼠标按下 button 时，鼠标抬起时的帧索引，例如：
game.add.button(30, 300, 'replaybutton', this.onReplayClick, this, 0, 0, 1);
精灵定位，我们推荐尽量使用相对定位，比如：
game.add.image(12, game.height - 16, 'copyright');
位于游戏区域底部，我们用 game.height – 16 ，是相对于整个游戏进行定位。
飞机的拖动处理，十分简单，只需要两句代码：
this.myplane.inputEnabled = true;
this.myplane.input.enableDrag(false);
逐帧动画和渐变动画
逐帧动画的使用示例：
this.myplane = game.add.sprite(100, 100, 'myplane');
this.myplane.animations.add('fly');
this.myplane.animations.play('fly', 12, true);
注意，这里我的飞机资源是下图
而且加载的时候，用的是 spritesheet
game.load.spritesheet('myplane', 'assets/myplane.png', 40, 40, 4);
所以在制作逐帧动画的时候就非常简单。
如果要让精灵停在某一帧，只需要设置它的 frame ， player.frame = 4;
animations.add 还有一些其他参数，可以参考文档
渐变动画的使用示例：
game.add.tween(this.myplane).to({y: game.height - 40}, 1000, Phaser.Easing.Sinusoidal.InOut, true);
tween 动画的本质，其实是用某一个函数去改变一个数值，先看文档：
例子中，它改变的就是 this.myplane.y 的值，把它以一种渐变的方式变成了 game.height – 40 。
还可以在动画完成之后，去执行自己的回调，比如：
anim.onComplete.add(this.gotoOver, this);
物理引擎
Arcade ：最简单，只能进行矩形碰撞，效率最高
Ninja ：比 Arcade 好点，比 P2 差点
P2 ：可以实现复杂碰撞，功能全面
这次我们先介绍 Arcade ：
首先，开启物理系统， game.physics.startSystem(Phaser.Physics.ARCADE);
然后，开启一个精灵的物理属性， game.physics.arcade.enable(this.myplane);
或者开启一个组的物理属性：
this.mybullets = game.add.group();
this.mybullets.enableBody = true;
最后，我们在 update 中进行碰撞检测：
只检测不进行碰撞
game.physics.arcade.overlap(this.mybullets, this.enemy1.enemys, this.enemy1.hitEnemy, null, this.enemy1);
或者进行碰撞
game.physics.arcade.collide(stars, platforms);
可以精灵与精灵碰，可以精灵与组碰，可以组与组碰，还可以组内碰撞。
Group 的使用
为什么要用组？在这个案例中，我们是为了方便我们的碰撞检测，更是为了使用对象池的思想进行资源的重复利用。
创建组， game.add.group();
批量设置组内元素属性：
this.mybullets.setAll('outOfBoundsKill', true);
this.mybullets.setAll('checkWorldBounds', true);
饿汉式：一次创建足够多的元素
this.mybullets.createMultiple(50, 'mybullet');
懒汉式：用的时候从 group 中取，如果取不到，再新建一个，放入 group
var enemy = this.groups["enemy"].getFirstExists(false);
if(!enemy) {
enemy = new GameTank.Enemy(this, position, 'enemy', 'enemy', {
speed: (tankType == 1) ? 200 : 100,
award: award,
type: tankType
});
} else {
enemy.rebirth(position, {
speed: (tankType == 1) ? 200 : 100,
award: award,
type: tankType
});
}转载请注明出处：http://HdhCmsTestphaser-china测试数据/tutorial-detail-11.html