cocos2d-html5学习笔记——创建持续性动作

学习笔记:仅作参考
cc.ScaleTo.create(duration, sx, sy)
 duration持续时间
 sx 横坐标大小比例
 sy 纵坐标大小比例

RotateTo:将 cc.Node 对象旋转到一个特定的角度。
RotateBy:将 cc.Node 对象旋转一个特定的角度。

使用cc.RotateTo.create(duration, deltaAngleX, deltaAngleY)和
    cc.RotateBy.create(duration, deltaAngleX, deltaAngleY)来创建动作。

 duration 运动周期,单位为s。
 deltaAngleX 水平旋转角度
 deltaAngleY 垂直旋转角度,如果省略,则取deltaAngleX的值。 

eg:与RotateBy区别:
cc.RotateTo.create(2, 360); 对象不转(转到360度也就是0度)
cc.RotateBy.create(2, 360); 对象转360°

cc.MoveTo.create(duration,position);
 Duration: 移动持续时间/秒
 Position: 移动到的位置坐标
eg:
var actionBy = cc.MoveTo.create(2, cc.p(80, 80)); //当前坐标为x,y, 2秒移动到x=80,y=80

cc.MoveBy.create(duration, deltaPosition);
 Duration: 移动持续时间/秒
 deltaPosition: 移动到当前坐标+增量坐标的位置
eg:
var actionTo = cc.MoveBy.create(2, cc.p(40, 40)); //当前坐标为x,y, 2秒移动到x+40,y+40

cc.JumpTo.create(duration,position,height,jumps);
 Duration: 跳跃持续时间/秒
 Position: 跳动到的位置坐标
 Height: 跳跃高度(px)
 Jumps: 跳跃次数
eg:
var actionTo = cc.JumpTo.create(2, cc.p(300, 300), 50, 4); //2秒跳跃到x=300,y=300,跳跃高度50px,跳跃4次

cc.JumpBy.create(duration,deltaposition,height,jumps)
 Duration: 跳跃持续时间/秒
 deltaPosition: 跳动到的位置坐标+增量坐标
 Height: 跳跃高度
 Jumps: 跳跃次数
eg:
var actionBy = cc.JumpBy.create(2, cc.p(300, 0), 50, 4); //当前坐标x,y,2秒跳跃到x+300,y+0,跳跃高度50px,跳跃4次

cc.FadeTo.create(duration,opacity)
 Duration: 由不透明变透明的持续时间/秒
 Opacity: 透明度,0-255, 0是完全透明,255是不变
eg:
var action = cc.FadeTo.create(1, 125);  //1秒对象由不透明0变为透明度125

cc.FadeOut.create(duration)
 Duration: 对象淡出变透明的持续时间/秒, 变透明后,此对象依然存在
eg:
var action = cc.FadeOut.create(1); //1秒对象由不透明变为完全透明,即透明度由0变为255

cc.FadeIn.create(duration)
 Duration: 对象淡入的持续时间/秒
eg:
var action = cc.FadeIn.create(1);  //1秒对象由完全透明变为不透明,即透明度由255变为0

cc.DelayTime.create(d)
D: 延迟时间
eg:
var delay = cc.DelayTime.create(1);  //创建一个延迟1秒的动作

cc.Blink.create(duration,blinks);
 Duration: 对象闪烁持续时间/秒
 Blinks: 对象闪烁次数
eg:
var action = cc.Blink.create(2, 10);  //2秒闪烁10次

cc.BezierTo.create(t,c);
 T: Bezier曲线移动的时间/秒
 C: 一组坐标点
eg:
var bezier = [cc.p(0, 200), cc.p(300, 150), cc.p(300, 100)];
var bezierTo = cc.BezierTo.create(2, bezier);  //几个坐标点之间按Bezier曲线移动

cc.BezierBy.create(t,c);
 T: Bezier曲线移动的时间/秒
 C: 一组坐标点
 当前坐标位置+增量坐标的几个点之间按Bezier曲线移动

cc.Repeat.create(action,times
 Action: 要重复的动作
 Times: 重复次数
eg:
var move1=cc.MoveTo.create(2,cc.p(300,200));
var move2=cc.MoveTo.create(2,cc.p(200,200));
var seq=cc.Sequence.create(move1, move2);
var rep = cc.Repeat.create(seq, 5); //在坐标(300,200)与坐标(200,200)之间来回移动,重复5次

cc.RepeatForever.create(action)
 无限重复action动作
eg:
var repeat=cc.RepeatForever.create( cc.RotateTo.create(2,180) );

cc.ReverseTime.create(action)
 直接开始与action动作相反的动作
eg:
var fox=cc.Sprite.create(foxImage); //创建一个名为fox的精灵
fox.setPosition(200,200); //设置精灵的初始位置为坐标(200,200)
var move1=cc.MoveTo.create(2,cc.p(300,200)); //创建一个名为move1的动作,该动作执行2秒移动到坐标(300,200)
var reverse = cc.ReverseTime.create(move1); //创建一个名为reverse的动作,该动作执行与move1的相反动作
fox.runAction(reverse); //精灵fox执行动作reverse,实际效果为:精灵fox的初始位置坐标为(300,200) (move1动作的终点位置),2秒移动到坐标(200,200)(move1动作的初始位置)

cc.TintBy.create(duration,r,g,b); //将对象的色调变化某值,r,g,b取值范围为0~255
cc.TintTo.create(duration,r,g,b); //将对象的色调变化到某值
eg:
var action=cc.TintBy.create(2,125,0,52);//对象当前色调为r,g,b,将对象的色调变化为r+125,g+0,b+52,注意取值范围
var action=cc.TintTo.create(2,125,0,52);//将对象的色调变化为r=125,g=0,b=52

cocos2d-html5学习笔记——创建持续性动作

时间: 2024-08-27 14:05:40

cocos2d-html5学习笔记——创建持续性动作的相关文章

html5学习笔记(3)--主题结构元素-1

html5学习笔记(3)--主题结构元素-1 Article元素 以下为对应代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <article> <header> <h1>极客学院</h

HTML5学习笔记(二)——表单1

表单一直是网页必不可少的一部分,一直以来,表单的作用被无限扩展,发展出了诸多新奇的用法,老版的HTML只支持很少的一部分常用表单,许多的新表单都需要借助CSS与JavaScript语言来进行构建,现在HTML5来了,她带来了新的表单,这些强大的表单项,可以省去一大块复杂的JavaScript代码,很值得去学习. 而且在新的表单里面,不再像以前每个表单都必须位于<form></form>之内,只要在<form></form>内定义一个id,然后在网页任何位置都

Html5学习笔记1 元素 标签 属性

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HTML5学习笔记</title> </head> <body bgcolor="#90ee90"> 1.Html5的元素<br/><br/> 元素指的是从開始标签到结束标签的全部代码<

html5学习笔记2

css3选择器 1.通过元素的关键字,如p,div等 2.通过id属性 3.通过class属性引用 3.1通过class属性引用p标签,如:p.text{}//text样式只适用于p 4.通过任意键引用 例如:p[name]{}//仅引用带有name属性的p标签 p[name="my"]{}//仅引用带有name属性等于"my"的p标签 还可以使用正则表达式p[name^="my"]{} p[name$="my"]{} 5.通

HTML5 学习笔记(一)——HTML5概要与新增标签

一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电.触摸.不开放). HTML5增强了浏览器的原生功能,符合HTML5规范的浏览器功能将更加强大,减少了Web应用对插件的依赖,让用户体验更好,让开发更加方便,另外W3C从推出HTML4.0到5.0之间共经历了17年,HTML的变化很小,这并不符合一个好产品的演进规则. 1.2.什么是HTML5 HTML5

HTML5学习笔记(四):H5中表单新增元素及改良

方便布局 表单内容可以放在表单标签之外,这样做的好处是方便设计时不用考虑一定要将表单元素放在指定的form标签之下,只要指定元素适用于哪个表单即可,如下: 1 <form id="test" action="test.php" method="get"> 2 <input form="test" type="text" name="name"/> 3 </f

HTML5 学习笔记--------》HTML5概要与新增标签!

一.HTML5概要 1.1.为什么需要HTML5 HTML4陈旧不能满足日益发展的互联网需要,特别是移动互联网.为了增强浏览器功能Flash被广泛使用,但安全与稳定堪忧,不适合在移动端使用(耗电.触摸.不开放). HTML5增强了浏览器的原生功能,符合HTML5规范的浏览器功能将更加强大,减少了Web应用对插件的依赖,让用户体验更好,让开发更加方便,另外W3C从推出HTML4.0到5.0之间共经历了17年,HTML的变化很小,这并不符合一个好产品的演进规则. 1.2.什么是HTML5 HTML5

[html5] 学习笔记-表单新增的元素与属性(续)

本节主要讲解表单新增元素的controls属性.placeholder属性.List属性.Autocomplete属性.Pattern属性.SelectionDirection属性.Indeterminate属性.Image提交按钮的宽高属性. 1.controls属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的controls属性来访问该表单元素. 1 <body> 2 <script> 3 function setValue(){ 4 var label

Cocos2D-X2.2.3学习笔记12(瞬时动作)

到眼下我们已经学习了有 坐标系统 内存管理 UI系统 事件处理 几何图形 今天我们来学习动作管理OK 我们来看看类结构图 CCAction   全部动作的基类 以下派生了三个子类:CCFiniteTimeAction,CCFollow,CCSpeed 这些我们先不看  我们主要来介绍一下瞬时动作, CCActionInstant 瞬时动作 故而 一瞬间就完毕的动作,它没有延迟时间的 好的  開始 #ifndef __HELLOWORLD_SCENE_H__ #define __HELLOWORL