layaAir之Tween类to方法和Ease 类

xiaoxiao2021-02-28  38

在这里,我们为什么会把这两个放在这里讲呢?我们来看Tween类的to方法里的参数,下面给出官方给的参数图:

在官方给的参数里,target是我们要操作的对象,prop属性是我们用来控制对象运动到何种程度,这个属性是个JSON对象,可以同时设置对个属性让对象运动,duration是运动所用时间,ease也是我们这里要终点说的,这里的ease是类方法,是laya.utils包里的Ease 类,也是用来控制对象是如何缓动的,这个类定义了对象的运动方法,一下给出部分方法截图:

coverBefore和autoRecover分别是是否覆盖之前的缓动,自动回收Tween对象。

下面我们用代码简单实现Tween的运动,代码如下

            // 程序入口     import text = Laya. Text;     import Ease = Laya. Ease;     class GameMain{      url: string;      constructor()     {      Laya. init( Laya. Browser. width, Laya. Browser. height, Laya. WebGL);      Laya. stage. bgColor = '#fff';      Laya. DebugPanel. init();      this. url = 'timg.jpg';      Laya. loader. load( this. url, Laya. Handler. create( this, this. onLoad));     }      onLoad(){      //Laya.stage.addChild(new aaa());      let img: Laya. Image = new Laya. Image();      img. loadImage( this. url);      Laya. stage. addChild( img);      //Tween      Laya. Tween. to( img, { x: 300, y: 300 }, 3000, Ease. elasticOut, Laya. Handler. create( this, function(){      let wangwang: text = new text();      wangwang. text = '汪汪';      wangwang. fontSize = 100;      wangwang. color = 'red';      wangwang. pos( 700, 300);      Laya. stage. addChild( wangwang);     }), 1000);     }     }     new GameMain();

实现最终效果图为:

在这里需要注意的是,参数里面的时间都是以毫秒为单位的,也就是1000就相当于1秒。

转载请注明原文地址: https://www.6miu.com/read-2612734.html

最新回复(0)