Started this one early in the week. I wanted to poke and prod at the limitations of using custom shaders with an atlas. So I figured I would create a dissolving effect shader that could possibly be applied to a sprite animation. Making this effect with a static texture on a model quad would be much simpler to do but you would need to be very creative to add a sort of sprite animation along with it, that’s one of the great uses of an atlas. Instead of using some code to generate noise in the shader itself I could take less than a minute creating a simple noise texture and try to apply it to the material. So that’s where I started.
As the manual states :
Sprite, tilemap, GUI and particle effect components automatically gets a
sampler2Dset. The first declaredsampler2Din the shader program is automatically bound to the image referenced in the graphics component.
this means that the first slot “0” in the sampler is occupied by this set. In the sprite .fp its set as a sampler2d texture like so:
uniform lowp sampler2D texture_sampler;
In a material you can add more texture slots but when using an .atlas you cannot set any textures. However as the manual also says:
(If you need multiple textures in a shader, you can use
render.enable_texture()and set texture samplers manually from your render script.)
This sort of works where you can setup a render target and buffer and draw to it once and access it in the shader as second slot but I got strange results and there is a bigger issue at play that I will highlight further down.
So instead of trying to find a way around the atlas I realized I could simply add the noise texture to the atlas itself and create an offset in the vertex program to set the noise texture how I want it. So that’s what I did. Then I came across another issue that when playing an animation the supplied attribute texture coordinates obviously change with every frame in the animation. This means that the offset I created for the noise texture in the atlas will also move around with every frame change.
Trying to create dummy texture coordinates would not work and I couldn’t find any solutions. The alternative is to use a single frame in the animation to what advantage I have and set the frame with the noise texture offset first then apply the dissolve effect then after resume sprite animation. This works ok and can be improved.
So as you can see in the atlas, the top left green highlighted image is the noise texture, I set sprite flipbook to that blue highlighted frame and using normalized offset I know that I only need to offset in the Y axis to 0.28 and then I can use the noise in the shader.
There are ways to improve this technique, like using the sprite cursor and making a table with all the offsets needed for each frame and getting the cursor and setting a constant for the offset. Not sure how expensive this would be but seems doable.
conclusion:
This technique works and can be improved however the shader is very custom to the atlas it belongs to and would need to be customized for every atlas it is applied to, in other words its not a very universal shader but sometimes you just need that extra juice in your games. I learned quite a bit with this one and loved it.
Defold shaders:
One game changer improvement imo would be the ability for users to supply additional attributes, texture coordinate etc. to the vertex program. Creative possibilities with shaders applied to atlas animations/ tiles & 3d would get much more diverse and interesting.
attribute mediump vec2 texcoord0;
attribute mediump vec2 texcoord1; etc…
Demo can be played on itch:
Sample project can be found here on github:
Cheers! 