Een beat-em-up game maken met Godot - een vijand
Tags: beginners, godot, tutorial, gamedev
Published: 2023-05-02 16:45:08

[Terug naar deel 3](https://dev.to/bgie/een-beat-em-up-game-maken-met-godot-4-deel-3-329)

We gaan een vijand toevoegen. De basis onderdelen zijn:
- de animatie frames
- een collision shape
- en een enemy script

Hiervoor maken we eerst een nieuwe `scene`. In het paneel linksonder, klik je met de rechtermuisknop op `res://`. Vervolgens kies je `new` en dan `scene`.

![Add new scene](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hod6fxp7s3jbg9r8hy3j.png)

In de `Create New Scene` dialoog klikken we op de `Pick Root Node Type` knop.
![Create new scene pick root node button](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1taos69hbhwiy9bnujfb.png)

Dan kunnen we in de `Recent` lijst opnieuw `CharacterBody2D` kiezen. Deze gebruikten we eerder ook voor de speler. Bevestig met de `pick` knop.
![Pick CharacterBody2D](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9eeh1hxol7or8xyg0714.png)

Terug in de eerste dialog, typen we nu een naam voor onze vijand: 'Minotaur'. We bevestigen met `ok` en onze nieuwe scene wordt gemaakt.

![Create minotaur scene](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e7db0n98oz664z4nb2fv.png)

Net zoals bij onze speler voegen we 2 child nodes toe aan onze minotaurus: `AnimatedSprite2D` en `CollisionShape2D`.

![Add minotaur child nodes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2biwyhrapxbjqcvjd3m4.png)

Een shape instellen voor de collision shape is net hetzelfde als bij de speler. De vorm is ook een gedraaide `CapsuleShape 2D` maar wat groter: `radius` = 50, `height` = 350 en `rotation` = 90.

![Minotaur collision shape](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g4qx3npwlkxqzh6b0soe.png)

Onze `AnimatedSprite2D` heeft `SpriteFrames` nodig, die voegen we toe:

![Create spriteframes](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8ondf4gamqbidalbwf6c.png)

Klikken we nu nogmaal op deze nieuwe `SpriteFrames` dan opent het paneel waar we de animaties kunnen samenstellen.

![SpriteFrames panel](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l4absu4il1bbca6t7vuj.png)

De minotaurus animaties zijn dezelfde als die van de speler: `attack`, `die`, `hurt`, `idle` en `walk`. Deze voegen we toe met de `Add Animation` knop, en we geven ze de juiste naam. De `default` animatie mag weg.

![Create animations](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fwxu9sx1g6cf734tizva.png)

Voor elke animatie moeten we nu de juiste beelden toevoegen met de `Add frames from file` knop. De afbeeldingen staan in submappen van de map 'minotaur' onder onze 'assets'.
Alle animaties spelen aan `30 fps`. Enkel de `idle` en `walk` animatie hebben `looping` AAN staan, bij de rest staat dit UIT.

![Add frames to animations](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qa12np4mv2fr2yeyidpb.png)

Onze `AnimatedSprite2D` staat nog te laag ten opzichte van onze `CollisionShape2D`, de voeten van het monster moeten in de blauwe ovaal staan. We passen voor onze `AnimatedSprite2D` de `position` aan naar `y` = -200.

![Set AnimatedSprite2D position](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qkqie27cp5ddsnq45rqt.png)

Onze vijand tot leven brengen doen we met een script. Zorg dat de root node 'Minotaur' geselecteerd is en klik op de `Attach Script` knop.

![Attach script button](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hjnppa2pny3u4uf18khu.png)

In de volgende dialoog gaan we een andere naam kiezen voor ons script: we noemen het script 'res://Enemy.gd' omdat we hetzelfde script willen gebruiken voor meerdere soorten vijanden. Bevestig door op `Create` te klikken.

![Attach enemy script dialog](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v7xp7uc4swb9b3466suh.png)

Het script voor de vijand gaan we geleidelijk opbouwen. We starten met het minimum: de vijand staat gewoon stil.
Verwijder alle voorbeeldcode en gebruik dit:

```gdscript
extends CharacterBody2D

@onready var sprite: AnimatedSprite2D = $AnimatedSprite2D

func _physics_process(_delta):
	sprite.play("idle")
```

Om te kunnen testen gaan we onze vijand in de wereld plaatsen. Sla eerst de huidige scene op met `Ctrl+S` of kies in het hoofdmenu linksboven `Scene` - `Save`.

Dan keren we terug naar de `2D` view en selecteren we onze 'game' scene. We slepen onze 'Minotaur.tscn' vanuit het `FileSystem` naar de 'Arena' node in onze `scene`. Daarna kan je de speler en de vijand verslepen in de wereld zelf, zodat ze niet vlak bij mekaar staan.

![Add minotaur to game](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/coyjc37kwgjgei21h59w.png)

Het valt misschien dadelijk op dat ons monstertje niet heel indrukwekkend is... We gaan hem eerst wat groter maken!
Dit is zo gebeurd: we openen terug de 'minotaur' scene, selecteren de `AnimatedSprite2D` en zetten de `scale` op 1.5
Nu staan onze voeten niet meer op de juiste plaats, daarom passen we `position` terug aan zodat `y` = -300

![Make monster larger](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ujmplzl1ohl3tb1i9imc.png)

Nu dit gebeurd is, kunnen we testen! Start de game met de `Run Project` knop of `F5`.

Als we naar onze vijand toelopen, merken we dat er nog een probleem is. Het overlappen van de graphics klopt nog niet, onze minotaurus staat altijd vanboven, ook al loopt de speler 'voor' hem.

![Bad sorting](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wza64b6hnczo67mwaepl.png)

Als game engine heeft Godot hier natuurlijk een oplossing voor. Onze 'Arena' node heeft bij zijn properties een optie `Y Sort Enabled` die we eenvoudig aan kunnen zetten. 
Staat dit AAN, dan gaat Godot bij het tekenen van de child nodes van 'Arena' kijken naar de hoogte (y positie) en de nodes sorteren zodat de hoogste nodes 'vanonder' komen te liggen.

![Enable Y sort](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q94cuwsqfdcl1kbgyk43.png)

Dit zit er al beter uit:

![Run circles clip](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vvcu2hty3nt0scjejl9z.gif)

In het volgende deel schrijven we een basis AI voor onze vijand: [deel 5](https://dev.to/bgie/een-beat-em-up-game-maken-met-godot-4-deel-5-1n6k)