【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
【cocos2d-js官方文档】五、Cocos2d-JS v3.0的新Action API的更多相关文章
- bootbox.js官方文档中文版
bootbox.js官方文档中文版简介:Bootbox.js是一个小型的JavaScript库,基于Bootstrap模态框开发,用于创建可编程的对话框. 不像原生的alert等对话框,所有的Boot ...
- StackExchange.Redis 官方文档(五) Keys, Values and Channels
原文:StackExchange.Redis 官方文档(五) Keys, Values and Channels Keys, Values and Channels 在使用redis的过程中,要注意到 ...
- Hui之Hui.js 官方文档
基础 // 判断值是否是指定数据类型 var result = hui.isTargetType("百签软件", "string"); //=>true ...
- node.js官方文档解析 02—buffer 缓冲器
Buffer 类的实例类似于整数数组,但 Buffer 的大小是固定的.且在 V8 堆外分配物理内存.Buffer 的大小在被创建时确定,且无法调整. Buffer 类在 Node.js 中是一个全局 ...
- Node.js官方文档:到底什么是阻塞(Blocking)与非阻塞(Non-Blocking)?
译者按: Node.js文档阅读系列之一. 原文: Overview of Blocking vs Non-Blocking 译者: Fundebug 为了保证可读性,本文采用意译而非直译. 这篇博客 ...
- node.js官方文档解析 01—assert 断言
assert-------断言 new assert.AssertionError(options) Error 的一个子类,表明断言的失败. options(选项)有下列对象 message < ...
- bootbox.js官方文档
简介 Bootbox.js是一个小型的JavaScript库,基于Bootstrap模态框开发,用于创建可编程的对话框. 不像原生的alert等对话框,所有的Bootstrap模态框生成的都是非阻塞事 ...
- node.js官方文档chm电子书的制作
制作软件:WebCHMSetup2.22.zip,http://www.onlinedown.net/soft/31553.htm 制作好的电子书:Node.js(v6.10.2).zip 参考链接: ...
- Vue.js官方文档学习笔记(一)起步篇
Vue.js起步 Vue.js介绍 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库 ...
随机推荐
- html中radio、checkbox选中状态研究(静下心来看,静下心来总结)
html中radio.checkbox选中状态研究(静下心来看,静下心来总结) 一.总结 1.单选框的如果有多个checked 会以最后一个为准 2.js动态添加checked属性:不行:通过 $(& ...
- Elasticsearch 2.3.2 从oracle中同步数据
Elasticsearch 2.3.2 从oracle中同步数据 1 数据批量导入-oracle 采用 elasticsearch-jdbc 插件 安装.版本需要ES版本一致 最新 ...
- ASCII码的问题
数字0在ASCII的不同进制下表示:
- HQL和SQL的区别
1.hql与sql的区别 sql 面向数据库表查询 hql 面向对象查询 hql : from 后面跟的 类名+类对象 where 后 用 对象的属性做条件 sql: from 后面跟的是表名 ...
- margin隐藏最后的切割线
<style> *{margin: 0;padding: 0;} #demo li{ border-bottom: 1px solid #ccc; } #demo ul{ margin-b ...
- Django之分页显示文章
1.项目:http://www.cnblogs.com/jasonhaven/p/7493422.html 2.任务描述:页面分页显示文章 3.源代码 后台: from django.core.pag ...
- Make chrome extension
How to Make a Chrome Extension. https://robots.thoughtbot.com/how-to-make-a-chrome-extension Skip to ...
- CVE-2014-3566
https://access.redhat.com/articles/1232123 https://tools.ietf.org/html/draft-ietf-tls-downgrade-scsv ...
- [Jest] Snapshot
The problem we face daily when we do testing: The Data structure may changing, component outlook mig ...
- 数据库使用truncate清理非常多表时碰到外键约束时怎么高速解决
问题处理思路: 1. 先将数据库中涉及到外键约束的表置为无效状态 2.待清除全然部表数据后再将外键约束的表置为可用状态 详细实现脚本: declare begin for vv_sql in (SEL ...