Skip to content
Download

Parallax background

You want mountains in the background that move slower than the ground when the camera moves. This effect is called parallax.

  1. Import the image of the mountains as a sprite.
  2. In the Camadas panel, create a Fundo (background) layer called Montanhas and drag it below the others (only the sky stays behind it).
  3. In the layer’s Inspector, choose the Sprite and check Repetir H, so the image repeats horizontally.

In an object that exists in the level (a controller with no sprite will do):

void Fase::onUpdate() {
setLayerPosition("Montanhas", scene().camera.x * 0.5f, 40.0f);
}
  • scene().camera.x is the position of the camera: the left edge of what shows on the screen.
  • setLayerPosition("Montanhas", x, y) puts the corner of the layer’s image at (x, y) of the room.
  • Multiplying by 0.5f makes the layer move half of what the camera moves. On the screen, it seems to pass slower than the ground, like something far away.

The number is how much the layer “sticks” to the screen: 0 leaves the image fixed to the level (no parallax), and 1 leaves it fixed to the screen (it never moves). The closer to 1, the further away it looks.

Several layers. Use one number for each: the further ones, closer to 1.

Clouds that move by themselves. No code needed: in the Inspector of the Fundo layer, set a Velocidade (speed) in X, like -0.2.