[LayaAir3]适用于Laya3.3的粒子系统 Proton

proton是一个js的粒子库,官方适配了很多第三方渲染器, 现在有需要的朋友可以尝试使用, 在laya3.3中我们已经投入生产环境
适配的proton仓库地址:https://github.com/citizenll/Proton-Laya
原版proton仓库地址: https://github.com/drawcall/Proton
下面是proton官网实现的粒子效果展示:
 
注意有的效果在laya中实现起来需要点特效处理, 比如有的示例是canvas渲染器, 但是渲染效果清屏的颜色是半透明的, 会残留上次绘制以形成特殊效果, 在laya中使用graphics指令绘制是每帧绘制完都会清楚指令, 如果保留了指令那么绘制指令就会暴增(当然这个也就是能实现残留效果),  反正在实现的时候需要调整下思路即可
 
下面给出一个在laya中的粒子效果实现:

const { regClass, property } = Laya;



@regClass()

export class PageParticles extends Laya.Script {

    declare owner: Laya.Sprite;

    @property({ type: Laya.Texture })

    dot: Laya.Texture

    proton: proton



    disabled: boolean = false;



    //组件被启用后执行，例如节点被添加到舞台后

    onEnable(): void {

        this.proton = new proton();

        this.createParticle();

        let renderer = new proton.LayaRenderer(this.owner);

        this.proton.addRenderer(renderer);

    }





    createParticle(): void {

        let emitter = new Proton.Emitter();

        emitter.damping = 0.0075;

        emitter.rate = new Proton.Rate(100);

        emitter.addInitialize(new Proton.Body(this.dot, 32));

        emitter.addInitialize(new Proton.Position(new Proton.RectZone(this.owner.x, this.owner.y, this.owner.width, this.owner.height)));

        //@ts-ignore

        emitter.addInitialize(new Proton.Mass(1), new Proton.Radius(proton.getSpan(5, 10)));



        let mouseObj = {

            x: this.owner.width / 2,

            y: this.owner.height / 2

        };

        let repulsionBehaviour = new Proton.Repulsion(mouseObj as any, 0, 0);

        let crossZoneBehaviour = new Proton.CrossZone(new Proton.RectZone(this.owner.x, this.owner.y, this.owner.width, this.owner.height), 'cross');

        emitter.addBehaviour(repulsionBehaviour, crossZoneBehaviour);

        emitter.addBehaviour(new Proton.Color('#ffffff', '#5C7824'))

        emitter.addBehaviour(new Proton.Scale(proton.getSpan(.1, .4)));

        emitter.addBehaviour(new Proton.Alpha(.5));

        emitter.addBehaviour(new Proton.RandomDrift(10, 10, .2));



        emitter.addBehaviour({

            initialize: function (particle) {

                particle.tha = Math.random() * Math.PI;

                particle.thaSpeed = 0.015 * Math.random() + 0.005;

            },

            applyBehaviour: function (particle) {

                particle.tha += particle.thaSpeed;

                particle.alpha = Math.abs(Math.cos(particle.tha));

            }

        });



        emitter.emit('once');

        this.proton.addEmitter(emitter);

    }



    //组件被禁用时执行，例如从节点从舞台移除后

    onDisable(): void {

        this.proton.destroy();

    }



   

    //每帧更新时执行，尽量不要在这里写大循环逻辑或者使用getComponent方法

    onUpdate(): void {

        if (this.disabled) return

        this.proton.update();

    }

}