02.obstacle-course

Setting up the obstacle course’s scene

In this lesson, we’ll bring the character and random rocks from the past two series into a level scene we prepared for you. It’ll be the foundation for our obstacle course.

In this series, we drew the level for you. This lets us focus our attention on physics interactions and the game flow. We’ll learn about designing levels with tilemaps later in the course.

We also included fresh copies of the top-down character and rocks from previous chapters to ensure we’re working with the same files and code.

Creating the scene

In the godot-practice project, start by creating a new scene. Go to Scene -> New Scene and click the 2D Scene button in the Scene dock. Rename the node to ObstacleCourse and save the file in the ObstacleCourse/ directory.

Press Ctrl+Shift+A to instantiate the Course.tscn file. It’s a small level that we prepared for you.

We can now add our top-down character to the scene. Press Ctrl+Shift+A again to add an instance of ObstacleCourse/Godot.tscn as a child of the Course node.

Click and drag the character in the viewport to move it to the center of the top-left room. This will be the character’s starting position.

You can already run the scene and move the character. It’ll collide with walls as we prepared those collision shapes, but you can walk over rocks and in the empty space.

Also, the view doesn’t move with the character. Let’s fix this.

Adding a camera to follow the player

We use a level much larger than what fits on the screen.

By default, the game view stays fixed on the blue rectangle in the image below. It doesn’t move with the player.

To move the view, we need to attach a camera to the player: the camera will move with the player, and the view will follow the camera.

Select the Godot node in the scene dock and add a Camera2D as a child of it.

Go to the Inspector and turn on the Current checkbox. This will tell the view to follow this camera.

You can have multiple cameras in your scenes and switch between them using the Current property. The last camera set to Current in your code or in your scene is the one the view follows.

You can already play the scene and move around to explore the level. Notice how rocks appear on the grass. It’s because, in the Course scene, we use a copy of the rock generator script we coded in the previous series.

Let’s look at one last thing in this lesson: the sprites’ drawing order.

Using a YSort node to get the correct drawing order

By default, Godot draws sprites and textures in the scene tree order: the nodes at the bottom of the Scene dock draw in front of the nodes at the top.

Take this scene. Because the Wall sprite is below Godot in the scene tree, the wall appears on top.

But if we move Godot up in the view, it looks fine.

As you can see, depending on the character’s position, we’d like to draw them above or below the wall.

More precisely, we want the character to draw behind the wall when its Y position is lower than the wall’s. We also want them to appear in front of the wall when their Y position is greater than the wall’s.

The engine provides a node that does just that, called the YSort node. It automatically sorts its immediate children based on their Y positions, making nodes with a higher Y position appear on top of nodes with a lower Y position.

In our ObstacleCourse scene, the Course node is a YSort node.

Thanks to this, you can walk in front and behind walls without drawing order issues.

If you run the scene, you’ll notice we generate rocks on grass areas. We want the rocks to be obstacles that force the player to navigate between or around them. As you can see in the image below, they currently do not have collision shapes.

If you can’t see the collision shapes, please turn on Debug -> Visible Collision Shapes.

We’ll add collision shapes to the rocks and turn them into obstacles in the next lesson.