美文网首页
tween 动画

tween 动画

作者: skoll | 来源:发表于2023-06-09 16:18 被阅读0次

可以执行动画的东西太多了,做个总结,tween很强大

角度变化

var scale = { r: -Math.PI };
this.tweens.add({
            targets: scale,
//目标
            duration: 2000,
            r: Math.PI,
//具体的属性
            ease: 'Linear',
            repeat: -1
        });

数字变化

1 .就按照上面的方式,角度应该也算是数字的一种

const scale = { i: -64, x: 16, y: -16 };
this.tweens.add({
            targets: scale,
            duration: 1000,
            i: 64,
            x: -16,
            y: 16,
            ease: 'Linear',
            repeat: -1,
            yoyo: true
        });
 textCallback (data)
    {
        // data.y += scale.y * data.index;

        if (data.index % 2)
        {
            data.y += scale.x;
        }
        else
        {
            data.y += scale.y;
        }

        return data;
    }
//动态字体此起彼伏的效果

blitter tween动画

const bob = this.blitter.create(i * 32, 0, this.frame);

        this.tweens.add({
            targets: bob,
            duration: 2000,
            y: 650,
            delay: Math.random() * 2,
            ease: 'Sine.easeInOut',
            repeat: -1,
            yoyo: true
        });

相关文章

网友评论

      本文标题:tween 动画

      本文链接:https://www.haomeiwen.com/subject/reanedtx.html