Make a tip and tilt platformer using physics

1

Attached Files

The following files have been attached to this tutorial:

.capx

physicsplatformer.capx

Download now 186.18 KB

Stats

3,612 visits, 4,952 views

Tools

Translations

This tutorial hasn't been translated.

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.

Published on 24 Jul, 2014. Last updated 19 Feb, 2019

UPDATE: Updated links

Welcome to my second tutorial!

In this tutorial, I'll show you how to make a tilt platformer using Construct 2's physics behavior.

Basics

The platform

1. Create a rectangular sprite, this will be the platform.

2. Add the "Physics" behavior into the sprite and assign the behavior's parameter:

Immovable: Yes

Collision mask: Use collision polygon or Bounding box

Prevent rotation: Yes

Density: 1

Friction: 0.5

Elasticity: 0.2

Linear damping: 0

Angular damping: 0.01

Bullet: No

3. Add these events into the event sheet:

    Keyboard: Left arrow is down
    Platform: Is clockwise from -45
    --Platform: Rotate 1 degrees counter-clockwise
    Keyboard: Right arrow is down
    Platform: X Is clockwise from 45
    --Platform: Rotate 1 degrees clockwise

4. Test the game. If you press Left, the platform will rotate to the left and vice versa.

5. As you see in the preview, the platform isn't rotate back to the default angle when you release the arrow key. To fix this, add these events:

    Keyboard: X Left arrow is down
    Keyboard: X Right arrow is down
    --Platform: X Is clockwise from 0
    ----Platform: Rotate 1 degrees counter-clockwise
    --Platform: Is clockwise from 0
    ----Platform: Rotate 1 degrees clockwise

6. Now preview the game once again. If you release the arrow key, you should see that the platforms were rotating back to the angle of 0 degrees.

7. Duplicate the platform to the position you prefer, you can duplicate as many as you like. Drag the platform while pressing Control to duplicate it.

The circle/ball

1. Create a circular sprite, this will be the ball.

2. Add the "Physics" behavior into the sprite and assign the parameters:

Immovable: No

Collision mask: Circle

Prevent rotation: No

Density: 1

Friction: 1

Elasticity: 0.2

Linear damping: 0

Angular damping: 0.01

Bullet: No

3. Move the circle to the top of the highest platform in the layout.

4. Test the game. The ball will fall on the platform. When you rotate/tilt the platform, the ball will roll off the tilted platform.

5. As you trying to move the ball by tilting a platform, the controls tilting all platforms in the layout. To fix this, you need to make an invisible detector.

Detector (for detecting platforms)

1. Create an empty sprite and make sure the sprite have the same size with the ball. Set "Initial visibility" to "Invisible".

2. Click the "Set origin and image points" button and move the origin about 16 pixels to the top.

3. Add these events to attach the detector to the ball.

    System: Every tick
    --Detector: Set position to (Ball.X, Ball.Y)

4. Update these events to detect the platform:

    (ADD) Detector: Is overlapping Platform
    --Keyboard: Left arrow is down
    --Platform: Is clockwise from -45
    ----Platform: Rotate 1 degrees counter-clockwise
    --Keyboard: Right arrow is down
    --Platform: X Is clockwise from 45
    ----Platform: Rotate 1 degrees clockwise

5. Test the game, now the controls should control the platform that the ball step on.

Final touches

Camera movement

1. Add these events:

    System: Every tick
    --Detector: Set position to (Ball.X, Ball.Y)
    --(ADD) System: Scroll to position (Ball.X, Ball.Y)

2. If you test the game, the camera should follow the ball. (If you make the layout large)

Goal pad

1. Add a tiled background, color it with your favorite color. But I recommend you make a checkerboard pattern into the image.

2. Drag the background to the lowermost platform and resize it to fit the platform.

3. Add a boolean instance variable to the ball and name it "finished".

4. Add these events to trigger the goal:

    (ADD) Ball: X Is finished
    --Detector: Is overlapping Platform
    ----Keyboard: Left arrow is down
    ----Platform: Is clockwise from -45
    ------Platform: Rotate 1 degrees counter-clockwise
    ----Keyboard: Right arrow is down
    ----Platform: X Is clockwise from 45
    ------Platform: Rotate 1 degrees clockwise
    (ADD)
    --Ball: Is overlapping FinishTile
    ----Set finished to true

5. Test the game. If the ball is touch the goal, the controls will disabled.

Finished!

Great! You just finished the tutorial. But there's some tweaks that you can do:

- Make fireworks when the ball is touching the goal.

- Use another type of circular sprites like a monkey in a ball (Super Monkey Ball) or a checkerball (Neverball).

- Make effects when the finish trigger is on.

Download the example source

Download from the link at the left side of the screen.

Demo

https://www.scirra.com/arcade/tutorial-games/physics-tilt-platformer-example-1708

.CAPX

physicsplatformer.capx

Download now 186.18 KB
  • 0 Comments

Want to leave a comment? Login or Register an account!