【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 的核心库 ...
随机推荐
- VMware linux虚拟机在线识别新添加磁盘
登录进虚拟机linux系统中执行以下命令,识别新增加的硬盘 echo "- - -" > /sys/class/scsi_host/host0/scan # ls /sys/ ...
- DBeaver笔记-快捷键篇
公司使用的是PostgreSQL数据库,可以使用pgAdmin或者DBeaver进行连接该数据库.个人更喜欢用DBeaver,因为其界面更加美观,操作也相对简单.对于习惯了eclipse的开发者来说, ...
- C++学习笔记(达内视频版)
达内C++(陈宗权主讲) 第一天: 课程分为Core C++(标准C++.不依赖操作系统)和Unix C++. 1.配置bash,运行.sh文件. vi bash_profile 在"pat ...
- Android应用性能优化系列视图篇——隐藏在资源图片中的内存杀手
图片加载性能优化永远是Android领域中一个无法绕过的话题,经过数年的发展,涌现了很多成熟的图片加载开源库,比如Fresco.Picasso.UIL等等,使得图片加载不再是一个头疼的问题,并且大幅降 ...
- word中公式的排版及标题列表
1.首先建好你的标题,如标题1,标题2等等,你能够依次改变它们的字体,段落等格式,新建格式例如以下图所看到的 红圈处即建立新的格式,你能够建立不论什么你想要的格式,非常方便: 2.当你建立好了多个标题 ...
- spring-如何在项目启动的情况下获取Bean实例
十年阿里,就只剩下这套Java开发体系了 >>> 大家都知道,项目启动的时候,spring读取xml文件,将配置的bean 或者 注解下的controller service d ...
- [Vue] Create Vue.js Layout and Navigation with Nuxt.js
Nuxt.js enables you to easily create layout and navigation by replacing the default App.vue template ...
- [内核编程] visual studio 2010配置驱动开发环境
visual studio 2010 配置驱动开发环境 ** 工具/材料 VS2010.WDK开发包 ** 配置过程 以下将讲述VS2010驱动开发环境的配置过程,至于必要软件的安装过程这里不再赘述 ...
- 卸载、指定卸载 .NET Core Runtime and SDK
原文:卸载.指定卸载 .NET Core Runtime and SDK 项目使用的 Nuget 包,比如 Microsoft.AspNetCore.App等的版本号要与 .NET Core 版本号( ...
- Make chrome extension
How to Make a Chrome Extension. https://robots.thoughtbot.com/how-to-make-a-chrome-extension Skip to ...