# How to do frame by frame animation in android using open gl es

I have application in some part i am using AndroidDrawable for animation but it giving jerking effect that why i planed to change the code to Open Gl ES for better performance .so far i have googled a lot but did not got any good example .anybody has any idea????

• What did you use to do your animation effect now? Show your animating code. – kabuto178 Oct 3 '13 at 13:20
• I have added my images in animationdrwable and its giving me jerking effect. – Ohh Oct 3 '13 at 13:33
• Are you using an engine? – kabuto178 Oct 3 '13 at 13:44
• Noi am not using any Engine be i am using animation drawable for that i dont think any library is required...and i have also lesss knowledge how to start with open in android.. – Ohh Oct 3 '13 at 14:53
• The way to achieve animation using OpenGL ES is to use a quad with a texture mapped to it. Then change the texture to use for the quad at some set interval to the next frame of the animation. You will of course need to take care of looping and sequence order yourself. – free3dom Oct 3 '13 at 15:23

First you'll need to be able to setup OpenGL ES for 2D rendering. Have a look at this answer on SO for some basic introductory info on how to setup and get a texture loaded and ready for 2D rendering.

Once you have that going it is a simple matter of changing the bound texture at some interval. First, you will need some class members (globals):

// these are globals (class members)
double time = System.nanoTime();   // time value (initialize it)
float frameTime = 0;               // frame animation time
int frames[10];                    // 10 animation frames
int currentFrame = 0;              // active frame


Next, you should load the animation frames as textures during startup, or when you need them (see the answer above for details).

The final piece of the puzzle would happen in onDraw each frame. Something like this:

// calculate the elapsed time, and update timer
float elapsedTime = ( System.nanoTime() - time ) / 1000000000.0f;
time = System.nanoTime();

// now you can use the elapsed time to determine when to switch frames
frameTime += time;             // count frame time
if ( frameTime >= 0.06f )  {   // if 1/60th of a second passed (for 60fps)
frame++;                    // step to next frame
if ( frame > 9 )            // if end of sequence
frame = 0;               // restart sequence
}

// now you just bind the current "frame" as the texture
gl.glBindTexture( GL10.GL_TEXTURE_2D, frames[currFrame] );


This is a very basic example of what you need to do. Of course, there are many different (and even better) ways of doing this but this should get you started in the right direction.

One very important thing you might want to investigate (instead of using this method) is using a texture atlas (where multiple frames are placed on the same texture) and instead of switching the bound texture each update, you simply switch the texture coordinates. This is especially essential if you will have many animated sprites onscreen at once, so as not to kill your framerate :) Here is a very basic example.