Simple Screen Shake

Lots of games add excitement by using screen shake, when your character gets hit or on certain events a little rumble really lets the player know something has occurred. While prototyping some features of Endure I revisited some old code to add a small rumble when the fishing line breaks:

Small Screen Shake

Large Screen Shake (Over the top)

Code (Simple Rumble Class)

Pastie Source Code

 

public class Rumble {

  public float time;
  Random random;
  float x, y;
  float current_time;
  float power;
  float current_power;

  public Rumble(){
    time = 0;
    current_time = 0;
    power = 0;
    current_power = 0;
  }
  
  // Call this function with the force of the shake 
  // and how long it should last      
  public void rumble(float power, float time) {
    random = new Random();
    this.power = power;
    this.time = time;
    this.current_time = 0;
  }
        
  public void tick(float delta, GameController gc, Hero hero){
      // GameController contains the camera
      // Hero is the character centre screen
    
    if(current_time <= time) {
      current_power = power * ((time - current_time) / time);
      // generate random new x and y values taking into account
      // how much force was passed in
      x = (random.nextFloat() - 0.5f) * 2 * current_power;
      y = (random.nextFloat() - 0.5f) * 2 * current_power;
      
      // Set the camera to this new x/y position           
      gc.camera.translate(-x, -y);
      current_time += delta;
    } else {
      // When the shaking is over move the camera back to the hero position
      gc.camera.position.x = hero.x;
      gc.camera.position.y = hero.y;
    }
  }      
}

This is all the code to achieve a basic screen shake. The timer for the affect works its way down to zero then stops. For large shakes once the rumble is over it will snap back to the character and look very jumpy but this is just a prototype.

To use the class create a new instance of it then conditionally produce a new RUMBLE! Below you see on the line snapping a small shake takes place by changing the power and time parameters, then the main render loop just needs to call the tick function:

public Rumble  rumble;
this.rumble = new Rumble();

if (line.tension > line.max_tension){ // LINE SNAP
  gc.rumble.rumble(.2f, .1f); 
  state = STATE.IDLE;
}

if (gameController.rumble.time > 0){
  gameController.rumble.tick(delta, gameController, hero);
}

So there you go a nice feature to add to any game that could do with some atmosphere or excitement, could be progressed much further and also be used in loads of ways, great for explosions, thunder storms etc.

Thanks for reading !_!

Advertisements

2 thoughts on “Simple Screen Shake

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s