cocos 缓动系统

攻击效果

    public attack(victime:BattelHead){
      
           
        let targetPos =  victime.getNode().getPosition();
        let killerPos = this.getNode().getPosition();

        // //目标在左边
        if( victime.getLocation()=="left" ){
         
            let ofst = victime.getUITransform().width
            targetPos =  new Vec3( targetPos.x + ofst,targetPos.y,targetPos.z );
        }else{
            
            let ofst = victime.getUITransform().width
            targetPos =  new Vec3( targetPos.x - ofst,targetPos.y,targetPos.z );
        }

     

        tween(this.node)
            .to(0.15,{scale:new Vec3(1.4,1.4, 0)})
           
            .to(0.2, {position: targetPos  }, {easing: 'bounceInOut'})
            .call(()=>{
                victime.accpeetAttack();
            })

            .to(0.15,{scale:new Vec3(1,1, 0)})
            .to(0.2, {position:killerPos}, {easing: 'bounceInOut'})
       
            .start();



    }

tween的基本操作：

let tween = cc.tween;
// 链式结构
tween(this.node)
    .to(1, { position: cc.v2(100, 100), rotation: 360 })//到
    .by(1, { scale: 2 })//加
	.to(1, { scale: 2, position: { value: cc.v3(100, 100, 100), easing: 'sineOutIn' } })//easing
	.to(1, { scale2 }, { onUpdate: () => { /* 每帧调用*/}})
	.delay(1)//延迟
	.call(()=>{})//回调
	.parallel(//同时执行
        	tween().to(1, { scale: 2 }),
        	tween().to(2, { position: cc.v2(100, 100) })
    	)
	.repeatForever()//无限循环上个操作
	.repeat(10)//循环上个操作9次===========注意：填1则1次都不走，填2走1次，3走2次
	.repeat(10,//循环上个操作9次指定tween===========注意：同上
        	cc.tween().by(1, { scale: 1 })
    	)
    .start()//走一个
//灵活的嵌套使用//
let dt = cc.tween().delay(1)
let scale = cc.tween().to(1, { scale: 2 })
let rotate = cc.tween().to(1, { rotation: 90})
let call = cc.tween().call(()=>{})
let parallel = cc.tween().parallel(scale, rotate)
cc.tween(this.node).then(scale).then(rotate)//插入执行
scale.clone(this.node2).start();//克隆缓动scale到节点this.node2
cc.tween(this.node).then(rotate).repeatForever().start();//无限重复缓动rotate
cc.tween(this.node).then(rotate).repeat(4).start();//重复3次缓动rotate
cc.sequence([缓动])
透明度缓动的几种方式：

let opacity1 = tween().to(0.15, { opacity: 0 })// 透明度缓动
let opacity2 = cc.tween().to(0.4, { opacity: 1 }, { easing: 'elasticOut' });
let opacity3 = cc.tween().to(0.2, { opacity: { value: 1, easing: 'elasticOut' } })
缓动相关：
    backIn,// 回震
    backOut,
    backInOut,
    backOutIn,
	sineIn,// 加减速
	sineOut,
	sineInOut,
	sineOutIn,
	fade,// 渐隐
效果图地址：https://easings.net/

// 所有的缓动类型：
export class Easing {
		quadIn(t: number): number;// 平方曲线缓入函数。运动由慢到快。
		quadOut(t: number): number;// 平方曲线缓出函数。运动由快到慢	
		quadInOut(t: number): number;// 平方曲线缓入缓出函数。运动由慢到快再到慢
		cubicIn(t: number): number;// 立方曲线缓入函数。运动由慢到快。
		cubicOut(t: number): number;// 立方曲线缓出函数。运动由快到慢。
		cubicInOut(t: number): number;// 立方曲线缓入缓出函数。运动由慢到快再到慢。
		quartIn(t: number): number;// 四次方曲线缓入函数。运动由慢到快。
		quartOut(t: number): number;// 四次方曲线缓出函数。运动由快到慢。
		quartInOut(t: number): number;// 四次方曲线缓入缓出函数。运动由慢到快再到慢。
		quintIn(t: number): number;// 五次方曲线缓入函数。运动由慢到快。
		quintOut(t: number): number;//五次方曲线缓出函数。运动由快到慢.
		quintInOut(t: number): number;// 五次方曲线缓入缓出函数。运动由慢到快再到慢。
		sineIn(t: number): number;// 正弦曲线缓入函数。运动由慢到快。
		sineOut(t: number): number;// 正弦曲线缓出函数。运动由快到慢。
		sineInOut(t: number): number;// 正弦曲线缓入缓出函数。运动由慢到快再到慢。
		expoIn(t: number): number;// 指数曲线缓入函数。运动由慢到快。
		expoOut(t: number): number;// 指数曲线缓出函数。运动由快到慢。
		expoInOut(t: number): number;// 指数曲线缓入和缓出函数。运动由慢到很快再到慢。
		circIn(t: number): number;// 循环公式缓入函数。运动由慢到快。
		circOut(t: number): number;// 循环公式缓出函数。运动由快到慢。
		circInOut(t: number): number;// 指数曲线缓入缓出函数。运动由慢到很快再到慢。
		elasticIn(t: number): number;// 弹簧回震效果的缓入函数。
		elasticOut(t: number): number;// 弹簧回震效果的缓出函数。
		elasticInOut(t: number): number;// 弹簧回震效果的缓入缓出函数。
		backIn(t: number): number;// 回退效果的缓入函数。
		backOut(t: number): number;// 回退效果的缓出函数。
		backInOut(t: number): number;// 回退效果的缓入缓出函数。
		bounceIn(t: number): number;// 弹跳效果的缓入函数。
		bounceOut(t: number): number;// 弹跳效果的缓出函数。
		bounceInOut(t: number): number;// 弹跳效果的缓入缓出函数。
		smooth(t: number): number;// 平滑效果函数。
		fade(t: number): number;// 渐褪效果函数。
	}
下面是抄来的，使用tween进行加减速的操作

// 项目遇到了项目需要动态修改Tween的速度，再查阅的一番资料找到了解决方案，特别感谢GT大佬
// https://forum.cocos.org/t/topic/115920
// tween.start() 之后会出现一个 _finalAction 成员。
//修改 _finalAction._speedMethod = true 。之后可以通过 _finalAction._speed 修改速度。
 
// 例
this.nodeTween = tw(this.node)
.sequence(
tw().to(0.5, { position: cc.v3（10,10） }),
tw().to(0.5, { position: cc.v3（20,20） }),
)
.repeatForever()
.start()
this.nodeTween._finalAction._speedMethod = true
this.nodeTween._finalAction._speed = 0.3

标签：缓出,cocos,函数,cc,number,tween,动系统,缓入
来源： https://www.cnblogs.com/cfas/p/16407332.html