In our previous lesson we add behaviors to objects. If remember,
we found that our player character doesn’t animate when moving and jumping. In
this lesson, we are going to fix that. We already have added one animation to
our character. That is the “idle” animation. So let’s add other animations.
Step 1
Now we are going to add “run” animation. Go to Edit
Object in “Bob” (you know how to if you followed the previous lesson).
Click ADD AN ANIMATION +. This will add an empty animation to your
character. Rename this animation to “run”. Click ADD + button. Now navigate
to assets folder and go to player > run and select all the images, then
click ok to add images to animation.
Step 2
Click ADD AN ANIMATION + button again. Rename this
animation to “jump”. Click ADD+ button and add image “1.png” from
player > jump folder. Click ADD AN ANIMATION + button again.
Rename this animation to “fall”. This time select “2.png” from player
> jump folder. If you follow the instructions correctly, your character
properties should look like this;
If everything is done, click APPLY to save the
changes you’ve made. If you hit the Preview button and see, still
nothing changed. Well, this is because we need to program which animation to
play when we control the player. This is where we need Events. So it’s time to
create our first event!
Step 3
Switch to “Level 1” scene’s event editor. You’ll see nothing
at the moment. Since we haven’t created any event so far. This is where we add
our game logic. You don’t need any coding knowledge to create events. It’s pretty
simple visual editor anyone can learn within short period of time. But if you
have a basic knowledge in programing concepts, that would be great. Anyways, it
not compulsory to know coding.
Click Add a new empty event button (Figure 1) from
the top tool bar. This will ad an empty event (figure 2). Event has two sides.
One is to define our condition and the other side to define the action. Click Add
condition. This will open a popup which displays all available conditions
in GDevelop.
Figure 1 - Add anew empty event |
Figure 2 - Empty Event |
From the list of conditions in the left side, select Is jumping
under Platform BehaviorI or just simply type “is jumping” in search bar
to find and select the condition. On the right side, all settings related to
the condition we selected will appear. For “Is jumping” we need to configure
which object’s movement we need to track. Select “Bob” from the dropdown. If
you did correctly, your condition will look something just like this;
If everything is fine, click OK to add the condition
to our event. Now click Add action. This will open a popup similar to
condition popup. This popup contains all the available actions in GDevelop.
Now find Sprite category and open Animations and
images sub category. Select Change the animation (by name). Similar
to condition settings, you’ll be able to see relevant settings for the action
you’ve selected. Choose “Bob” from the dropdown as the Object. Under Animation
name, enter the animation name we need to play. In this case it’s “jump”. Remember,
you should define the animation name within quotes. We define strings within
quotes. If you have a programing knowledge you must be familiar with the way we
use string variables. If you configure the settings correctly, your action
should look something just like this;
If everything is ok, hit the OK button to save the
action we created. Hooray! We just created our first Event! Well there are few
more conditions to add before we wind up this lesson. Now follow the same steps
to add the second animation.
Our second event is as follows; Click Add condition.
Find and select Is falling and select “Bob” as the object, then click OK.
Now click Add action. Find and select Change the animation (by name)
and select “Bob” as the object. Enter “fall” as the animation name and hit OK.
Now we have successfully added our second event.
Figure 3 - Add anew sub event button |
Well, now we have already created three simple events. Our next
event is little bit different. In previous events, we had only one condition.
But we are not going to add sub-events. Click Add a sub event button
(figure 3). Make sure you have selected the main event that you want to add the
sub event. You can also right click on the event you want to add sub event and
select “Add sub event”. We need two sub events.
Click Add condition in main event. Find and
select Is on floor and select “Bob” as the object, then click OK.
Keep the actions empty for the main event.
Go to first sub event and click Add condition. Find
and select Is moving and select “Bob” as the object, then click OK.
Now click Add action. Find and select Change the animation (by name)
and select “Bob” as the object. Enter “run” as the animation name and hit OK.
Go to second sub event and Add condition. Find and
select Is moving and select “Bob” as the object. This time we are
enabling Invert condition option in the settings. Click OK to
save changes. Now click Add action. Find and select Change the
animation (by name) and select “Bob” as the object. Enter “idle” as the
animation name and hit OK.
If you follow the instructions correctly, your events should
look something similar to this;
If everything is ok, save your project. Now click Preview
button to preview the changes we made. Now try to move and jump Bob. Well now
Bob is animated for running, jumping and falling. But, still there’s a problem.
Moving forward works fine. But when you try to move the player backward, it
doesn’t turn around. How to fix this? That we’ll discuss in the next lesson.
If you have any questions or doubts, please feel free to
comment below.