Cocos2dx游戏开发系列笔记12：一个横版过关游戏Demo
懒骨头（http://blog.csdn.net/iamlazybone QQ： ）
旁边一直在放着台湾的金马奖
将了一群人在做喜欢的事情努力拼搏最后实至名归的故事
骨头也希望有天能优秀到被自己钦佩的人所关注
来自游戏开发基友群听雨分享的例子，一个横版过关游戏，有带简单ai的敌人，有横版的地图，有操控摇杆，主角的攻击效果，有很多新鲜的东西，开搞！
很多东西看起来简单，真要自己写就觉得无从下手了，比如主角动画。
这个主角在静止和走动时都有动画：
CCSpriteFrameCache* cache = CCSpriteFrameCache::sharedSpriteFrameCache();
CCSprite::createWithSpriteFrameName(hero_idle_00.png);
this-&retain();
char str[64] = {0};
CCArray* animFrames = new CCArray(10);
for (int i = 0; i & 6; ++i) {
sprintf(str, hero_idle_%02d.png, i);
CCSpriteFrame* frame = cache-&spriteFrameByName(str);
animFrames-&addObject(frame);
CCAnimation* idleAnimation = CCAnimation::createWithSpriteFrames(animFrames,1.0f/12.0f);
mIdleAction =
CCRepeatForever::create(CCAnimate::create(idleAnimation));
mIdleAction-&retain();
先用动画的第一帧初始化一个CCSprite，然后根据帧数创建一个CCArray。
然后一个循环把 CCSpriteFrame 添加到刚才的CCArray，接着使用CCArray初始化一个CCAnimation，
然后用CCAnimation初始化 CCRepeatForever 。看起来好啰嗦。
Hero.cpp这个主角类就是一些初始化，只在构造函数里，初始化各种动画：站立，跑步，出拳，受伤等。
类似的，Robot.cpp也是只有初始化。
这两个精灵的其他东西都在ActionSprite.cpp里：
ActionSprite.cpp类：
ActionSprite();
virtual bool init();
void idle();
void attack();
void hurtWithDamage(float damage);
void knockout();
void walkWithDirection(CCPoint direction);
virtual void update(float dt);
//protected :
CCAction* mIdleA
CCAction* mAttackA
CCAction* mWalkA
CCAction* mHurtA
CCAction* mKnockedOutA
ActionState mActionS
float mWalkS
float mHitP
CCPoint mV
CCPoint mDesiredP
float mCenterToS
float mCenterToB
BoundingBox mHitB
BoundingBox mAttackB
BoundingBox createBoundingBoxWithOrigin(CCPoint origin, CCSize size);
void transformBoxes();
void setPosition(const CCPoint& pos);
方法包括：站立、受伤、行走、被击毙方法等，还有这几个动作相关的CCAction。
属性有：行走速度，攻击，生命。还有速度，目的地，
还有几个矩形，用来判断攻击。
其中的行走方法：
void ActionSprite::walkWithDirection(CCPoint direction)
if (mActionState == kActionStateIdle) {
this-&stopAllActions();
this-&runAction(mWalkAction);
mActionState = kActionStateW
if (mActionState == kActionStateWalk) {
mVelocity =
ccp(direction.x * mWalkSpeed, direction.y * mWalkSpeed);
if (mVelocity.x &= 0)
//this-&setScaleX(1.0f);
this-&setFlipX(false);
//this-&setScaleX(-1.0f);
this-&setFlipX(true);
如果是站立状态，首先停止所有动作，然后开始行走动作，并把标记位改为行走（kActionStateWalk）
并且计算速度，根据速度的正负值来确定是否水平翻转，这是个横版过关游戏，行走只有两个状态。
受伤方法：
void ActionSprite::hurtWithDamage(float damage)
if (mActionState != kActionStateKnockedOut) {
this-&stopAllActions();
this-&runAction(mHurtAction);
mActionState = kActionStateH
mHitPoints -=
if (mHitPoints &= 0.0f) {
this-&knockout();
如果非死亡状态，停止其他动画，开始受伤动画，改状态，减HP，如果HP&0，宣布死亡。
一个比较难理解的方法：
void ActionSprite::transformBoxes()
float xfactor = (this-&isFlipX() ? -1 : 1);
float xfactor2 = (this-&isFlipX() ? 1 : 0);
float yfactor = (this-&isFlipY() ? -1 : 1);
float yfactor2 = (this-&isFlipY() ? 1 : 0);
mHitBox.actual.origin = ccpAdd(this-&getPosition(),
ccp(mHitBox.original.origin.x * xfactor -
mHitBox.original.size.width * xfactor2,
mHitBox.original.origin.y * yfactor -
mHitBox.original.size.height * yfactor2));
mHitBox.actual.size = CCSizeMake(
mHitBox.original.size.width,
mHitBox.original.size.height);
mAttackBox.actual.origin = ccpAdd(this-&getPosition(),
ccp(mAttackBox.original.origin.x * xfactor -
mAttackBox.original.size.width * xfactor2,
mAttackBox.original.origin.y * yfactor -
mAttackBox.original.size.height * yfactor2));
mAttackBox.actual.size = CCSizeMake(
mAttackBox.original.size.width,
mAttackBox.original.size.height);
更新矩形：根据精灵的方向，来更改受伤矩形，攻击矩形。
如下图，当主角朝前或朝后时，攻击范围的改变如下，上面的方法就是来处理这个问题的。
(window.slotbydup=window.slotbydup || []).push({
id: '2467140',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467141',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467142',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467143',
container: s,
size: '1000,90',
display: 'inlay-fix'
(window.slotbydup=window.slotbydup || []).push({
id: '2467148',
container: s,
size: '1000,90',
display: 'inlay-fix'今天看啥 热点：
Cocos2d-x使用Cocos Studio制作界面并应用---之游戏开发《赵云要格斗》（11），cocos2dstudio
& & & & &这里是Evankaka的博客，欢迎大家前来讨论与交流～～～～～～
& & &&&&转载请注明出处http://blog.csdn.net/evankaka/article/details/
& & & & 本文主要讲了怎么用Cocos Studio制做登陆界面，并导出成Json文件，直接在coco2d-x中来调用。这样做的好处就是界面和代码是分离的，你如果想改界面的话，就可以直接在外面用Cocos
Studio来修改，只要不修改按钮之类的名称，你的功能代码完全不用修改，只要将导出的Json文件和图片资源替换下就OK了，这样子的开发效率将会大大提高！
cocos2d-x版本：2.2.5
工程环境：windows7+VS2010
打开方式：将工程放在cocos2d-x安装目录下的project文件夹下用VS打开
本文效果：
一、Cocos Studio制做登陆界面
& & & &首先，这里一定要注意Cocos2d-x和CocosStudio对应的版本，要不Cocos2d-x可能会用不了你制作的界面或动画等。
& &版本对应列表：&
Studio2.x&
CocosStudio版本 & & &对应Cocos2d-x版本
& &JS版本 & && &备注&
v2.1beta & & & & & & && & & & & &v3.4beta0 & & & && & & & &None & & & & && &已分离出reader，可以将reader拉取到其他版本cocos2d-x，以支持新版本的CocosStudio&
v2.0.6 & & & & & & && & & & & & & &v3.3final & && & & & & & & &None&&
v2.0.5&& & & & & && & & & & & & & &v3.3rc2 && & & & & & & & & &None&
v2.0.2& & & & & & && & & & & & & & v3.3rc2 & && & & & & & & & &None&
v2.0beta0& & & & & & && & & & & v3.3rc0 & & & & && & & & & &v3.1&
Studio1.x&
CocosStudio版本
PS：一般来说高版本2dx能加载低版本的Studio1.x数据，高版本的Studio1.x数据不一定能够被低版本的2d-x加载
& &这里要注意，你是什么版本的就下什么版本的，要不可能无法调用。。Cocos Studio自己去找下资源然后安好。基本没啥问题。
下面我们来开始一个简单的教程吧，
1.首先，打开Cocos Studio，然后选择界面编辑器，这里还可以选择其它的，比如动画、场景
2.然后这是UI Editor的界面，里面有一些范例，你也可以直接拿去用，或者自己把图片改下
3.点击文件，新建
4.点击画布，更改界面大小为你的游戏的界面的大小
5.然后直接将要用到的图片，背景图片和按钮图片，拖到右上角的Resources。如下：
6.然后我们来看下如何更改界面的背景，其实就是直接拖图片，记得要先选好panel_14：
7.然后是效果，同时要在上面放按钮，并加图片，这里要记得图片的名字：命名为Begin：
8.按照上面的流程，把图片都放上去好了之后，依次添加其它按钮，并将它们对齐
9.最后一步，文件-》导出项目
10.导出的东西就在你这个项目Export文件夹下：
这是导出选择大图的情况：
这是导出时选择小图的情况：
看到了吧。图片少的时候，这就是导出的区别了，图片多的时候还是推荐用导出大图的，要不会有一大堆的图片。
这样子，界面就做好了，我们可以直接在cocos2dx中来调用了。
二、Cocos2dx使用Json文件
1.在这里，我们随便新建一个工程,先把上面的资源Json、图片所有都放到工程的Resource文件夹下：
2.在新建工程HelloWorldScene.h中添加头文件
&span style=&font-size:18color:#333333;&&#include &cocos2d.h&
#include &cocos-ext.h&
USING_NS_CC;
USING_NS_CC_EXT;
//重点要记得，要不会出现error C2065: “SEL_TouchEvent”: 未声明的标识符&/span&并且添加按钮的回调事件
&span style=&font-size:18color:#333333;&&void touchButton(cocos2d::CCObject* obj,gui::TouchEventType type);&/span&
3.然后在Init（）函数中增加：
//加载cocos studio制作的界面
gui::TouchGroup* ul = gui::TouchGroup::create();
gui::Layout* equipe_root =dynamic_cast&gui::Layout*&(GUIReader::shareReader()-&widgetFromJsonFile(&MyLogin_1.ExportJson&));
ul-&addWidget(equipe_root);
this-&addChild(ul, 2);
//给开始按钮添加事件监听
gui::Button *Btn_Begin = dynamic_cast&gui::Button*&(equipe_root-&getChildByName(&Begin_Game&)); //Begin_Game为在Cocos Studio中定义的按钮的名称
Btn_Begin-&addTouchEventListener(this,toucheventselector(HelloWorld::touchButton));
4.回调函数的实现
void HelloWorld::touchButton(cocos2d::CCObject* obj,gui::TouchEventType type)
switch (type)
case gui::TouchEventType::TOUCH_EVENT_BEGAN:
CCLOG(&Button Down&);//按钮按下
case gui::TouchEventType::TOUCH_EVENT_MOVED:
CCLOG(&Button Down and Mouse move&);//按钮按下移动
case gui::TouchEventType::TOUCH_EVENT_ENDED:
CCLOG(&Button Up&);//放开按钮
case gui::TouchEventType::TOUCH_EVENT_CANCELED:
CCLOG(&Button Cancel&);//取消按钮
然后我们来看看效果：
&这就是一个简单的例子，界面制作很简单，而且以后要更换图片什么的也很方便，开发的效果大大提高。这一讲就到这里了，下一讲我们将把这个应用到我们的游戏中去。
这就是下一讲的效果：
相关搜索：
相关阅读：
相关频道：
Android教程最近更新&>&&>&&>&&>&如何制作一个横版格斗过关游戏 Cocos2d-x 2.1.4
如何制作一个横版格斗过关游戏 Cocos2d-x 2.1.4
上传大小：21.32MB
有关如何制作一个地下城勇士的格斗过关游戏，若在mac使用cocos2d-x的网友，不妨下载玩下。
综合评分：4.1（8位用户评分）
所需积分：0
下载次数：98
审核通过送C币
创建者：liuyujie0514
创建者：qq_
课程推荐相关知识库
上传者其他资源上传者专辑
移动开发热门标签
VIP会员动态
android服务器底层网络模块的设计方法
所需积分：0
剩余积分：720
您当前C币：0
可兑换下载积分：0
兑换下载分：
兑换失败，您当前C币不够，请先充值C币
消耗C币：0
你当前的下载分为234。
如何制作一个横版格斗过关游戏 Cocos2d-x 2.1.4
会员到期时间：
剩余下载次数：
你还不是VIP会员
开通VIP会员权限，免积分下载
你下载资源过于频繁，请输入验证码
你下载资源过于频繁，请输入验证码
您因违反CSDN下载频道规则而被锁定帐户，如有疑问，请联络:!
若举报审核通过，可奖励20下载分
被举报人：
举报的资源分：
请选择类型
资源无法下载
资源无法使用
标题与实际内容不符
含有危害国家安全内容
含有反动色情等内容
含广告内容
版权问题，侵犯个人或公司的版权
*详细原因：