Android Question Ripple Effect using Libgdx + Shaders

[MarcTG]

Hello

I'd like to use a ripple effect on touch and I read that this could be done with shaders. I found vertex and fragment code for ripple effects but I am not sure how to use them... The attached file contains the B4a code + the shader program.

Please help

 

[Informatix]

Hello

I'd like to use a ripple effect on touch and I read that this could be done with shaders. I found vertex and fragment code for ripple effects but I am not sure how to use them... The attached file contains the B4a code + the shader program.

Please help

I'm a real beginner with shaders. It's a good opportunity to improve my skills. I plan to include a few shader demos in the new version of libGDX (should be released this week).

 

[MarcTG]

I'm a real beginner with shaders. It's a good opportunity to improve my skills. I plan to include a few shader demos in the new version of libGDX (should be released this week).

Thanks Fred. I will be waiting for this

 

[Informatix]

Hello

I'd like to use a ripple effect on touch and I read that this could be done with shaders. I found vertex and fragment code for ripple effects but I am not sure how to use them... The attached file contains the B4a code + the shader program.

Please help

The fragment shader in your archive is unusable without knowing what parameters are expected (e.g. the code uses two textures; without details on these textures, I cannot do anything).
I tried to find another ripple shader but the only one that I found is not very convincing.

 

[MarcTG]

The fragment shader in your archive is unusable without knowing what parameters are expected (e.g. the code uses two textures; without details on these textures, I cannot do anything).
I tried to find another ripple shader but the only one that I found is not very convincing.

Hey Fred, thanks for trying

I probably have to look for other shaders once I understand what I should be looking for... If I may ask, can you share an example where a sprite is being used with a shader touch event... Even though you found a ripple effect that is not convincing, can you please share a working example of that?

At this point I am more interested in learning how it works (additional comments in the code are always much appreciated ).

 

[Informatix]

Hey Fred, thanks for trying

I probably have to look for other shaders once I understand what I should be looking for... If I may ask, can you share an example where a sprite is being used with a shader touch event... Even though you found a ripple effect that is not convincing, can you please share a working example of that?

At this point I am more interested in learning how it works (additional comments in the code are always much appreciated ).

You cannot pass a sprite to your shader. Shaders are written in GLSL, and so use only OpenGL objects. You have to know the basics of OpenGL to start using shaders. If you don't know what are vertices and texture unit, you will be in trouble and won't do anything. You have to understand also the basics of this new language. The language is not very complicated but the terminology is unusual (the variables passed from the vertex shader to the fragment are declared with "varying", the variables exchanged with the application are "uniforms", etc.).
By playing with shaders, I saw that all shaders written for WebGL, which can be found on popular sites like ShaderToy, can be reused in your LibGDX app with almost no change. I created an example (easily) with these two shaders:
https://www.shadertoy.com/view/lsfGzr
https://www.shadertoy.com/view/Mdf3zr

 

[Informatix]

For now, don't use the GetUniformLocation function because it is buggy. It's fixed in the new version.

 

[MarcTG]

You cannot pass a sprite to your shader. Shaders are written in GLSL, and so use only OpenGL objects. You have to know the basics of OpenGL to start using shaders. If you don't know what are vertices and texture unit, you will be in trouble and won't do anything. You have to understand also the basics of this new language. The language is not very complicated but the terminology is unusual (the variables passed from the vertex shader to the fragment are declared with "varying", the variables exchanged with the application are "uniforms", etc.).
By playing with shaders, I saw that all shaders written for WebGL, which can be found on popular sites like ShaderToy, can be reused in your LibGDX app with almost no change. I created an example (easily) with these two shaders:
https://www.shadertoy.com/view/lsfGzr
https://www.shadertoy.com/view/Mdf3zr

I did not mean it in that sense. I mean to use a shader for something like a ripple effect while a sprite or pic is set/running in the background...

here's an example of a ripple effect for libgdx:
https://github.com/libgdx/libgdx/bl.../src/com/badlogic/gdx/tests/WaterRipples.java

Can we do something similar in B4A?

I am interested to see your new examples .
Thanks for taking the time to look at all this and provide updates

 

[Informatix]

here's an example of a ripple effect for libgdx:
https://github.com/libgdx/libgdx/bl.../src/com/badlogic/gdx/tests/WaterRipples.java

They removed this example (you're looking at an archived file) because it was written for OpenGL 1.0 which is no longer supported by libGDX (that being said, it is not really complicated to port it to OpenGL 2.0; you just have to render the mesh with a very basic shader because the effect is coded in Java). I tried this demo a few months ago and I was not convinced by the result. For me, a good ripple effect is this:
but I don't know how to do it.

 

[Informatix]

This tutorial should answer to your question about rendering sprites with shaders:
http://www.b4x.com/android/forum/threads/shaders-in-libgdx.45441/