步骤如下:
1.新建Cocos2d-win32工程,工程名为"AnimBear";
2.下载本游戏所需的资源;
这些图像的尺寸是最大分辨率所需的尺寸,将以这些图像来创建不同分辨率所需的尺寸。
3.下载Texture Packer工具,当前为3.1.2版本。拖动资源图片文件到Texture Packer的右边窗口,将会自动加载文件。左边窗口中的Geometry面板,调整Max
size为4096x4096,因为默认尺寸不够满足大小。Layout面板,设置Trim mode为None,不需要移除透明像素。完成之后,如下图所示:
在”Resources“目录下新建文件夹”HDR“。确定Output面板中Data Format选中cocos2d,Data
filename定位到”...\AnimBear\Resources\HDR“路径,文件名为AnimBear.plist。保存之后,Texture file将会自动填充文件名。然后,点击AutoSD设置按钮,下拉选择Presets项为”cocos2d-x
HDR/HD/SD“,点击”Apply“按钮,这使得在发布时能够自动创建和保存多种规则的精灵表单,如下图所示:
最后,点击工具栏按钮”Publish“,将会自动生成精灵表单和纹理文件,如下图所示:
可以用plist Editor Pro打开AnimBear.plist文件,可以看到它由两部分组成——帧和元数据。在帧部分,每一个图像都有一个属性,用来描述位于精灵表单中的包围框。如下图所示:
3.一个简单的动画。打开HelloWorldScene.h文件,添加如下代码:
2 3 4 5 6 |
|
CC_SYNTHESIZE_RETAIN(cocos2d::CCSprite*, _bear, Bear);
CC_SYNTHESIZE_RETAIN(cocos2d::CCAction*, _walkAction, WalkAction); CC_SYNTHESIZE_RETAIN(cocos2d::CCAction*, _moveAction, MoveAction); private: |
2 3 4 5 6 7 |
|
HelloWorld::HelloWorld()
{ _bear = NULL; _walkAction = NULL; _moveAction = NULL; _bearMoving = false; } |
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
|
bool HelloWorld::init()
{ bool bRet = false; do { CC_BREAK_IF(!CCLayer::init()); //1) Cache the sprite frames and texture CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("AnimBear.plist"); //2) Create a sprite batch node //3) Gather the list of frames //5) Create the sprite and run the animation action bRet = true; |
①.缓存精灵帧和纹理。调用CCSpriteFrameCache的addSpriteFramesWithFile方法,传入之前生成的属性列表文件名称。这个方法做了如下事情:
- 从属性列表文件的元数据部分,取出textureFileName的值,作为纹理文件的文件名,在这里为AnimBear.png,载入文件到CCTextureCache纹理缓存中。注意,这里会根据设定的资源搜索路径来自动寻找正确的文件。
- 解析属性列表文件,使用CCSpriteFrame对象来内部地跟踪所有精灵的信息。
②.创建一个精灵批处理节点。创建CCSpriteBatchNode对象,传入了精灵表单图像名称。精灵表单的工作方式如下:
- 创建CCSpriteBatchNode对象,传入包含所有精灵的图像文件的名称,将这个对象添加到场景里面。
- 现在,任何时候创建来自这个精灵表单的精灵,都应当将这个精灵添加到这个CCSpriteBatchNode对象里。只要精灵是来自这个精灵表单的,那么就会正常工作,否则会报错。
- CCSpriteBatchNode代码智能地将CCSprite孩子对象在一次的OpenGL ES调用中进行绘制,而不是多次调用,而这会使得速度快得多。
③.采集帧列表。为了创建帧列表,需要简单地遍历图片的名称(它们被命名为Bear1.png -> Bear8.png,这是一个惯例),然后,从CCSpriteFrameCache里寻找指定名称的精灵帧。请记住,这些应该已经在缓存中,因为之前调用了addSpriteFramesWithFile方法。
④.创建动画对象。通过传入精灵帧列表,创建CCAnimation对象,并指定动画的播放速度。这里使用0.1秒作为帧之间的延迟时间。
⑤.创建精灵和运行动画动作。以某一帧来创建精灵(即熊),放置在屏幕中心。传入CCAnimation对象,创建CCAnimate对象,并让熊运行这个动作。最后,将熊添加到精灵表单里。注意,如果没有添加到精灵表单里,而是添加到层里的话,就不会得到性能的优化。
为了能在不同分辨率下,加载不同的资源,需要先设置下分辨率适配,打开AppDelegate.cpp文件,在applicationDidFinishLaunching函数里面,最上面代码修改为:
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
|
// initialize director
CCDirector *pDirector = CCDirector::sharedDirector(); pDirector->setOpenGLView(CCEGLView::sharedOpenGLView()); CCSize screenSize = CCEGLView::sharedOpenGLView()->getFrameSize(); CCSize designSize = CCSizeMake(480, 320); |
4.更改熊行走的方向。通过触摸屏幕,来控制熊的移动。打开HelloWorldScene.cpp文件,在init函数里面,注释掉代码this->getBear()->runAction(this->getWalkAction());,这样一开始熊就不会移动。然后在代码最后添加如下代码:
|
|
this->setTouchEnabled(true);
|
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 |
|
void HelloWorld::registerWithTouchDispatcher()
{ CCDirector::sharedDirector()->getTouchDispatcher()->addTargetedDelegate(this, 0, true); } bool HelloWorld::ccTouchBegan(CCTouch *pTouch, CCEvent *pEvent) void HelloWorld::ccTouchEnded(CCTouch *pTouch, CCEvent *pEvent) //2) Set the desired velocity //3) Figure out the amount moved in X and Y //4) Figure out the actual length moved //5) Figure out how long it will take to move //6) Flip the animation if necessary if (!_bearMoving) this->getBear()->runAction(this->getMoveAction()); void HelloWorld::cleanup() void HelloWorld::bearMoveEnded() |
- ①确定触摸位置。转换触摸点到本地节点坐标。
- ②设置期望的速度。设置熊的移动速度。
- ③计算在x轴和y轴上的移动距离。
- ④计算移动的真实长度。
- ⑤计算移动的所需时间。
- ⑥如有必须的话,则翻转动画。通过移动距离的x轴来判断熊是向左还是向右移动。只需设置水平翻转,运行的动画也会跟着翻转。
- ⑦运行适当的动作。首先,停止现有的移动动作,因为可能半途改变熊的目的地。接着,如果已经在移动了,就继续保持行走动作。最后,创建移动动作,指定移动的位置、移动的时间,和一个动作完成时的回调,这个回调用来停止行走动作。变量_bearMoving用来判断是否正在移动中。
编译运行,触摸屏幕来移动熊,如下图所示:
参考资料:
非常感谢以上资料,本例子源代码附加资源下载地址:http://download.csdn.net/detail/akof1314/5914987
如文章存在错误之处,欢迎指出,以便改正。