本文实践自 Allen Tan 的文章《How To Make A Side-Scrolling Beat ‘Em Up Game Like Scott Pilgrim with Cocos2D – Part 1》，文中使用Cocos2D，我在这里使用Cocos2D-x 2.0.4进行学习和移植。
在这篇文章。将会学习到怎样制作一个简单的横版格斗过关游戏。在这其中，学习怎样跟踪动画状态、碰撞盒、加入方向键、加入简单敌人AI和很多其他其他的。
过程例如以下：
1.新建Cocos2d-win32project，project名为"PompaDroid"，去除"Box2D"选项，勾选"Simple Audio Engine in Cocos Denshion"选项。
2.加入游戏场景类GameScene，派生自CCScene类。加入GameLayer类和HudLayer类，派生自CCLayer类。
删除HelloWorldScene.h和HelloWorldScene.cpp文件。
3.文件GameScene.h代码例如以下：
文件GameScene.cpp代码例如以下：
4.HudLayer类添加一个方法：
和GameLayer类添加一个方法：
5.改动AppDelegate.cpp文件。代码例如以下：
6.编译执行，此时仅仅是空空的界面。
7.下载本游戏所需资源。将资源放置"Resources"文件夹下；
8.用Tiled工具打开pd_tilemap.tmx。就能够看到游戏的整个地图：
地图上有两个图层：Wall和Floor，即墙和地板。去掉每一个图层前的打钩，能够查看层的组成。你会发现下数第四行是由两个图层一起组成的。每一个tile都是32x32大小。可行走的地板tile位于下数三行。
9.打开GameLayer.h文件，加入例如以下代码：
打开GameLayer.cpp，在构造函数，加入例如以下代码：
加入例如以下代码：
对全部图层进行setAliasTexParameters设置，该方法是关闭抗锯齿功能，这样就能保持像素风格。
10.编译执行，能够看到地图显示在屏幕上。例如以下图所看到的：
11.创建英雄。
在大多数2D横版游戏中，角色有不同的动画代表不同类型的动作。
我们须要知道什么时候播放哪个动画。
这里採用状态机来解决问题。状态机就是某种通过切换状态来改变行为的东西。单一状态机在同一时间仅仅能有一个状态，但能够从一种状态过渡到还有一种状态。在这个游戏中。角色共同拥有五种状态，空暇、行走、出拳、受伤、死亡，例如以下图所看到的：
为了有一个完整的状态流，每一个状态应该有一个必要条件和结果。
比如：行走状态不能突然转变到死亡状态，由于你的英雄在死亡前必须先受伤。
12.加入ActionSprite类，派生自CCSprite类，ActionSprite.h文件代码例如以下：
打开ActionSprite.cpp文件，构造函数例如以下：
各个方法实现临时为空。以上代码声明了基本变量和方法，能够分为下面几类：Actions：这些是每种状态要运行的动作。
这些动作是当角色切换状态时，运行精灵动画和其它触发的事件。
States：保存精灵的当前动作/状态。使用ActionState类型。这个类型待会我们将会进行定义。
Attributes：包括精灵行走速度值，受伤时降低生命点值。攻击伤害值。
Movement：用于计算精灵怎样沿着地图移动。
Measurements：保存对精灵的实际图像实用的測量值。须要这些值，是由于你将要使用的这些精灵画布大小是远远大于内部包括的图像。
Action methods：不直接调用动作。而是使用这些方法触发每种状态。
Scheduled methods：不论什么事须要在一定的时间间隔进行执行，比方精灵位置和速度的更新，等等。
新建一个头文件Defines.h。代码例如以下：
简要说明下：
①.定义了一些便利的宏，如直接使用SCREEN获取屏幕大小；
②.定义了一些便利的函数，随机返回整型或者浮点型；
③.定义ActionState类型，这个是ActionSprite可能处在不同状态的类型枚举；
④.定义BoundingBox结构体。将用于碰撞检測。
打开GameLayer.h文件。加入例如以下代码：
打开GameLayer.cpp文件。在init函数里面加入例如以下代码：
载入精灵表单，创建一个CCSpriteBatchNode。这个精灵表单包括我们的全部精灵。它的z值高于CCTMXTiledMap对象。这样才干出如今地图前。
加入Hero类，派生自ActionSprite类，加入例如以下代码：
Hero类的init函数的实现例如以下所看到的：
我们用初始空暇精灵帧创建了英雄角色，配备了一个CCArray数组包括全部的属于空暇动画的精灵帧，然后创建一个CCAction动作播放来这个动画。以每秒12帧的速率进行播放。接下去，为英雄设置初始属性，包括精灵中心到边究竟部的值。例如以下图所看到的：
英雄的每一个精灵帧都在280x150像素大小的画布上创建，但实际上英雄精灵仅仅占领这个空间的一部分。所以须要两个測量值，以便更好的设置精灵的位置。须要额外的空间，是由于每一个动画精灵绘制的方式是不同的，而有些就须要很多其它的空间。
打开GameLayer.h文件，加入头文件声明：
GameLayer类加入例如以下代码：
打开GameLayer.cpp文件，在构造函数加入例如以下代码：
在init函数this->addChild(_actors, -5);后面加入例如以下代码：
加入initHero方法，代码例如以下：
创建了一个英雄实例，加入到了精灵表单，并设置了设置。调用idle方法。让其处于空暇状态，执行空暇动画。返回到ActionSprite.cpp文件，实现idle方法。代码例如以下：
这个idle方法仅仅有当ActionSprite不处于空暇状态才干调用。当它触发时，它会运行空暇动作，改变当前状态到kActionStateIdle，而且把速度置零。
13.编译执行，能够看到英雄处于空暇状态。
例如以下图所看到的：
14.出拳动作。打开Hero.cpp文件，在init函数idle animation后面，加入例如以下代码：
打开ActionSprite.cpp文件，实现attack方法，代码例如以下：
英雄仅仅有在空暇、攻击、行走状态才干进行出拳。确保英雄正在受伤时、或者死亡时不能进行攻击。为了触发attack方法，打开GameLayer.cpp文件，在init函数加入例如以下代码：
重载ccTouchesBegan方法，代码例如以下：
15.编译执行。点击屏幕进行出拳。例如以下图所看到的：
16.创建8个方向的方向键。
我们须要创建虚拟的8个方向的方向键来让英雄在地图上进行移动。
加入
SimpleDPad类，派生自CCSprite类，SimpleDPad.h文件代码例如以下：
对以上的一些声明。解释例如以下：
radius：圆形方向键的半径。
direction：当前所按下的方向。这是一个矢量。(-1.0, -1.0)是左下方向，(1.0, 1.0)是右上方向。
delegate：方向键的托付，兴许进行介绍。
isHeld：布尔值表示玩家触摸着方向键。
对于SimpleDPad类，使用了托付模式。意味着一个托付类(并不是SimpleDPad)，将会处理由被托付类(SimpleDPad)启动的任务。在某些你指定的点上，主要是当涉及到处理不论什么游戏相关的东西。SimpleDPad将会将职责传递给托付类。这使得SimpleDPad无需知道不论什么游戏逻辑，从而同意你在开发不论什么其它游戏时，能够进行重用。
例如以下图所看到的：
当SimpleDPad检測到在方向键内的触摸，它会计算触摸的方向，然后发送消息到托付类指明方向。在这之后的不论什么事情都不是SimpleDPad所关心的了。为了实施这个模式。SimpleDPad须要至少了解其托付的有关信息。特别是将触摸方向传递给托付的方法。
这是还有一种设计模式：协议。
能够看到SimpleDPad的托付定义了所需的方法。在这样的方式中，SimpleDPad强制其托付有三个指定的方法，以便确保每当它想传递东西放到托付中时，它能调用这些方法中的不论什么一种。其实，SimpleDPad也遵循一种协议，即CCTargetedTouchDelegate。当SimpleDPad被触摸时，进行处理触摸事件，而GameLayer将不会得到触摸。
否则的话，在触摸方向键的时候，英雄就会出拳攻击，显然。这不是希望看到的。打开SimpleDPad.cpp文件。加入例如以下代码：
以上方法中，onEnterTransitionDidFinish注冊SimpleDPad托付类，onExit移除SimpleDPad托付类，update方法是当方向键被触摸时，传递方向值到托付类。ccTouchBegan方法检測触摸位置是否在方向键圆内。假设是，则将isHeld置为true。并更新方向值。返回true以拥有触摸事件优先权。ccTouchMoved当触摸点移动时。更新方向值。ccTouchEnded将isHeld置为false。重置方向，并通知托付触摸结束。updateDirectionForTouchLocation方法计算触摸点到方向键中心距离值，转换成角度，得到正确的方向值，然后传递值到托付。
打开HudLayer.h文件。加入头文件声明：
加入例如以下代码：
打开HudLayer.cpp文件，加入例如以下代码：
以上代码实例化SimpleDPad，而且加入到HudLayer上。如今GameScene同一时候控制GameLayer和HudLayer，但有时候想直接通过HudLayer訪问GameLayer。打开GameLayer.h文件，加入头文件声明：
将GameLayer类声明改动成例如以下：
并加入下面声明：
以上方法的实现临时为空。
这样我们就在GameLayer中加入了HudLayer的引用，同一时候还让GameLayer遵循SimpleDPad所创建的协议。打开GameScene.cpp文件，在init函数this->addChild(_hudLayer, 1);后面，加入例如以下代码：
17.编译执行，能够看到左下角的虚拟方向键，例如以下图所看到的：
别试着压下方向键，英雄不会有不论什么反应。由于还未实现协议方法，这在第二部分将完毕。
參考资料：
1.How To Make A Side-Scrolling Beat ‘Em Up Game Like Scott Pilgrim with Cocos2D – Part 1/24155/how-to-make-a-side-scrolling
2.怎样使用cocos2d制作类似Scott Pilgrim的2D横版格斗过关游戏part1（翻译）/s/blog_4b55f6860101a9b7.html
3.怎样使用Cocos2d-x做一DNF类的游戏-part1/jyzgo/article/details/8471306
很感谢以上资料，本样例源码附加资源下载地址：/detail/akof1314/5038013
如文章存在错误之处。欢迎指出，以便改正。
