How to make a platformer game

303
  • 234 favourites

Index

Features on these Courses

Attached Files

The following files have been attached to this tutorial:

.c3p

platformer-abstraction.c3p

Download now 362.85 KB

Contributors

Stats

168,378 visits, 741,592 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Adding behaviors

Construct comes with lots of behaviors. These make your objects work in pre-defined ways, which often saves loads of time. It's possible to re-do everything the behaviors do in the event system, but it is often difficult and time consuming to do that. That's why behaviors are really handy to get your game up and running quickly!

The Platform behavior can take care of the complexities of platform movement for us. However, there's one important tip for using it: the behavior should be applied to an invisible rectangle object, and the player positioned on top. The Platform behavior works much better if the object with the behavior doesn't animate, since changing animation frame can leave the object partly sticking in to a wall which can confuse the Platform behavior. Also, it avoids silly collision situations like your player hanging off a ledge by their nose or something they're holding.

So we need to make an invisible square for the movement first. Double-click the layout to add a new sprite again.

This time we will be using the Animations Editor tools to create our own image.

Click the Resize button in the top toolbar.

A Resize Image Canvas dialog appears. Set the Width to 48 (this will fit with our player character's animation size).

Click OK.

Now select the Fill tool in the left toolbar.

Notice that the left pane now displays the Color palette, you can pick a color from.

You can either select the color in the top rectangle and move the cursor over the horizontal bar to specify its luminosity (if you do not select the appropriate luminosity you might end up with the color black, whatever the tone you chose in the top rectangle), or enter numeric values in the bottom fields.

Pick the color you fancy most, the sprite object will be invisible anyway, it only matters for your convenience.

When you are happy with your choice, click in the image area to fill it.

Finish up by setting the origin point to the bottom like for our player sprite.

Here you have your color square.

Close the Animations editor.

You should see your square in the layout. Make sure to select it, and in the Properties bar, set its name to PlayerBox since it's the box for movement and collision testing for the player. Also, in the Properties Bar, untick the property Initially visible checkbox since we don't want to see it.

We also want to give the Platform movement to the PlayerBox object for more reliable collision detection. Still in the PlayerBox's properties, click Behaviors by Add / edit in the properties bar. In the dialog that appears, click Add new behavior.

Double click the Platform behavior in the Add behavior dialog.

Once this is done, you can see a new set of properties for the PlayerBox object in the Properties bar under the category Behaviors.

We will get back later to modifying those values, once we have finished adding behaviors to our project, in order to have our platformer interactions.

For now we will want to add another behavior to PlayerBox. Following the same steps as previously add the Scroll To behavior.

Scroll To has the effect of a camera following the PlayerBox object, and keeping it at the center of our screen. Now that you have added it, you can close the PlayerBox behaviors dialog.

The last behavior we want to add for now is the Solid behavior, and we want to add it to our Tilemap object. To do so, we will need to unlock the Platforms layer and select the Tilemap object.

Following the same steps as previously, add the Solid behavior to the Tilemap object.

Make sure the Tilemap object is selected and add the Solid behavior to it.Make sure the Tilemap object is selected and add the Solid behavior to it.

The Solid behavior will interact with the Platform behavior, and make sure the character does not simply fall out of the screen, but rests on the existing platforms.

If you preview the project now though, you still will not see anything happening (although you might see some camera movement going on). Remember we have set the PlayerBox object to be invisible. And the Sprite that contains our animations is just staying in its current position without further interaction. Ideally we would like for this Sprite to follow the PlayerBox object.

Let's lock the Platforms layer again and select the Sprite. Rename it to PlayerAnim.

Once done, click the Event Sheet 1 tab on top of the layout view. This is where we define the game's logic using Construct's event system.

Disabled Comments have been disabled by the owner.