I'm creating a basic endless runner game on Android using SurfaceView.

I have background that recreates itself constantly, which was simple enough.

One problem I've always had is getting my head around animating sprite-sheets, not just in Android but other platforms as well.

Based on the problem I'm stuck on right now.. I have a sprite sheet thats 9 images 2 rows, 5 columns, with an empty space at the end of the second row. All of which is one single running animation.

I've made a Sprite Class.

public class Sprite {
    GameView gameView;
    Bitmap bmp;
    private int x, y, width, height;
    private int spriteColumns 5, spriteRows= 2;
    private int currentAnim = 1;

    public Sprite(GameView gameView, Bitmap bmp) {
        this.gameView = gameView;
        this.bmp = bmp;
        this.width = bmp.getWidth() / spriteColumns;
        this.height = bmp.getHeight() / spriteRows;

    public void update() {
       // do something here with currentAnim, x and y;

    public void onDraw(Canvas c) {
       canvas.drawBitmap(bmp, x, y, null);


How do I go about doing this? Am I on the right track so far?


1 Answer 1


Create an arrays for each direction of running index. So, if there is one direction the player can move, all the player can do is either run or not run. You have a single array.

Say the that your animation requires 3 poses: both feet down, left leg up, right leg up. You place them in an array as indexes 0,1,2 respectively.

Then your run_annimation array would be [0,1,0,2] because you want the player to breifly have both legs down when switching feet.

You keep a animation step variable that tells you where you are in the animation. When running stops, the step goes back to 0.

Here's some incomplete psudeo code to get you started.

Int animation[][]; // which bmp's are in each animation sequence
// [0][...] Idle aniation.
// [1][...] Run animation.
Bitmap bmp[];  // all the bmps sliced from the sprite sheet.
step = 0; // Where we are in the animation
Int whichAnim = 0; // Which animation we are playing.

public void animateRun() // Do the run animation.
  if(whichAnim != 1) // If we're not already doing the run animation.
    whichAnim = 1; // Go to the run animation
    step = 0; // And start at the begining.
    return; // Done for now.
  step++;  // Otherwise, we are already running.  Move to the next image in the animation.
  if(step > run_animation.length()) // If it past the end,
    step = 0; // go back to the start of the animation and loop it.

public void animationReset() // When we stop all animations...
  animation = 0; // Go to the idle animation
  step = 0;  // At the begining of the animation.

public void onDraw(Canvas c) // Your draw to take into account
  canvas.drawBitmap(bmp[ animation[whichAnim][step] ]);

Each time through the game loop, if the run key is pressed, before you move the sprite, you call animateRun(). You could simplfy the above by using a setAnimation and changing animateRun to just an general animate function. When the run key isn't pressed that time through the game loop, call animateReset().

Hope that makes sense.

  • \$\begingroup\$ Thanks J.A. Streich, I'm going to try implement this and I'll let you know if I have any more problems. \$\endgroup\$
    – Sawyer05
    May 5, 2015 at 16:33
  • \$\begingroup\$ Thanks again Stretch, The example I was looking at before was using src and dst Rect's but the example you've shown is definitely 100x better \$\endgroup\$
    – Sawyer05
    May 6, 2015 at 22:30

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .