【转】Itween 贝塞尔曲线(一)
原地址:点击打开链接
1.回调函数
回调函数,即当动画完成时那瞬间需要执行一次的一个函数,it中默认有一个onComplete函数,当动画完成时会自动执行,且你可以提供需要传递的一些参数。见如下代码:
- private var tweenTarget : GameObject;
- var counter : GUIText;
- var count : int =0;
- function Start(){
- tweenTarget=gameObject;
- roll("right");//开始执行
- counter.guiText.material.color = Color.black;
- }
- private function roll(direction: String): void{
- switch(direction){
- //如果向右移
- case "right":
- iTween.rotateBy(tweenTarget,{"z":-.5});//旋转
- iTween.moveTo(tweenTarget,{"x":1.7, "onComplete":"roll","onCompleteParams":"left"});//移动到 当完成动画时执行onComplete 并且传递一个参数left
- //也即相当于又这样调用了一次roll("left"); 可以推测到 当动画完成向右之后 又开始向左了
- count+=1;
- break;
- //如果向左移 同上 当完成向左动画 则又开始向右 如此实现"乒乓"效果
- case "left":
- iTween.rotateBy(tweenTarget,{"z":1});
- iTween.moveTo(tweenTarget,{"x":-1.7, "onComplete":"roll","onCompleteParams":"right"});
- count+=1;
- break;
- }
- counter.text=count.ToString() + " Loops";
- }
复制代码
2.Bezier贝塞尔曲线运动
除了普通的线性运动 如MoveTo这些函数 it也支持曲线运动 其中一种常用的曲线就是bezier
在it中如何使用曲线:
- function Start()
- {
- 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)]});
- }
复制代码
可以看到,让物体跟随曲线运动。第一个参数指定当前物体运动,接下来是过渡方式:easeInOut 是一种起点和终点平滑过渡的方式。
共指定了6个向量点,需要记住参数是成双的即每个定点需要匹配一个控制点,才能定义好这条曲线。上面共有3个顶点,加3个这些定点的控制点。
【转】Itween 贝塞尔曲线(一)的更多相关文章
- canvas贝塞尔曲线
贝塞尔曲线 Bézier curve(贝塞尔曲线)是应用于二维图形应用程序的数学曲线. 曲线定义:起始点.终止点.控制点.通过调整控制点,贝塞尔曲线的形状会发生变化. 1962年,法国数学家Pierr ...
- 贝塞尔曲线(UIBezierPath)属性、方法汇总
UIBezierPath主要用来绘制矢量图形,它是基于Core Graphics对CGPathRef数据类型和path绘图属性的一个封装,所以是需要图形上下文的(CGContextRef),所以一般U ...
- 深度掌握SVG路径path的贝塞尔曲线指令
一.数字.公式.函数.变量,哦,NO! 又又一次说起贝塞尔曲线(英语:Bézier curve,维基百科详尽中文释义戳这里),我最近在尝试实现复杂的矢量图形动画,发现对贝塞尔曲线的理解馒头那么厚,是完 ...
- 贝塞尔曲线(cubic bezier)
对于css3的Transitions,网上很多介绍,相信大家都比较了解,这里用最简单的方式介绍下: transition语法:transition:<transition-property> ...
- iOS开发之画图板(贝塞尔曲线)
贝塞尔曲线,听着挺牛气一词,不过下面我们在做画图板的时候就用到贝塞尔绘直线,没用到绘制曲线的功能.如果会点PS的小伙伴会对贝塞尔曲线有更直观的理解.这篇博文的重点不在于如何用使用贝塞尔曲线,而是利用贝 ...
- 用html5的canvas画布绘制贝塞尔曲线
查看效果:http://keleyi.com/keleyi/phtml/html5/7.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...
- 二次、三次贝塞尔曲线demo(演示+获取坐标点)
二次贝塞尔曲线demo: See the Pen quadraticCurveDemo by hanyanjun (@hanyanjun) on CodePen. 我的demo地址(二次) 推荐点击以 ...
- 【转~】初识贝塞尔曲线(Bézier curve)
本文图文大多转自http://www.html-js.com/article/1628 QAQ我居然去扒维基,,,看不懂啊,,,我要去补数学,,, 在做变形小鸡的时候用到CSS3 transition ...
- canvas绘制二次贝塞尔曲线----演示二次贝塞尔四个参数的作用
canvas中绘制二次贝塞尔曲线的方法为ctx.quadraticCurveTo(x1,y1,x2,y2); 四个参数分别为两个控制点的坐标.开始点即当前canvas中目前的点,如果想从指定的点开始, ...
随机推荐
- 手动安装Apache+PHP+MYSQL及环境配置
先准备好软件: Apache官方下载地址:apache_2.0.55-win32-x86-no_ssl.msi,更多版本在这里: php官方下载地址:php-5.0.5-Win32.zip,更多镜像下 ...
- HttpContext.RewritePath
定义:使用给定路径重写 URL.就是可以跳转到指定的URL. 也可以做为伪静态的跳转.具体如下. 他的重载 ①新建一个页面,放两个链接到另一个页面,注意给的链接 ②在 global.asax 文件中 ...
- 武者Vue
1 - Introduction 2 - The Vue Instance 3 - Data & Methods 4 - Data Binding 5 - Events 6 - Event M ...
- 使用JavaScript动态的绑定、解绑 a 标签的onclick事件,防止重复点击
页面上的 a 标签如下: <a class="more" style="cursor: pointer;" id="commentMore&qu ...
- noip2018 洛谷 P5020 货币系统
关键: 要使m最小,(m,b)中的数不能用(n,a)中的数表示出来 对于 3 19 10 6 19=10+3+3+3 6=3+3 只有3 和 10 不能被(n,a)中的数表示 所以m=2 只需要 ...
- MySQL工作经验
以下是根据工作中遇到各种场景用到的一些Mysql用法,比较实用,基本是语法之外的一些东西. 修改账户密码 1.打开Mysql控制台,输入原密码: 2.输入以下语法:mysql> set pass ...
- mybatis两级缓存原理剖析
https://blog.csdn.net/zhurhyme/article/details/81064108 对于mybatis的缓存认识一直有一个误区,所以今天写一篇文章帮自己订正一下.mybat ...
- 并排打印多个图案(C++实现)
在练习循环控制语句时,经常会遇到一类问题:使用循环控制打印星号(*)来形成各种各样的图案,并强调所有的星号(*)都要用单条的输出语句cout<<"*";来打印. 例如打 ...
- HDFS HA 的 hdfs-site.xml
<?xml-stylesheet type="text/xsl" href="configuration.xsl"?> <!-- Licens ...
- P2580 于是他错误的点名开始了(trie)
P2580 于是他错误的点名开始了 题目背景 XS中学化学竞赛组教练是一个酷爱炉石的人. 他会一边搓炉石一边点名以至于有一天他连续点到了某个同学两次,然后正好被路过的校长发现了然后就是一顿欧拉欧拉欧拉 ...