[SOLVED] Particle System utilizing single random sprite from sprite sheet

Hey guys! I’m looking to use a sprite sheet on a particle system in a way that each particle spawned has a different sprite pulled randomly from a sprite sheet. I see there’s a way to animate each particle based on a sprite sheet, but I’m not looking to do sprite sheet animations. My goal is to avoid having to create multiple particle systems. I tried setting the animStartFrame variable in the update loop of an attached script component but it just causes the entire particle system to restart every frame.

Is there a way for me to assign a random sprite from a sprite sheet per particle in a particle system?

Not sure if this is doable without modifying the engine. But given the existing pipeline this indeed may be doable.

Here is the the shader chunk responsible for choosing the current frame for the animation loop:

And here is where the params/uniforms are being set:

You may be able to change the ordering to achieve some random frame picking.

Hmm, perhaps this could help?
http://playcanvas.github.io/#graphics/particles-start-frame.html

1 Like

Thanks for sharing @LeXXik, I wasn’t aware of that engine example.

And I think I’ve misunderstood what @steveEXC has been asking, I’ve updated my answer.

1 Like

From what i’ve gathered, the particle system can’t currently support the randomisation of particle sprites from a single texture. Using animStartFrame could achieve this effect from a single sprite sheet but it’d require creating multiple particle systems, which you’ve said you’d like to avoid.

Per particle randomisation has been mentioned before in: https://github.com/playcanvas/editor/issues/13

I’m going to look into implementing this!

1 Like

@LeXXik Thanks for the link. This example does modify the particle’s start frame, but it does it for every particle in the system. From what I can tell, that example has four separate particle systems and I’d like to achieve this effect with just one. (Though for my use case I don’t need the sprite animation.)

@Elliott I’m excited to hear that there are particle system functionality additions incoming! But until those additions arrive…

@Leonidas …thank you for sharing those code bits! It looks like a great starting point for me to dig in and try to implement this feature myself in the interim until it is officially added to the engine.

1 Like

@steveEXC

If you’re willing to implement it yourself, here’s the code snippet for how I got it working locally:

I modified the following line:


as follows:

texCoordsAlphaLife = vec4(quadXY.x * -0.5 + 0.5 + floor(rndFactor3.x / animTexTilesParams.x), quadXY.y * -0.5 + 0.5 + floor(rndFactor3.y / animTexTilesParams.y), (alphaDiv * 2.0 - 1.0) * alphaDivMult * fract(rndFactor*1000.0), nlife);

Essentially just shifting each particles texCoords u/v values to random coordinates on the texture. Bare in mind this is only modifying the mesh pathway for the particle system.

1 Like

@Elliott That looks like it’ll do great, thanks so much! I was able to make a build and test it in my editor using the “use_local_engine” url tag. You did all the work for me. :grin:

After reading the recent engine release notes, I remembered this thread. I think the new feature matches your request, so adding it here for future reference:

http://playcanvas.github.io/#graphics/particles-random-sprites.html

Yeah, it’s enabled in the Engine. Next step is @Elliott is going to expose it in the Editor’s Inspector panel for the particlesystem component. :tada:

3 Likes

Thanks for the hint. For now I just set it up via code, like:

    this.entity.particlesystem.animNumAnimations = 12; // or whatever number of tiles you have
    this.entity.particlesystem.randomizeAnimIndex = true;

@Elliott is there an estimate on when this will be exposed in the inspector?

Best,
Rene

1 Like

Hi Rene,

This should go out in the very near future :slight_smile:! I’ll make a note to let you know when it’s released.

Best,
Elliott

2 Likes