Advanced particles: Godot Guide

today we're covering advanced particle topics so starting with emission masks to emit particles in a custom shape a brief mention of using sprite sheets in particles creating particle cues so you can have multiple instances of a one shot particle on screen at the same time and finally how to convert particles to particle shaders to grant you more control over your particles and i'll show you how to add some very bare bones physics to your particles as well as usual all the content is available in my github if you follow the link in the description i'm bram and today i will be your godot guide this process will let you emit particles in any shape you need given a spawning texture so let's make particles appear around the rim of the godot icon add the godot icon and particles2d as a child we can then add a particle's material to that particles in godot default to pixel squares when no texture is provided so let's bump up the scale of those until they're more visible then we can set the scale random to full and turn off gravity now we can make our mask i want particles to spawn from the edges of our icon so let's open the icon in whatever image editing software we want to use that can produce pngs and start painting when using an emission mask particles will only spawn in areas sampled from the image that aren't transparent so let's just draw the inner edge of our sprite in white leave the rest blank and export it all as a png now we can click the particles button up in the toolbar and click load a mission mask then select our fresh baby portable network graphic leave the next window as is with solid pixels and ignore colour capture we should see our particles spawning in the provided shape but you'll notice it isn't centered this would be a nice feature but ho-hum let's just move it off to the left by half the width of the icon and up by half the height and boom it's centered for my effect i want the particles behind the sprite there's two ways you could go about this one involves re-parenting and the other lazier option is to go to visibility and check the box show behind parent finito using a mask like this means we can use way fewer particles than just filling the area so feel free to go while bumping that particle count up i'm also going to randomize the angle of the particles and add a scale curve in a bell shape which will make the particles grow into existence saturate to max size for a while and then fade away i'll top that off with some random angular velocity for rotation and we're done just to reinforce that the particles are spawning in the shape of the mask i'll drop the alpha channel of the sprite and you can see those squares in action we can spice up that last animation by making the particles look smoky to achieve that effect a particle sprite sheet will be required i've made one of four smoke textures that you can grab from my github in addition to everything else in this video let's duplicate that last scene and make our changes add the sprite sheet as a texture and everything will go insane for a moment add a canvas material turn particle animation on and increase particle and mh frames to the number of columns your sheet has mine has four also update the v frames to the number of rows mine has only one so that's all nice and easy now we can select random sprites from the sheet by going to the process material animation subheading setting offset to full and set random to one now every particle will select a random sprite from the sheet i'll just wrap up by making it look nice the texture is large and so is our scale so i'll drop the scale way down then up the number of particles i'm also going to use hue variation to skew our grayscale texture towards orange and yellow with a smidge of randomness finally for just a little bit more zest i'm going to duplicate that particle setup make the process material and canvas item unique change the canvas material blend mode to add so that this particle layer will light up the other layer and decrease the scale again remove the hue scale both of those up center it and now it all looks pretty slapping i used this masking process in a fairly novel way to make a spike pit as well in a small hades clone i was working on for this to work your particle texture in my case the spikes need to have their base in the center of the texture this is because you can't choose the scale origin for the particles it's always in the center so i have this spike with its base at the center where it will grow from i drew my spike pit and made a mask with white dots where the spike holes are to be for the emission mask for the particles so let's add a particle material load the emission mask as before note a particle needs to have a process material before you can load the emission mask up the explosiveness so that all the spikes pop out at once and set the gravity to zero we can then drop the scale down to an appropriate size for our texture and add a scale curve we want the scale curve to make the particles emit at full size and then shrink to nothing just drag the right point to the bottom and it'll have some nice easing on both ends already one limitation of this spike pit is you can't control the order in which the particles draw so if your texture is complex you can see your back row of spikes drawing on top of your front row the easiest workaround is to make the texture a flat color without a border so the order of the particles are drawn in doesn't matter but this solution isn't perfect i'd be very interested to hear if anyone has a good solution for this problem at the very least this flat color sells the effect capably let's add our spike pit sprite make the particles one shot and make a short sweet script to trigger it input event is action just pressed ui accept then restart the particle run it and dandy it is still a bit big and slow though let me just fix that perfect this is a really powerful and easy to use tool but doesn't take long at all to set up it will let you instance many copies of a one-shot particle and have them active on screen concurrently so let's throw it together firstly we need particles we want to duplicate so here's a quick recipe particles 2d up the scale up the lifetime set your explosiveness to 1. direction x 0 y minus 1 that'll make it fire upwards gravity 2000 initial velocity 1200 randomness of 0.6 color gradient white at one end to white at the other end with zero in its alpha channel so it'll fade out over time make it one shot and save we now have an explosive spray of pixels for use in our particle queue this is going to be a node 2d that will load a one-shot particle from a scene a set number of times then let us trigger them one at a time so we can have many instances of that particle visible at once we will export a packed scene this is going to be our particle scene let's call that particle then export an int called q count this is going to be the number of particles we instance finally we need a variable set to zero this will be the index of the currently cued particle now in the ready function we want to loop a number of times determined by q count and instance that many particles and add them as children of the current scene then we need a method to get the next particle in the queue this is easy return get child index finally we want a function to get the next particle restart it and increment the index wrapping back to zero when we reach the end of the queue for this we will use a little dash of modular arithmetic for starters getnextparticle.restart will activate the next particle to increase the index with wrapping we are going to make the index equal to index 1 mod the q count mod is represented by the percent sign in most programming languages including gd script and it just gives us the remainder when we divide the left side by the right which will let us wrap back around to zero whenever our index reaches q count thus we can trigger every particle in our queue in order endlessly and we can add more particles with such luxurious ease you won't know what to do with all the free time you've gained now to use it let's save that scene so we can reuse the script in future let's create a new inherited scene from it so we can make a particle queue for our specific case with extra behavior whilst preserving that original script let's extend the script for this scene and save it with a new name and you will see the path to the original script extended at the top this will let us use the get next particle and trigger functions we just defined in this new script we just want to add an input event listening to clicks so let's add a click event to our project settings input map when the click has happened we can call get next particle and set its global position to our global mouse position then we call the trigger function finally load our particle into our exported packed scene and run it now whenever we click the next particle in the queue is moved to where the mouse is and triggered then when we click again the next particle is moved to the mouse and triggered as well and we can see both particles on screen at once rather than restarting the same particle one type of shader i haven't handled on this channel is particle shaders which are how particles are handled under the hood of particle materials in godot so if we want to extend the behavior of particles we need to tackle particle shader code this is quite unique as these shaders need to write data using an in-out keyword and other such unique aspects that all warrants its own video but just to get us started on this advanced topic i'm going to cover converting your particle material to a shader material and how to interact with the particle's velocity and local coordinates so that we can make them bounce off of a flame if you want to research it more there is a great talk which led me to this topic that i will link in the description converting a particle material to a shader is a one-way process so i recommend saving a backup of the particle beforehand now in our new particle scene let's turn off one shot and set emitting to true for the moment so we can observe our particles in real time as we make our changes to the physics if we click the drop-down next to particle material in the process material subheading we get a convert to shader material button this will save all our current parameters and set them to uniform shader parameters for a particle shader and give us the granular control over the particles that we want let's make this resource local to scene and crack this baby open alright we have a 176 line monster shader that controls our particles let's go to the uniform parameters and add a uniform float parameter called bound this will tell our shader where the local y coordinate of our floor is going to be let's make a function that will update the velocity of our particles as one would expect velocity as a vector 2 so our function should return a vector 2. we can call it apply bound and pass in two parameters the first the y-coordinate of the particle and the second the current velocity of the particle in principle our function will check if the particle is below the floor and if so decrease the velocity and point it upwards thus doing a simple bounce if y in is greater than the bound we are below the floor so let's set vel dot y to be equal to minus 0.5 f times absol dot y this will halve the y velocity and make it definitely negative so it will travel upwards if we miss the abs and the particle is stuck below the floor it will change direction every time this bit of code runs we can also multiply the vel vowel.x by 0.75 just to make it lose a bit of velocity which will just look a bit more natural of course you can alter these ratios to taste finally we return vel this will let us leave velocity unchanged if the boundary wasn't passed positions are updated for each particle in the vertex function let's jump to the end which is around line 184 the particle has a velocity we want to assign this is saved to velocity dot x y we can assign this to the result of our apply bound function passing in velocity dot x y as the second parameter the y coordinate however is a little harder to find particle shaders store that data in a transform array bundled with some other information but the y-coordinate is in transform in square brackets 3 dot y let's look at that in action you can see an edge case here which is that the particles get stuck vibrating at the boundary losing velocity too slowly and also gaining momentum from gravity this is something isaac newton doesn't approve of so let's fix it in apply bound when we are below the boundary we can check if velocity is below a minimum threshold and if it is set the velocity to zero otherwise apply the velocity transform we did before so if abs vol.y is less than 75 f vel dot y equals zero else our last case you can rest easy newton we still need to update our local y chord for our explosion queue scene though let's jump back into the script for brevity's sake let's save get next particle to a variable called p change line 8 to use that p variable instead of get next particle then we can set the bound shader param for the process material of p as this scene's been dynamically loaded we won't get any code completion here for the shader parameter so make sure you get the variable name right if you've been following along it's p dot process material dot set shader param in quotes bound then for our second parameter we want to convert the global position of the floor to this particle's local coordinates this is simple enough p dot to local vector 2 in brackets 0 comma 400 close the brackets close the brackets dot y as we only care about the y-coordinate the x-value we give to that vector2 doesn't matter now let's make the particle one-shot again load it into our particle explosion q and try it out we're all done you just added bare bone physics to a particle shader congratulations and that's it do let me know if you're interested in seeing more content about the particle shaders follow my twitter join my discord like and subscribe for more of this jazz in the future as always cheers

Channel: Bramwell Williams

Views: 4,060

Keywords: godot, gamedev, particles, physics, shader

Id: 9RRoKKQ7nF0

Length: 16min 8sec (968 seconds)

Published: Wed Apr 07 2021

Reddit Comments

[u/mrhamoom]

super cool! the spikes are really creative. wouldve never thought of doing that as a particle