[SOLVED] Creating animated pictures class for 2d Hud

I am trying to make an class that make possible to do animated arrows for example :
http://www.animatedimages.org/img-animated-arrow-image-0061-68267.htm
The idea is to get an image and animate it using diferent tecniques, like zoom, alpha change, and scroll down up left right etc.
But there is so many options I could not identify witch one would be adequate to do it like TextureBuffers , pictures with setWrap, etc.
Any tip ?

Fragment shader?

Humm, I dont think so, I am not dealing with lights you see.
I just want to manipuate some picture in order to do this effect :
http://www.animatedimages.org/img-animated-arrow-image-0061-68267.htm
I am not sure witch class allow me to change the picture…
I dont mind with the blink, I can do it just swamping the images anyway.

There are different ways, from slowest to fastest:
-manipulate the image itself (really really slow)
-change the texture coordinates (easiest)
-custom fragment shader to move the texture coordinates on the GPU (fastest, even when batched)

What do you recommend ?
I need a fast approach since I am avoiding nifty for this for performance reasons already.
I think the fragment shader maybe the good one if its not hard to implement… I am expecting something simple like get the buffer from the image, determine the cutoff byte and rearrange the buffer…
Also, changing the texture coordinates means it will need to have wrap infinite so I just count up the texture coordinates ?

With the fragment shader is easier and faster. In order to do this effect you just need to sum g_Time*factor to texCoord, and set the texture wrap to repeat

Seens good, how to I do it ? Witch class ? Texture is the one ?

Step 1: learn shader coding
Step 2: fork unshaded
Step 3: add the lines of code to move the texture coordinates

The tricky part for us helping is that we don’t really know the requirements. Is this the only effect you want? How do you plan to send the effect parameters to the shader? Etc.

Where as if you got through step (1) above then you could answer most of those questions easily and we could give you advice.

2 Likes

No, you do nothing to Texture at all. Texture is just an image and should remain just an image.

Do edit fragment shaders you do shader editing… part of material definition.

Thus my recommended step (1) in my other reply.

Thanks @pspeed , I will look at it.
I found some info about an class called Effect , should I look on it ?

Have you tried looking at the matDefs for particles?

isnt this what you are looking for?

I have no idea what Effect is or where you’ve found it. Doesn’t seem to be a JME class.

Either way, I very much doubt it has anything to do with JME shaders since JME default shaders don’t have anything like what you are trying to do.

I thought that was just a sprite sheet… or does it include texture coordinate-based animation also?

Yes, its an Jm3 class, its in the wiki : http://wiki.jmonkeyengine.org/doku.php/jme3:contributions:tonegodgui:createeffects

No, it’s a tonegodgui class… it’s right in the URL.

I thought it was Jm3 core, since I can instantiate directly : import de.lessvoid.nifty.effects.Effect;

Ops, forget about, it seens its not the same class :blush:

And that one is in nifty, not JME. FYI.

I dont know if I am reading this vert wrong but it looks like it is doing the animation.

niform mat4 g_WorldViewProjectionMatrix;
uniform float m_SizeX;
uniform float m_SizeY;
uniform float m_Position;
 
attribute vec3 inPosition;
attribute vec2 inTexCoord;
 
varying vec2 texCoord;
 
void main(){
 
    float t = m_Position;
    float tPointerY = 1.0 - ((floor(m_Position / m_SizeX)) / m_SizeY) - 1.0 / m_SizeY;
    float tPointerYOffset = (floor(t / m_SizeX)) / m_SizeY;
    float tPointerX = (t - (tPointerYOffset * m_SizeX * m_SizeY)) / m_SizeX;
    texCoord.x = inTexCoord.x / m_SizeX + tPointerX;
    texCoord.y = inTexCoord.y / m_SizeY + tPointerY;
    gl_Position = g_WorldViewProjectionMatrix * vec4(inPosition, 1.0);
}