Up to date

This page is up to date for Godot 4.2. If you still find outdated information, please open an issue.

Vue d'ensemble du mouvement 2D

Introduction

Tous les débutants se demandent : "Comment déplacer mon personnage ?". Selon le style de jeu que vous réalisez, vous pouvez avoir des exigences particulières, mais en général, les mouvements de la plupart des jeux en 2D sont basés sur un petit nombre de dessins.

We'll use CharacterBody2D for these examples, but the principles will apply to other node types (Area2D, RigidBody2D) as well.

Configuration

Each example below uses the same scene setup. Start with a CharacterBody2D with two children: Sprite2D and CollisionShape2D. You can use the Godot icon ("icon.png") for the Sprite2D's texture or use any other 2D image you have.

Ouvrez Projet -> Paramètres du projet et sélectionnez l'onglet "Plan des entrées". Ajoutez les actions d'entrées suivantes (voir InputEvent pour les détails) :

../../_images/movement_inputs.webp

Mouvement 8 directions

Dans ce scénario, vous souhaitez que l'utilisateur appuie sur les quatre touches directionnelles (haut/gauche/bas/droite ou Z/Q/S/D) et se déplace dans la direction sélectionnée. Le nom "mouvement à 8 directions" vient du fait que le joueur peut se déplacer en diagonale en appuyant sur deux touches simultanément.

../../_images/movement_8way.gif

Add a script to the character body and add the following code:

extends CharacterBody2D

@export var speed = 400

func get_input():
    var input_direction = Input.get_vector("left", "right", "up", "down")
    velocity = input_direction * speed

func _physics_process(delta):
    get_input()
    move_and_slide()

In the get_input() function, we use Input get_vector() to check for the four key events and sum return a direction vector.

We can then set our velocity by multiplying this direction vector, which has a length of 1, by our desired speed.

Astuce

Si vous n'avez jamais utilisé de calcul vectoriel auparavant ou avez besoin d'une remise à niveau, vous pouvez voir une explication de l'utilisation des vecteurs dans Godot sur Mathématiques des vecteurs.

Note

Si le code ci-dessus ne fait rien lorsque vous appuyez sur les touches, vérifiez que vous avez correctement configuré les actions d'entrée comme décrit dans la partie Configuration de ce tutoriel.

Rotation + Mouvement

Ce type de mouvement est parfois appelé "style Asteroids" car il ressemble à la façon dont ce jeu d'arcade classique fonctionnait. Appuyez sur les touches gauche/droite pour faire pivoter le personnage, tandis que haut/bas le déplace vers l'avant ou l'arrière dans toute direction vers laquelle il fait face.

../../_images/movement_rotate1.gif
extends CharacterBody2D

@export var speed = 400
@export var rotation_speed = 1.5

var rotation_direction = 0

func get_input():
    rotation_direction = Input.get_axis("left", "right")
    velocity = transform.x * Input.get_axis("down", "up") * speed

func _physics_process(delta):
    get_input()
    rotation += rotation_direction * rotation_speed * delta
    move_and_slide()

Here we've added two variables to track our rotation direction and speed. The rotation is applied directly to the body's rotation property.

To set the velocity, we use the body's transform.x which is a vector pointing in the body's "forward" direction, and multiply that by the speed.

Rotation + Mouvement (souris)

Ce style de mouvement est une variation du précédent. Cette fois, la direction est définie par la position de la souris au lieu du clavier. Le personnage "regardera" toujours vers le pointeur de la souris. Les entrées avant/arrière restent toutefois les mêmes.

../../_images/movement_rotate2.gif
extends CharacterBody2D

@export var speed = 400

func get_input():
    look_at(get_global_mouse_position())
    velocity = transform.x * Input.get_axis("down", "up") * speed

func _physics_process(delta):
    get_input()
    move_and_slide()

Here we're using the Node2D look_at() method to point the player towards the mouse's position. Without this function, you could get the same effect by setting the angle like this:

rotation = get_global_mouse_position().angle_to_point(position)

Cliquer-et-déplacer

Ce dernier exemple utilise uniquement la souris pour contrôler le personnage. En cliquant sur l'écran, le joueur se déplacera à l'emplacement cible.

../../_images/movement_click.gif
extends CharacterBody2D

@export var speed = 400

var target = position

func _input(event):
    if event.is_action_pressed("click"):
        target = get_global_mouse_position()

func _physics_process(delta):
    velocity = position.direction_to(target) * speed
    # look_at(target)
    if position.distance_to(target) > 10:
        move_and_slide()

Notez la vérification distance_to() que nous faisons avant le mouvement. Sans ce test, le corps "gigoterait" lorsqu'il atteindrait la position cible, car il se déplace légèrement au-delà de la position et essaie de reculer, se déplace trop loin et répète ce schéma encore et encore.

Décommenter la ligne look_at() amènera le corps à pointer dans la direction de son mouvement si vous préférez.

Astuce

Cette technique peut également être utilisée comme base du personnage "suivant". La position cible peut être celle de n'importe quel objet vers lequel vous voulez déplacer.

Résumé

Vous pouvez trouver ces exemples de code utiles comme points de départ pour vos propres projets. N'hésitez pas à les utiliser et à les expérimenter pour voir ce que vous pouvez faire.

You can download this sample project here: 2d_movement_starter.zip