原地址:点击打开链接

1.回调函数

回调函数,即当动画完成时那瞬间需要执行一次的一个函数,it中默认有一个onComplete函数,当动画完成时会自动执行,且你可以提供需要传递的一些参数。见如下代码:

  1. private var tweenTarget : GameObject;
  2. var counter : GUIText;
  3. var count : int =0;
  4. function Start(){
  5. tweenTarget=gameObject;
  6. roll("right");//开始执行
  7. counter.guiText.material.color = Color.black;
  8. }
  9. private function roll(direction: String): void{
  10. switch(direction){
  11. //如果向右移
  12. case "right":
  13. iTween.rotateBy(tweenTarget,{"z":-.5});//旋转
  14. iTween.moveTo(tweenTarget,{"x":1.7, "onComplete":"roll","onCompleteParams":"left"});//移动到   当完成动画时执行onComplete 并且传递一个参数left
  15. //也即相当于又这样调用了一次roll("left"); 可以推测到  当动画完成向右之后 又开始向左了
  16. count+=1;
  17. break;
  18. //如果向左移   同上 当完成向左动画 则又开始向右  如此实现"乒乓"效果
  19. case "left":
  20. iTween.rotateBy(tweenTarget,{"z":1});
  21. iTween.moveTo(tweenTarget,{"x":-1.7, "onComplete":"roll","onCompleteParams":"right"});
  22. count+=1;
  23. break;
  24. }
  25. counter.text=count.ToString() + " Loops";
  26. }

复制代码

2.Bezier贝塞尔曲线运动

除了普通的线性运动 如MoveTo这些函数 it也支持曲线运动  其中一种常用的曲线就是bezier

在it中如何使用曲线:

  1. function Start()
  2. {
  3. iTween.moveToBezier(gameObject,{"time":3, "transition":"easeInOutQuint","bezier":[Vector3(0,1.5,0), Vector3(0,0,1.5), Vector3(0,-1.5,3), Vector3(1.5,0,3),Vector3(1.5,0,0), Vector3(-1.5,0,0)]});
  4. }

复制代码

可以看到,让物体跟随曲线运动。第一个参数指定当前物体运动,接下来是过渡方式:easeInOut 是一种起点和终点平滑过渡的方式。

共指定了6个向量点,需要记住参数是成双的即每个定点需要匹配一个控制点,才能定义好这条曲线。上面共有3个顶点,加3个这些定点的控制点。

【转】Itween 贝塞尔曲线(一)的更多相关文章

  1. canvas贝塞尔曲线

    贝塞尔曲线 Bézier curve(贝塞尔曲线)是应用于二维图形应用程序的数学曲线. 曲线定义:起始点.终止点.控制点.通过调整控制点,贝塞尔曲线的形状会发生变化. 1962年,法国数学家Pierr ...

  2. 贝塞尔曲线(UIBezierPath)属性、方法汇总

    UIBezierPath主要用来绘制矢量图形,它是基于Core Graphics对CGPathRef数据类型和path绘图属性的一个封装,所以是需要图形上下文的(CGContextRef),所以一般U ...

  3. 深度掌握SVG路径path的贝塞尔曲线指令

    一.数字.公式.函数.变量,哦,NO! 又又一次说起贝塞尔曲线(英语:Bézier curve,维基百科详尽中文释义戳这里),我最近在尝试实现复杂的矢量图形动画,发现对贝塞尔曲线的理解馒头那么厚,是完 ...

  4. 贝塞尔曲线(cubic bezier)

    对于css3的Transitions,网上很多介绍,相信大家都比较了解,这里用最简单的方式介绍下: transition语法:transition:<transition-property> ...

  5. iOS开发之画图板(贝塞尔曲线)

    贝塞尔曲线,听着挺牛气一词,不过下面我们在做画图板的时候就用到贝塞尔绘直线,没用到绘制曲线的功能.如果会点PS的小伙伴会对贝塞尔曲线有更直观的理解.这篇博文的重点不在于如何用使用贝塞尔曲线,而是利用贝 ...

  6. 用html5的canvas画布绘制贝塞尔曲线

    查看效果:http://keleyi.com/keleyi/phtml/html5/7.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  7. 二次、三次贝塞尔曲线demo(演示+获取坐标点)

    二次贝塞尔曲线demo: See the Pen quadraticCurveDemo by hanyanjun (@hanyanjun) on CodePen. 我的demo地址(二次) 推荐点击以 ...

  8. 【转~】初识贝塞尔曲线(Bézier curve)

    本文图文大多转自http://www.html-js.com/article/1628 QAQ我居然去扒维基,,,看不懂啊,,,我要去补数学,,, 在做变形小鸡的时候用到CSS3 transition ...

  9. canvas绘制二次贝塞尔曲线----演示二次贝塞尔四个参数的作用

    canvas中绘制二次贝塞尔曲线的方法为ctx.quadraticCurveTo(x1,y1,x2,y2); 四个参数分别为两个控制点的坐标.开始点即当前canvas中目前的点,如果想从指定的点开始, ...

随机推荐

  1. js控制select选中显示不同表单内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. C#静态成员和非静态成员

    一.C#静态成员和非静态成员 1. C#静态成员和非静态成员 当类中的某个成员使用static修饰符时,就会被声明为静态成员.类中的成员要么是静态成员,要么是非静态成员.一般情况下,静态成员属于整个类 ...

  3. javaWeb css图文混排

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. Vscode插件--微信小程序格式化以及高亮组件wxml-vscode

    wxml-vscode wxml-vscode 仓库 提问题 安装 通过 F1 或者 CMD + Shift + P 输入 install. 选择: Install Extension. 特性 格式化 ...

  5. POJ2154 Color(Polya定理)

    Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 11654   Accepted: 3756 Description Bead ...

  6. 【杂题总汇】HDU2018多校赛第九场 Rikka with Nash Equilibrium

    [HDU2018多校赛第九场]Rikka with Nash Equilibrium 又是靠这样一道题擦边恰好和第两百名分数一样~愉快

  7. Python代码结构——顺序、分支、循环

    ## 顺序结构 - 按照从上到下的顺序,一条语句一条语句的执行,是最基本的结构 ## 分支结构 if condition: statement statement ... elif condition ...

  8. PHP 使用GD库合成带二维码和圆形头像的海报步骤以及源码实现

    PHP 使用GD库合成带二维码和圆形头像的海报步骤以及源码实现 之前记录过一篇文章,不过那只是简单将二维码合成到海报中去,这次还要合成头像,而且是圆形.所需要素材就不一一列举,直接代码吧 1.先获取用 ...

  9. SQL_server_2008_r2和visual studio 2010旗舰版的安装(2013-01-16-bd 写的日志迁移

    (以下操作是在Oracle VM virtualBox虚拟机中操作的,其实VMware Workstation 9虚拟机也挺不错的,不过用了很久的vmware想换个虚拟机用用 就暂时用Oracle V ...

  10. 【Kaggle】泰坦尼克号

    引言 Kaggle官方网站 这是泰坦尼克号事件的基本介绍: 我们需要做的就是通过给出的数据集,通过对特征值的分析以及运用机器学习模型,分析什么样的人最可能存活,并给出对测试集合的预测. 对于Kaggl ...