Animate the Playable Character
This part of the tutorial explains how to animate the playable character.
You'll learn how to:
- Add animations to an object.
- Use events to trigger animations.
Series
You are reading Part 4 of the Platformer Tutorial.
- Part 1: Getting started
- Part 2: Create a Playable Character
- Part 3: Create Platforms
- Part 4: Animate the Playable Character
- Part 5: Add Collectible Coins to the Game
- Part 6: Add Enemies to the Game
- Part 7: Make Enemies Kill the Player (and the Player Kill the Enemies)
- Part 8: Add Checkpoints to the Game
Step 1: Add a jumping animation to the player
In GDevelop, you can add animations to an object and trigger those animations when something happens (such as when a player jumps).
Add the "Jumping" animation to the "Player" object
To add a jumping animation to the "Player" object:
- In the Objects panel, right click the "Player" object.
- Select Edit object.
- Click Add an animation.
- Assign a name of "Jumping" to the animation.
- Click Add.
- From the file chooser, select the "p1_jump.png" asset.
But while the animation is attached to the object, it won't play unless something triggers it.
Trigger the "Jumping" animation
To trigger the "Jumping" animation:
- Switch to the Events editor.
- Create a new event.
- Add the Is jumping condition to the "Player" object.
- Add the Change the animation (by name) action to the event.
- In the Animation name field, enter the name of the "Jumping" animation. You must wrap this name in double quotes (i.e.
"Jumping"
). - Click OK.
Based on these changes, jumping triggers the animation.
Step 2: Add an idle animation to the player
There's a problem with the jumping animation: it doesn't reset when the player has finished jumping. To fix this, trigger the "Idle" animation when the player returns to the platform.
Detect when the player is on the floor
GDevelop refers to the surface of a platform as the floor.
To detect when an object is on the floor:
- Create a new event.
- Add the Is on floor condition to the "Player" object.
Detect when the player is not moving
It only makes sense to trigger the "Idle" animation when the player is still, since moving the player should trigger the "Running" animation (explained in the next step).
To detect when the player isn't moving:
- Add the Is moving condition to the "Player" object.
- Toggle the Invert condition option to the on position.
The Invert condition option inverts the way a condition works. This means the Is moving condition becomes the Is not moving condition.
Trigger the "Idle" animation
When both of the previous conditions are met, trigger the object's "Idle" animation:
- Add the Change the animation (by name) action.
- In the Animation name field, enter the name of the "Idle" animation. You must wrap this name in double quotes (i.e.
"Idle"
).
If you preview the game, the "Player" object resets to the "Idle" animation after jumping.
Step 3: Add a running animation to the player
Add the "Running" animation to the "Player" object
- Add an animation named "Running" to the "Player" object.
- From the file chooser, select all of the following assets:
- p1_walk03.png
- p1_walk04.png
- p1_walk05.png
- p1_walk06.png
- p1_walk07.png 3. Enable the Loop option. When enabled, the animation continually plays for as long as it's active (rather than playing once and stopping). 4. Click Apply.
Trigger the "Running" animation
- Create a new event.
- Add the Is on floor condition to the "Player" object.
- Add the Is moving condition to the "Player" object.
- Add the Change the animation (by name) action to the event.
- In the Animation name field, enter the name of the "Running" animation. You must wrap this name in double quotes (i.e.
"Running"
). - Click OK.
If you preview the game, the "Running" animation plays as the player moves.