Table of Contents
4. Background and Camera
Series
You are reading Part 4 of the Space Shooter Tutorial.
Creating the background object
Click on Add a new object and select Tiled Sprite. Then, type “Background” in the name field and select background.png from the asset folder as an image. Click apply.
Now, we'll add on the scene a layer where the background will be. To add a layer, click on the Layers editor icon on the upper right, and open the layer view. Add a new layer called “Background” and switch its position with the Base Layer. By changing their positions, the background layer will be behind the base layer (that contains the rest of the game objects).
Locating background on the scene
Open the properties panel from the upper right icons. Then, drag and drop the background object from the objects panel to our scene's upper left corner.
Select background object on the scene and open the properties panel. Change size mode to Custom Size, replace the width, and the height with 900 and 500 in order.
Now, you will be able to see the player on the scene, with the background behind.
Making a player stay on the screen
To make a player stay on the screen, we need to install a new behavior. So, open the Player behavior view, and add new behavior. Type “stay” on the search bar to find and install “Stay On Screen” behavior.
Add Stay On Screen behavior to our player.
Fill the Bottom & Right margin with 70, and Top & Left margin with 10. Then click Apply.
Moving the player, background, and camera
Open the Events tab. Create a new event and add a new action. Type “camera” on the search bar, and select the Camera center X position. Change modification sign + (add) and fill the value with to 150 * TimeDelta().
Add a new action under the previous one. This time choose Background object and select Image X offset.
Change modification sign + (add) and fill the value with to 40 * TimeDelta().
This means that the background object will not move, but the image displayed on it will be moved, giving an impression of movement.
As the camera on the base layer moves towards the left, we have to add a force to the player so that it moves at the same speed. Add a new action under the previous one. Then choose Player and select Add a force. Fill the speed on X-axis with 150 and leave Y-axis as it is.
Testing out
This is the latest version of the Events page.
It is the demo of what we had covered in this chapter. Now, the camera and background move smoothly. The player cannot leave the screen, and the shooting of the player is optimized.