Cocos2d-JS 动作、特效和动画

动作
动作包括基本动画和基本动作的组合,基本动作有缩放、移动、旋转等动作。
动作类是cc.Action。它的类图如图7-1所示。

从图中可以看出cc.Action的一个子类是cc.FiniteTimeAction,cc.FiniteTimeAction是一种受时间限制的动作。cc.Follow是一种允许精灵跟随另一个精灵的动作,cc.speed可以一个动作运行时改变其运动速率。
此外。cc.FiniteTimeAction有两个子类,cc.ActionInstant和cc.ActionInterval。
它们两个是不同风格的动作类,cc.ActionInstant封装了一种瞬时动作,cc.ActionInterval封装了一种间隔动作。
在cc.Node类中关于动作的函数如下:
(1)runAction(action)运行指定动作,返回值仍然是一个动作对象
(2)stopAction(action)停止指定动作
(3)stopActionByTag(tag)通过指定标签停止动作
(4)stopAllActions()停止所有动作
瞬时动作
瞬时动作就是不等待,立即执行的动作,瞬时动作的基类是cc.ActionInstant,瞬时动作cc.ActionInstant类图如图7-2所示:


例子:




第三行使用构造函数的参数初始化成员变量值flagTag
间隔动作
间隔动作执行完成需要一定的时间,可以设置duration属性来设置动作的执行时间,间隔动作基类是cc.ActionInterval,间隔动作cc.ActionInterval类图如图7-5所示:

组合动作
动作往往不是单一的,而是复杂的组合。可以按照一定的次序将上述基本动作组合起来,形成连贯的一套组合动作。组合动作包括以下几类:顺序,并列,有限次数重复,无限次数重复,反动作和动画。
动作速度控制
基本动作和组合动作实现了针对精灵的各种运动和动画效果的改变。但这样的改变速度是匀速的、线性的。通过cc.ActionEase及其子类和cc.Speed类可以使精灵以非匀速或非线性速度运动。
cc.ActionEase的类图如图7-10所示:


EaseOut(ac,3)以3倍速度由慢至快
EaseInOut(ac,3)以3倍速度由慢至快再由快至慢
EaseSineIn(ac)以正弦变换速度由慢至快
EaseSineOut(ac)以正弦变换速度由快至慢
EaseSineInOut(ac)采用正弦变换速度由慢至快再由快至慢
EaseExponetialIn(ac)采用指数变换速度由慢至快
EaseExponetialInOut(ac)采用指数变换由快至慢
Speed(ac,cc.random0To1()*5)随机设置变换速度
回调函数
在顺序动作执行的中间或者结束时,可以回调某个函数。从而可以在该函数中执行任何处理。
特效
cocos2d-JS提供了很多特效,这些特效事实上属于间隔动作。
网格动作
网格动作都是采用3D效果,给用户的体验是非常震撼好绚丽的。但是要给内存和CPU带来了巨大的压力和负担。如果不启用OpenGL的深度缓冲,3D效果就会是是真。但是启动时时对于显示性能也会造成负面影响。
动画
在Cocos2d-JS中播放帧动画设计两个类。cc.Animation和cc.Animate。类图如图7-18所示,cc.Animation是动画类,他保存有很多动画帧。cc.Animate类是动作类。它继承于cc.ActionInterval类,属于间隔动作类。它的作用是将cc.Animation定义的动画转换成为动作进行执行,这样就能看到动画播放的效果了。



第1行代码是创建一个Animation对象,它是动画对象。然后通过循环将各个帧图片放到Animation对象中。第2行代码是获得帧图片的文件名。第3行代码是通过帧名创建精灵帧对象,第4行代码是把精灵帧对象添加到Animation对象中。第五行代码是设置两个帧播放时间。第6行是表示动画执行完成后是否还原到初始状态。第7行代码是通过一个Aniamtion对象创建一个Animate对象。第8行代码this.sprite.runAction(cc.repeatForever(action))是执行动画动作,无限循环方式。第9行代码,this.sprite.stopAllActions()是停止所有动作。
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值