Player and Enemy Animations
This is part 2 of 14 of the 2D Roguelike tutorial, in which you will setup the player and enemy animations, and create their prefabs.
Player and Enemy Animations
中級 2D Roguelike tutorial
- 00:02 - 00:05
Welcome back to the scavengers video series.
- 00:05 - 00:07
In the previous video we looked at setting up
- 00:07 - 00:10
the project and demonstrated the finished product.
- 00:11 - 00:13
In this video we're going to create animations
- 00:13 - 00:15
for the player and enemy units
- 00:15 - 00:17
from the provided sprite sheet
- 00:17 - 00:21
and also setup the player and enemy prefabs.
- 00:21 - 00:23
So let's create a new scene
- 00:26 - 00:31
and we're going to start by creating the player prefab,
- 00:31 - 00:33
along with the animations the go with him.
- 00:34 - 00:37
So we're going to choose Game Object - Create Empty
- 00:39 - 00:41
and we're going to label that Player.
- 00:43 - 00:45
In our folder Sprites we have a sprite sheet,
- 00:45 - 00:48
now this has already been sliced
- 00:48 - 00:50
in to multiple sprites.
- 00:50 - 00:52
For more information about sprite sheets and
- 00:52 - 00:54
sprites you can see the information linked below.
- 00:55 - 00:57
In this case we're going to grab
- 00:57 - 01:00
the first set of frames here, which are the
- 01:00 - 01:01
player idle animation,
- 01:01 - 01:03
and I did that by clicking the first frame and then just
- 01:03 - 01:05
shift-clicking the last frame that I wanted.
- 01:05 - 01:07
I'm going to take these and then drag them on
- 01:07 - 01:09
to the player prefab.
- 01:09 - 01:11
And then we're going to give this a name,
- 01:11 - 01:14
we're going to call this PlayerIdle,
- 01:14 - 01:15
so this is the animation that's going to play when
- 01:15 - 01:17
the player is not doing anything.
- 01:17 - 01:20
We're going to put this in our Animations folder.
- 01:21 - 01:23
You'll notice when we did that that two components
- 01:23 - 01:25
were added to the game object, a sprite renderer,
- 01:25 - 01:28
which is going to display the current sprite frame.
- 01:28 - 01:33
And an animator which is going to allow us to play animation.
- 01:33 - 01:35
So when we drag those frames on these two
- 01:35 - 01:37
components were added, it asked us to save our
- 01:37 - 01:41
animation which we saved in our Animations subfolder.
- 01:41 - 01:45
It also created what's called an animator controller,
- 01:45 - 01:47
which is going to allow us to manage what
- 01:47 - 01:48
animation is currently playing.
- 01:48 - 01:52
We're going to actually move that to our Animator Controllers folder
- 01:52 - 01:55
And we're going to add some more animations to the player.
- 01:55 - 01:57
Let's go back to sprites.
- 01:58 - 02:00
And in this case I'm going to select
- 02:01 - 02:05
our two PlayerChop animation frames,
- 02:05 - 02:06
drag them on to the player,
- 02:07 - 02:09
and we'll call these PlayerChop.
- 02:10 - 02:12
We're going to put this in our Animations folder.
- 02:16 - 02:18
Now notice when we do this this hasn't added
- 02:18 - 02:20
another animator controller, instead it's
- 02:20 - 02:24
added that animation to the existing
- 02:24 - 02:26
animator controller that's already on the player.
- 02:26 - 02:29
We're going to repeat the process with the PlayerHit animation.
- 02:34 - 02:36
And next we can check to make sure that that's working.
- 02:40 - 02:42
So we can see, there's our player idling,
- 02:42 - 02:44
now the animation is a little fast
- 02:44 - 02:46
so what we're going to do is we're going to open
- 02:46 - 02:50
the referenced animator controller by double clicking on it,
- 02:51 - 02:53
highlight the PlayerIdle state
- 02:53 - 02:56
we're just going to set the speed to 0.5,
- 02:56 - 02:59
which is going to be half of our normal speed.
- 02:59 - 03:01
Notice that our other two animations have
- 03:01 - 03:03
been added as states,
- 03:03 - 03:05
and later on in the series we're going to
- 03:05 - 03:07
work out how to control changing
- 03:07 - 03:09
between those states via script.
- 03:10 - 03:11
Let's check it now.
- 03:14 - 03:15
There we go.
- 03:17 - 03:19
With the animations done for the player
- 03:19 - 03:21
we're going to go ahead and apply
- 03:21 - 03:24
a tag to the player, of Player.
- 03:24 - 03:26
Now the Player tag is predefined in
- 03:26 - 03:29
all Unity projects, we've also added
- 03:29 - 03:32
a couple of additional tags, food, exit,
- 03:32 - 03:33
enemy and soda.
- 03:33 - 03:35
We've done that by going to Add Tag
- 03:38 - 03:41
and typing those in to these fields.
- 03:42 - 03:45
We're going to set the tag to Player
- 03:45 - 03:47
and we're also going to set the layer.
- 03:47 - 03:49
Here we've got our default layers,
- 03:49 - 03:52
and we've added an additional layer called Blocking Layer.
- 03:52 - 03:54
This is the layer on which all
- 03:54 - 03:56
collisions are going to be checked
- 03:56 - 03:58
and so we're going to go ahead and select that
- 03:58 - 04:00
for the player, and we added that the same way,
- 04:00 - 04:03
by choosing Add Layer and then typing that in.
- 04:03 - 04:06
So we'll go ahead and select blocking layer.
- 04:06 - 04:08
We're going to do one additional layer
- 04:08 - 04:10
related thing for the player, which is
- 04:10 - 04:13
we're going to set the sorting layer for the sprite renderer.
- 04:13 - 04:15
Now we've predefined some layers here,
- 04:15 - 04:19
we've got a Floor layer, which is going to be the background.
- 04:19 - 04:21
An Item layer which will be rendered in front of
- 04:21 - 04:23
the floor, which is going to be the food and the soda.
- 04:23 - 04:26
And then a Units layer for the player and the enemies.
- 04:26 - 04:29
We're going to assign the player to the units layer.
- 04:29 - 04:32
Next we're going to add two components
- 04:32 - 04:35
to the player, we're going to add a box collider 2D
- 04:35 - 04:37
and a rigidbody 2D.
- 04:37 - 04:39
The box collider 2D is going to allow us to
- 04:39 - 04:41
check collisions against the player.
- 04:41 - 04:43
And the rigidbody 2D is going to allow us
- 04:43 - 04:46
to move the player using the physics system.
- 04:46 - 04:50
We're going to set the rigidbody 2D to Is Kinematic
- 04:50 - 04:52
since we don't really want the player to be flying
- 04:52 - 04:54
and bouncing around, we're just going to have him moving
- 04:54 - 04:56
in neat grid-based spaces.
- 04:56 - 04:59
So we're going to control that using a script
- 04:59 - 05:01
and set this to Is Kinematic.
- 05:01 - 05:03
We're also going to adjust the size
- 05:03 - 05:05
of our box collider 2D
- 05:05 - 05:07
to make it a little bit smaller so that the
- 05:07 - 05:09
player won't accidentally collider with
- 05:09 - 05:11
things in adjacent spaces,
- 05:11 - 05:14
only when they're trying to move in to a space
- 05:14 - 05:16
occupied by another collider.
- 05:16 - 05:18
There are a few other components that we're going to add to the
- 05:18 - 05:21
player as we go, but for now that's a good starting point.
- 05:21 - 05:23
So we're going to take that and we're going to
- 05:23 - 05:26
drag it down to our Prefabs folder to save a prefab.
- 05:27 - 05:29
Now that we've created our prefab
- 05:29 - 05:31
we can temporarily delete the player from the hierarchy
- 05:31 - 05:33
and we're going to create our first enemy.
- 05:34 - 05:37
We're going to go ahead and choose Game Object - Create Empty
- 05:37 - 05:39
and we're going to name this Enemy1.
- 05:39 - 05:42
Let's start by adding our animations to Enemy1.
- 05:42 - 05:44
I'm going to go back to sprites
- 05:44 - 05:47
shift-click the frames of the EnemyIdle animation
- 05:47 - 05:49
and drag them on.
- 05:50 - 05:52
We're going to call this Enemy1Idle.
- 05:52 - 05:54
This is going to automatically add the components that
- 05:54 - 05:56
we need and then we're going to add the other
- 05:56 - 05:58
frames of our animation as well.
- 06:02 - 06:04
Add our Attack animation.
- 06:05 - 06:07
We can double check that that's working.
- 06:11 - 06:12
There he is, looking good.
- 06:13 - 06:18
And now let's add our box collider and rigidbody as well.
- 06:24 - 06:26
We're also going to set the rigidbody for
- 06:26 - 06:28
the enemy to Is Kinematic
- 06:28 - 06:30
and we're going to apply the Enemy tag
- 06:30 - 06:33
and assign the enemy to our blocking layer.
- 06:33 - 06:37
We're also going to set the sprite renderer sorting layer to Units.
- 06:41 - 06:43
With that done we can drag our enemy down
- 06:43 - 06:45
to the create a prefab of the first enemy.
- 06:48 - 06:51
And instead of deleting this one we're actually just going
- 06:51 - 06:53
to modify it to create the second one.
- 06:53 - 06:55
Rename it to Enemy2.
- 06:59 - 07:00
And we're going to drag in
- 07:00 - 07:02
our Enemy2Idle frames.
- 07:12 - 07:14
And our Enemy2Attack frames.
- 07:20 - 07:23
Now when we drag our animation
- 07:23 - 07:26
to our enemy we created a new animator controller.
- 07:26 - 07:30
We're going to move that to our Animator Controllers folder.
- 07:30 - 07:34
Next we're going to open up our Enemy1 animator controller
- 07:34 - 07:36
and we'll see inside that all of our
- 07:36 - 07:39
animations have been added here as states.
- 07:39 - 07:40
Now what we're actually going to do is we're going to
- 07:40 - 07:43
delete the Enemy2 states
- 07:43 - 07:45
from this, we're going to shift-click on each
- 07:45 - 07:48
of those and then right-click to delete them.
- 07:49 - 07:51
Now it's going to ask if we want to delete the selected assets
- 07:51 - 07:53
we're going to go ahead and choose delete.
- 07:55 - 07:57
And what we're going to do now is because
- 07:57 - 07:59
Enemy1 and Enemy2 are going to share the
- 07:59 - 08:02
same state machine, they have the same two states
- 08:02 - 08:04
of Idle and Attack.
- 08:04 - 08:06
What we're going to do is we're going to create what's called
- 08:06 - 08:08
an animator override controller,
- 08:09 - 08:12
which is going to allow us to use this same state machine
- 08:12 - 08:14
and the same script to control it
- 08:14 - 08:16
but just play different animations
- 08:16 - 08:18
in each of the states.
- 08:18 - 08:19
So we're going to go ahead and choose
- 08:19 - 08:23
Create - Animator Override Controller.
- 08:27 - 08:29
We'll call this Enemy2
- 08:29 - 08:31
And so the first thing that we need to specify
- 08:31 - 08:34
is what controller are we going to be overriding,
- 08:34 - 08:37
so we're going to choose the Enemy1 controller and drag it in.
- 08:39 - 08:41
And we'll see here, here are the two
- 08:41 - 08:43
original animations that we're going to play,
- 08:43 - 08:46
Enemy1Idle and Enemy1Attack,
- 08:46 - 08:49
and so we're going to override those with
- 08:49 - 08:51
- 08:54 - 08:56
- 08:58 - 09:00
In Enemy2 we're going to change
- 09:00 - 09:02
the controller of our animator to
- 09:02 - 09:05
now use our animator override controller.
- 09:11 - 09:13
Now if we play the scene.
- 09:15 - 09:16
There we go.
- 09:18 - 09:22
Finally let's drag Enemy2 down to our prefabs folder
- 09:23 - 09:25
to create a new prefab.
- 09:25 - 09:28
Next we can delete Enemy2 from the hierarchy
- 09:28 - 09:30
and we can save our scene.
- 09:31 - 09:32
We'll call it Main
- 09:32 - 09:35
and save it in our empty Scenes folder.
- 09:36 - 09:39
Now that we've got our basic prefabs created
- 09:39 - 09:41
for our Player and Enemy unit types
- 09:41 - 09:43
we're going to move on to creating the other
- 09:43 - 09:46
tile prefabs we're going to need to layout the game board.
- 09:46 - 09:48
In the next video we're going to create
- 09:48 - 09:52
our floor, wall, food, soda
- 09:52 - 09:54
and exit prefabs.