Exercice : Créer l’animation d’un personnage qui marche

Cet exercice se trouve dans le chapitre JavaScript - section Déplacer un élément au clavier.

Pour le déplacement du personnage au clavier, il faut gérer trois informations.

1) Il faut bouger le personnage, en X et en Y, dans toutes les directions, comme pour la bille (cf. chapitre JavaScript - Déplacer un élément au clavier).

Pour cette partie, il suffit de reprendre le code de la bille, récupérer les évènements clavier et modifier la position du personnage.

2) Lorsque le personnage se déplace dans une direction, il faut afficher les images du personnage, correspondant à son déplacement. Si le personnage se déplace vers le haut, il faudra l’afficher de dos.

Lorsque l’utilisateur appuie sur une touche de direction, il indique le sens de la marche. Pour régler cette deuxième partie, nous allons mémoriser dans une variable (positionBH) le sens choisi : face, dos, droite ou gauche, et nous utiliserons cette variable au moment d’afficher la classe du personnage.

3) Il faut animer le mouvement de marche du personnage. S’il se déplace vers la gauche, il faudra appeler les classes position_gauche_1, puis position_gauche_2, puis position_gauche_3 et ainsi de suite pour créer l’animation de la marche.

Arrivé à cette dernière étape, il suffit de modifier la classe du personnage, en reconstruisant...

couv_RI3HTCSJA.png

Découvrez 

le livre :

Aussi inclus dans nos :

Précédent
Exercice : Position personnage
Suivant
Conclusion