动画是游戏中最重要的表现部分,本篇仅仅是初步学习大部分动画的用法。没有什么原理性的东西,可是样例有非常多,假设有不熟的地方要练一下。 特别是Spawn和Sequence的组合使用,什么时候使用Spawn,什么使用使用Sequence,怎么在它们之间相互嵌套对方。用光你的脑细胞尽力的去折磨这几个函数吧!

做出尽可能多的绚丽的组合!

动画方法

动画的方法都在Node中,它的子类包含Layer、Sprite、MenuItem等。
runAction 启动动画
stopAction 停止动画
stopActionByTag 依据tag停止动画
……

动画原理

创建好动作animation,在须要运行动作的地方运行runAction来对其加入动画。
动画原理暂不做深入研究,后面做项目完好。


经常使用动画

Fade(In, Out)
Move(To,By)
Jump(To,By)

eg:
使某个精灵随机移动到屏幕上的某个点(注意均速运动)
游戏中有二级跳,怎样实现

Blink 闪烁
Sequence 组合序列。动作依次运行,注意參数以NULL结尾。
DelayTime 延时运行

eg:
设计一动画序列,平移200后。延时1秒后再分4次跳回。


Rotate(To,By)环绕锚点(AnchorPoint)旋转
Scale(To,By)缩放动画,s为放大缩小比例
Spawn组合并行动画,动作同一时候运行。注意參数以NULL结尾


eg:
设计一动画。使背景旋转放大后充满屏幕
设计一动画序列,向前旋转移动300像素后,平移100,然后再跳跃100.

动画回调

CallFunc  与sequence组合使用
CallFuncN

eg:
4个精灵在中心位置先后移动到屏幕的4个角。
  1. //4个精灵在中⼼位置先后移动到屏幕的4个⾓
  2. void SecondaryJump:: FourSprites (cocos2d :: Ref * ref )
  3. {
  4. auto act = Sequence :: create( MoveTo ::create (1, Point(10, 10)), CallFuncN ::create ([=]( Node * node ){
  5. sp5 ->runAction ( Sequence:: create (MoveTo :: create(1, Point (10, 630)), CallFuncN :: create([=]( Node * node ){
  6. sp6 ->runAction ( Sequence:: create (MoveTo :: create(1, Point (950, 630)), CallFuncN :: create([=]( Node * node ){
  7. sp7 ->runAction ( Sequence:: create (MoveTo :: create(1, Point (950, 10)), nullptr ));
  8. }), nullptr ));
  9. }), nullptr ));
  10. }), nullptr );
  11. sp4-> runAction (act );
  12. }


动画回调加音效
  1. //动画回调
  2. auto callFunc = CallFuncN :: create([=]( Node * node )
  3. {
  4. node ->setVisible ( false);
  5. });
  6.  
  7. auto act = Sequence :: create( Spawn ::create ( RotateTo:: create (2, 720), MoveBy :: create(2, Point (100, 0)), nullptr ), \
  8. MoveBy ::create (1, Point(100, 0)), JumpBy ::create (0.2f, Point(0, 0), 100, 1), callFunc ,\
  9. CallFuncN ::create ([=]( Node * node ){ \
  10. CocosDenshion :: SimpleAudioEngine:: sharedEngine ()->playBackgroundMusic ( "music/game_music.wav", true ); }),
  11. nullptr );
  12.  
  13. sp2-> runAction (act );

其它动画

循环动画

Repeat、RpeatForever
//实现一个菜单button的抖动。 像那种输入账号password错误后。输入框抖动报错。
在MenuItem的回调函数中这样写,事实上就是  左下 左上 右上 右下高速反复移动六次:
  1. void SecondaryJump:: Jump (cocos2d :: Ref * ref )
  2. {
  3. MenuItemFont * item = (MenuItemFont *) ref;
  4. auto repeatAct = Repeat :: create( Sequence ::create ( MoveBy:: create (0.01f, Point (3, 3)), MoveBy ::create (0.01f, Point(-3, -3)), MoveBy ::create (0.01f, Point(3, -3)), MoveBy ::create (0.01f, Point(-3, 3)), nullptr ), 6);
  5. item-> runAction (repeatAct );
  6. }

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaGFuYmluZ2Zlbmd5aW5n/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

帧动画Animate

贝塞尔曲线

  1. void FrameAnimation:: Morning_0623 (cocos2d :: Ref * ref )
  2. {
  3. auto animation = Animation :: create();
  4. for ( int i = 2; i <= 6; i ++)
  5. {
  6. String fileName = StringUtils:: format ("coc/characters_lowres/%d.0.png" , i);
  7. animation ->addSpriteFrameWithFileName ( fileName. getCString ());
  8.  
  9. }
  10. animation-> setDelayPerUnit (0.05f);
  11. animation-> setLoops (-1);
  12. auto animate = Animate :: create( animation );
  13.  
  14. auto pArr = PointArray :: create(5);
  15. pArr-> addControlPoint (Point (100, 0));
  16. pArr-> addControlPoint (Point (100, 200));
  17. pArr-> addControlPoint (Point (300,200));
  18. pArr-> addControlPoint (Point (300, 400));
  19. auto move = CardinalSplineBy :: create(5, pArr , 1);
  20. auto act = Spawn :: create( animate , move , nullptr);
  21.  
  22. ccBezierConfig bezierCon ;
  23. bezierCon. controlPoint_1 =CCPointMake (200, 150); //控制点1
  24. bezierCon. controlPoint_2 =CCPointMake (200, 160); //控制点2
  25. bezierCon. endPosition =CCPointMake (540, 100); // 结束位置
  26. sp-> runAction (Spawn :: create( act , BezierBy :: create(3, bezierCon ), nullptr ));
  27. }

eg:

      屏幕上有10个精灵随机移动,精灵有对应的随机血量,相碰后血量少的精灵消失。最后仅仅剩下最后一个精灵。(考虑精灵封装成Enemy类)
      代码分析:我的代码中SpriteHW、SpriteHWT、AnimationHW这三个类。这道题的难度在于精灵碰撞检測后的删除。详细的能够參考AnimationHW的update。

使用C++自身的vector,没有在遍历的时候进行删除,而是标记删除。

在检測碰撞完成后再遍历一次vector对标记删除的元素进行删除。

      关于精灵随机位置的问题,使用rand会有每次执行随机数都一样的问题。这里给它加入一个随机种子。仅仅要在init()里面加入一句srand((unsigned)time(NULL));就可以每次随机不一样的数字。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaGFuYmluZ2Zlbmd5aW5n/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">





如今cocos2dx还没支持中文,我还没有找到好的unicode等转码的好的开源码,能力有限不想自己写搞得代码非常乱,囧。


代码SVN同步地址(假设哪天没有了,见谅,可能不续费了):https://www.svnchina.com/svn/lanou

cocos2dx 3.1从零学习(五)——动画的更多相关文章

  1. cocos2dx 3.1从零学习(二)——菜单、场景切换、场景传值

    回想一下上一篇的内容,我们已经学会了创建一个新的场景scene,加入sprite和label到层中.掌握了定时事件schedule. 我们能够顺利的写出打飞机的主场景框架. 上一篇的内容我练习了七个新 ...

  2. cocos2dx 3.1从零学习(一)——入门篇(一天学会打飞机)

    没办法,浏览这么高,为啥没人投票呢?朋友们,我这篇文章參加了csdn博文大赛.喜欢的来点个赞吧!点击:http://vote.blog.csdn.net/Article/Details?article ...

  3. cocos2dx 3.1从零学习(三)——Touch事件(回调,反向传值)

    第三讲 Touch 前面两篇我们学习的内容,足够我们做一款简单的小游戏.也能够说,我们已经入门了,能够蹒跚的走路了. 本篇将解说cocos2dx中非常重要的touch回调机制.你肯定记得第一章做定时器 ...

  4. cocos2dx 3.1从零学习(四)——内存管理(错误案例分析)

    本篇内容文字比較较多,可是这些都是建立在前面三章写代码特别是传值的时候崩溃的基础上的.可能表达的跟正确的机制有出入,还请指正. 假设有不理解的能够联系我.大家能够讨论一下,共同学习. 首先明白一个事实 ...

  5. cocos2dx 3.1从零学习(六)——CocosStudio(VS2013project导入及环境设置)

    导入libCocosStudio.libExtensions.libGUI 新建的project例如以下图: 加入现有项目 右键解决方式.例如以下操作: watermark/2/text/aHR0cD ...

  6. SVG 学习<五> SVG动画

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  7. es6从零学习(五):Module的语法

    es6从零学习(五):Module的语法 ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量 一:es6模块化和 CommonJS 和 AMD 模块 (运行 ...

  8. TweenMax动画库学习(五)

    目录            TweenMax动画库学习(一)            TweenMax动画库学习(二)            TweenMax动画库学习(三)            Tw ...

  9. iOS学习——核心动画

    iOS学习——核心动画 1.什么是核心动画 Core Animation(核心动画)是一组功能强大.效果华丽的动画API,无论在iOS系统或者在你开发的App中,都有大量应用.核心动画所在的位置如下图 ...

随机推荐

  1. easyui combobox实现本地模糊查询

    直接上代码 $("#combobox1").combobox({ valueField : "value", textField : "text&qu ...

  2. (剑指Offer)面试题1:赋值运算符函数

    题目: 如下为类型CMyString的声明,请为该类型添加赋值运算符函数. class CMyString{public:    CMyString(char* pData=NULL);    CMy ...

  3. HBase数据迁移至Hive

    背景:需要将HBase中表xyz(列簇cf1,列val)迁移至Hive 1. 建立Hive和HBase的映射关系     1.1 运行hive shell进入hive命令行模式,运行如下脚本 CREA ...

  4. Succession

    Description The king in Utopia has died without an heir. Now several nobles in the country claim the ...

  5. JavaScript二(第一个js程序)

    一.<script>xxxx</script>标签解析 1.charset :可选,表示通过src属性指定的字符集,由于大多数浏览器忽略它,所以很少有人用它2.defer:可选 ...

  6. poj 1286 Necklace of Beads &amp; poj 2409 Let it Bead(初涉polya定理)

    http://poj.org/problem?id=1286 题意:有红.绿.蓝三种颜色的n个珠子.要把它们构成一个项链,问有多少种不同的方法.旋转和翻转后同样的属于同一种方法. polya计数. 搜 ...

  7. An application icon

    The application icon is a small image which is usually displayed in the top left corner of the title ...

  8. PowerMock介绍

    一.为什么要使用Mock工具 在做单元测试的时候,我们会发现我们要测试的方法会引用很多外部依赖的对象,比如:(发送邮件,网络通讯,远程服务, 文件系统等等). 而我们没法控制这些外部依赖的对象,为了解 ...

  9. css before和after伪元素应用

    1.说明 ":before" 伪元素可以在元素的内容前面插入新内容. ":after" 伪元素可以在元素的内容之后插入新内容. 伪元素默认展示为inline, ...

  10. 〖Linux〗zigbee实验之cc2430移植tinyos2.x的步骤(Ubuntu13.10)

    开发环境:Ubuntu13.10 1. 添加源,并安装tinyos-2.11:sudo gedit  /etc/apt/sources.list #往里边添加deb http://tinyos.sta ...