【cocos2d-js官方文档】五、Cocos2d-JS v3.0的新Action API

新增action中的方法

曾经,当我们须要反复一个action的时候,我们须要:

sprite.runAction(cc.Repeat.create(action, 2));

上面代码中创建了一个新的Repeat对象又一次包装action,这样无论在语义上还是代码上都比較难理解。 为什么我们不能像jQuery一样的简单方便的使用原action呢?

于是我们在新版本号中为action添加了新的方法:

sprite.runAction(action.repeat(2));

要循环action仅仅须要在action后面添加.repeat(),而不须要和曾经一样又一次生成一个action,是不是更加方便了? ^.^

另外,我们还针对action的相关类,添加了更加简单的创建方法,通过类名第一个字母改为小写就能创建出一个新的对象:

 var action = cc.moveBy(2,cc.p(10,10));

上面代码等同于:

var action =  cc.MoveBy.create(2, cc.p(10, 10))

看到这里,大家一定非常操心一件事儿~兼容性。。。

事实上,大家不必太过于操心,旧的方法依然是被支持滴。

为什么要新增API

刚刚提到了怎么调用新的方法,可是为什么我们在现有一套比較成熟的方案下还是在新版本号中增加了新的方法呢?

事实上这一切都是为了更简单,更符合大家的使用习惯,以及让代码看起来更加清晰明了。

链式语法使得我们能够仅仅要生成一个对象,然后就能够通过调用对象的不同方法实现各种功能:

var action = cc.RotateTo.create(0.5, 90).repeat(5).speed(0.5);

或者:

var action = cc.RotateTo.create(0.5, 90);
action.repeat(5);
action.speed(0.5);

即使是全然没有接触过cocos2d-html5的用户,也能在第一时间看懂这段代码 - 创建一个action,然后针对这个action设置反复次数以及运行速度。

我们来对照旧的方法:

var action = cc.RotateTo.create(0.5, 90);
var action1 = cc.Repeat.create(action, 2);
var action2 = cc.Speed.create(action1, 0.5);

旧的方法生成了3个对象,并且造成了代码上的轻微污染。在阅读性和书写效率上都不如新的方法来的实在。

另外由于不再须要又一次生成冗余的对象了,所以在初始化速度上也有一点点的提升。

所以尽管新版本号依然支持老方法,可是我们还是建议大家依照新的方式来书敲代码。

新增API列表

除了上面提到的repeat以及speed方法外,我们还新增了以下这些方法。

旧的调用使用方法 相应的新方法
cc.Repeat.create(action, num) action.repeat(num)
cc.RepeatForever.create(action) action.repeatForever()
cc.Speed.create(action, speed) action.speed(speed)
cc.Speed.setSpeed(speed) action.setSpeed(speed)
cc.Speed.getSpeed() action.getSpeed()
cc.EaseIn.create(action, rate) action.easing(cc.easeIn(rate))
cc.EaseOut.create(action, rate) action.easing(cc.easeOut(rate))
cc.EaseInOut.create(action, rate) action.easing(cc.easeInOut(rate))
cc.EaseExponentialIn.create(action) action.easing(cc.easeExponentialIn())
cc.EaseExponentialOut.create(action) action.easing(cc.easeExponentialOut())
cc.EaseExponentialInOut.create(action) action.easing(cc.easeExponentialInOut())
cc.EaseSineIn.create(action) action.easing(cc.easeSineIn())
cc.EaseSineOut.create(action) action.easing(cc.easeSineOut())
cc.EaseSineInOut.create(action) action.easing(cc.easeSineInOut())
cc.EaseElasticIn.create(action) action.easing(cc.easeElasticIn())
cc.EaseElasticOut.create(action) action.easing(cc.easeElasticOut())
cc.EaseElasticInOut.create(action, rate) action.easing(cc.easeElasticInOut(rate))
cc.EaseBounceIn.create(action) action.easing(cc.easeBounceIn())
cc.EaseBounceOut.create(action) action.easing(cc.easeBounceOut())
cc.EaseBounceInOut.create(action) action.easing(cc.easeBounceInOut())
cc.EaseBackIn.create(action) action.easing(cc.easeBackIn())
cc.EaseBackOut.create(action) action.easing(cc.easeBackOut())
cc.EaseBackInOut.create(action) action.easing(cc.easeBackInOut())

部分演示样例:

EaseIn:
var move = cc.MoveBy.create(2, cc.p(winSize.width - 80, 0)).easing(cc.easeIn(2.0));
sprite.runAction(move);

RepeatForever:
var move = cc.MoveBy.create(2, cc.p(winSize.width - 80, 0)).RepeatForever();
sprite.runAction(move);

注意事项

反复对一个action对象使用两次repeat/speed方法,运行结果为设置值相乘。

var action = cc.RotateTo.create(0.5, 90);

//speed为6
action.speed(2).speed(3);
action.getSpeed() ==> 6;

//repeat次数为6


action.repeat(2).repeat(3);




转载请注明:http://www.douapp.com/post/2444
时间: 2024-08-11 09:56:13

【cocos2d-js官方文档】五、Cocos2d-JS v3.0的新Action API的相关文章

ArcGIS API For JS官方文档解析教程

ArcGIS API For JavaScript(八)之Arcade ArcGIS API For JavaScript官方文档(一)之关于API ArcGIS API For JavaScript官方文档(一)之默认API配置 ArcGIS API For JavaScript官方文档(七)之编辑 ArcGIS API For Javascript官方文档(三)之从Web服务器取回数据 ArcGIS API For JavaScript官方文档(二)之默认的API字符串 ArcGIS API

Hui 2.x.js 官方文档

基础方法 // 判断值是否是指定数据类型 var result = hui.isTargetType("白签软件", "string"); //=>true var result = hui.isTargetType(123, "number"); // =>true var result = hui.isTargetType("false", "boolean"); // =>false

node.js官方文档chm电子书的制作

制作软件:WebCHMSetup2.22.zip,http://www.onlinedown.net/soft/31553.htm 制作好的电子书:Node.js(v6.10.2).zip 参考链接:https://www.zhihu.com/question/37005587

bootbox.js官方文档

简介 Bootbox.js是一个小型的JavaScript库,基于Bootstrap模态框开发,用于创建可编程的对话框. 不像原生的alert等对话框,所有的Bootstrap模态框生成的都是非阻塞事件.所以 在使用confirm()对话框时,请记住这一点,因为它不是本地确认对话框的替代. 任何取决于用户选择的代码都必须放在回调函数中. alert alert是只有单个按钮的对话框,按ESC键或单击关闭按钮可关闭对话框. bootbox.alert("Your message here…&quo

比官方文档更易懂的Vue.js教程!包你学会!

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由蔡述雄发表于云+社区专栏 蔡述雄,现腾讯用户体验设计部QQ空间高级UI工程师.智图图片优化系统首席工程师,曾参与<众妙之门>书籍的翻译工作.目前专注前端图片优化与新技术的探研. 2016年,乃至接下来整个2017年,如果你要问前端技术框架什么最火,那无疑就是前端三巨头:React.Angular.Vue.没错,什么jQuery,seaJs,gulp等都逐渐脱离了热点.面试的时候不吹上一点新技术,好像自己就不是搞前端的似的.当然,

OpenGL ES着色器语言之操作数(官方文档第五章)

OpenGL ES着色器语言之操作数(官方文档第五章) 5.1操作数 OpenGL ES着色器语言包含如下操作符. 5.2数组下标 数组元素通过数组下标操作符([ ])进行访问.这是操作数组的唯一操作符,举个访问数组元素的例子: diffuseColor += lightIntensity[3] * NdotL; 5.3函数调用 如果一个函数有返回值,那么通常这个函数调用会用在表达式中. 5.4构造器 构造器使用函数调用语法,函数名是一个基本类型的关键字或者结构体名字,在初始化器或表达式中使用.

官方文档 恢复备份指南五 Configuring the RMAN Environment

本章内容: Configuring the Environment for RMAN Backups    配置RMAN环境 Configuring RMAN to Make Backups to a Media Manager 备份到介质管理器 Configuring the Fast Recovery Area    配置快速恢复区 Configuring the Backup Retention Policy    配置备份保留策略 Backup Optimization and the

【cocos2d-js官方文档】二十五、Cocos2d-JS v3.0中的单例对象

为何将单例模式移除 在Cocos2d-JS v3.0之前.全部API差点儿都是从Cocos2d-x中移植过来的,这是Cocos2d生态圈统一性的重要一环.可惜的是,这样的统一性也在非常大程度上限制了Cocos2d-html5的发展,有一些在C++中非常有意义的涉及搬到Html5平台后却使得Cocos2d-html5变得臃肿.所以在3.0版中,我们决定将一些API改造成更适合JavaScript开发者的API.这篇文档中将要展示的是单例类的改造. 拿cc.SpriteFrameCache为例: /

Spring 4 官方文档学习(五)核心技术之SpEL

1.介绍 SpEL支持在runtime 查询.操作对象图. 2.功能概览 英文 中文 Literal expressions 字面值表达式 Boolean and relational operators 布尔和关系操作符 Regular expressions  正则表达式 Class expressions 类表达式 Accessing properties, arrays, lists, maps 访问properties.arrays.lists.maps Method invocati