libGDX:  Simple  Anima0on  

Jussi  Pohjolainen  Tampere  University  of  Applied  Sciences  

FRAMERATE  INDEPENDENCE  

Framerate  Indepence    

•  Games  run  at  same  speed  no  ma6er  the  framerate  •  In  slow  computers;  30  fps,  fast  computers  60  fps  

–  No  need  to  go  over  60  fps..  •  Example  

–  Fast  computer,  60  fps,  move  object  1  px  at  a  =me  –  Slow  computer,  30  fps,  move  object  2  px  at  a  =me  –  =>  constant  speed  no  maNer  the  framerate!  

•  The  key  to  framerate  indepence  is  delta-­‐'me  –  Time  in  seconds  since  the  last  0ck  (last  render()  call)  

•  100  fps  =>  1/100  =>  0.01  dt  

Moving  Object  •  At  30  fps  vs  60  fps  this  object  will  move  at  different  speeds  –  int speedX = 1; –  batch.draw(texture, x += speedX, 0);

•  This  will  move  the  object  at  constant  speed  regardless  of  fps  –  int speedX = 60; –  batch.draw(texture, x += speedX * deltaTime, 0);

•  If  fps  60,  deltaTime  60/1  =  0.0166  secs  –  x += 60 * 0.016666, x += 1

•  If  fps  30,  deltaTime  30/1  =  0.0333  secs  –  x += 60 * 0.033333, x += 2

libGDX,  delta  and  fps  

•  Querying  FPS  – Gdx.graphics.getFramesPerSecond()

•  Querying  Delta  – Gdx.graphics.getDeltaTime()

Anima0on  

•  Use  Anima0on  class  – Animation walkAnimation = new Animation(frameDuration, frames);

•  Frame  dura0on?  1  /  60  fps  •  Frames?  – TextureRegion  array  

•  TextureRegion?  – Part  of  texture

TextureRegion  

Split  .png  into  TextureRegions  walkSheet = new Texture(Gdx.files.internal(”image.png"));

TextureRegion[][] tmp = TextureRegion.split(

walkSheet,

walkSheet.getWidth() / FRAME_COLS,

walkSheet.getHeight() / FRAME_ROWS );

2D  array  -­‐>  1D   private TextureRegion[] transformTo1D(TextureRegion[][] tmp) {

TextureRegion [] walkFrames

= new TextureRegion[FRAME_COLS * FRAME_ROWS];

int index = 0;

for (int i = 0; i < FRAME_ROWS; i++) {

for (int j = 0; j < FRAME_COLS; j++) {

walkFrames[index++] = tmp[i][j];

}

}

return walkFrames;

}

Rendering  public void render() {

// stateTime was initialized to 0.0f

stateTime += Gdx.graphics.getDeltaTime();

// stateTime is used to calculate the next frame

// frameDuration!

currentFrame = walkAnimation.getKeyFrame(stateTime, true);

spriteBatch.begin();

spriteBatch.draw(currentFrame, 150, 150);

spriteBatch.end();

}

TIPS  

Extend  Sprites  

•  For  each  Sprite  in  screen,  create  own  class  –  class  Monster  extends  Sprite  

•  Add  Monster  aNributes  like  –  speedX,  speedY,  sounds,  …  

•  If  using  anima0on  (previous  slides)  you  could  create  animate()  method  which  is  called  from  the  game  on  every  frame  

•  When  crea0ng  the  Sprite,  remember  to  call  also  setRegion  to  set  the  ini0al  region  for  the  sprite