Chapitre 7 - Le fichier AIR (les collisions et les mouvements)
- Chapitre 7 - révision 2 - 25 Oct 2001
- 7.1/ Quelques notions de base
- 7.2/ Présentation et utilisation d'Airedit
- 7.3/ Quelques conseils pour terminer
Tout comme pour le chapitre précédent, vous aurez besoin du
fichier AIR.TXT fourni avec Mugen. Pour créer un fichier AIR, nous
allons nous servir d'Airedit. Ce logiciel, programmé par les créateurs
de Mugen, est disponible sur ce site. Vous aurez également besoin d'un
fichier AIR déjà existant pour vous aider : sur ce site, vous
trouverez un exemple de personnage qui
contient un fichier AIR sans ses collisions (EMPTY.AIR). Il est fortement
recommandé de réutiliser ce fichier pour votre propre personnage,
afin de gagner du temps.
Qu'est-ce qu'un fichier AIR ? Son but est double :
- Définir la composition des mouvements
- Définir les collisions
Pour chaque action (se tenir debout, courir, donner un coup...), Mugen a besoin de connaître les sprites qui composent cette action, ainsi que les rectangles de collision pour chaque sprite.
C'est le fichier AIR qui contient la description de chaque action. Dans l'exemple ci-dessous, l'action 20 est composée des sprites 1, 2, 3 et 4 appartenant au groupe 3.
; Marcher vers l'avant [Begin Action 020] 3,1,0,0,6 3,2,0,0,6 3,3,0,0,6 3,4,0,0,6 |
Nous allons étudier ensemble la signification de ces lignes, une par une :
; Marcher vers l'avant |
Le point-virgule indique qu'il s'agit d'un commentaire. Cette ligne n'est pas obligatoire, mais elle est très utile pour la compréhension du fichier AIR. |
[Begin Action 020] |
Indique à Mugen que nous allons définir l'action numéro 20 (marcher vers l'avant). |
3,1,0,0,6 |
On utilise le sprite dont le numéro de groupe est 3 et dont le numéro d'image est 1. Les deux zéros qui suivent permettent de modifier les valeurs de l'axe. Enfin, le dernier numéro indique la durée d'affichage du sprite. |
3,2,0,0,6 |
On utilise le sprite dont le numéro de groupe est 3 et dont le numéro d'image est 2. |
3,3,0,0,6 |
On utilise le sprite dont le numéro de groupe est 3 et dont le numéro d'image est 3. |
3,4,0,0,6 |
On utilise le sprite dont le numéro de groupe est 3 et dont le numéro d'image est 4. |
Explications sur chaque ligne
Vous remarquerez qu'à chaque ligne, les trois derniers chiffres sont identiques (dans notre exemple, il s'agit de "0,0,6"). Une explication détaillée sur ces valeurs ne serait pas superflue :
- La première valeur permet de modifier la position horizontale (X) de l'affichage du sprite. Il faut savoir que chaque sprite est affiché selon son axe. Si vous voulez que le sprite s'affiche davantage sur la gauche de l'écran, il faut entrer une valeur négative. Inversement, si vous voulez que le sprite s'affiche davantage sur la droite, il faut entrer une valeur positive. Exemple : "3,1,-5,0,6" affichera le sprite un peu plus vers la gauche, avec un décalage de 5 pixels par rapport à l'axe.
- La seconde valeur permet de modifier la position verticale (Y) de l'affichage du sprite. Une valeur négative affichera le sprite davantage vers le haut de l'écran, tandis qu'une valeur positive l'affichera davantage vers le bas. Exemple : "3,1,0,40,6" affichera le sprite vers le bas, avec un décalage de 40 pixels par rapport à l'axe.
- La troisième valeur indique la durée d'affichage du sprite. Par défaut, Mugen est réglé sur une vitesse de 60 images par seconde (ce réglage se trouve dans le fichier MUGEN.CFG du dossier DATA de Mugen). Cela signifie que l'écran est redessiné 60 fois par seconde. L'unité de base pour mesurer le temps dans Mugen est donc le soixantième de seconde (1/60ème). Une valeur de 6 signifie que le sprite reste affiché pendant 6 soixantièmes de seconde, c'est-à-dire un dixième de seconde. Pour faire afficher un sprite pendant une seconde, il faudra utiliser la valeur 60.
- A la fin de chaque ligne, vous pouvez indiquer à Mugen que le sprite
doit être affiché à l'envers, soit verticalement, soit
horizontalement, soit les deux à la fois. Un peu comme si votre sprite
se reflétait dans un miroir. Dans certains cas, cela vous permettra
d'économiser des sprites.
"3,1,0,0,6,V" : pour inverser verticalement le sprite.
"3,1,0,0,6,H" : pour inverser horizontalement le sprite.
"3,1,0,0,6,VH" (il n'y a pas de virgule entre le V et le H) : pour l'inverser à la fois horizontalement et verticalement.
Remarque : ne vous préoccupez pas de ces trois valeurs pour le moment. Laissez-les à "0,0,6" par exemple. Il ne faudra les modifier que lorsque vous testerez votre personnage (chapitre 11), mais nous n'en sommes pas encore là.
Maintenant, nous allons remplir le fichier AIR. Le principe est simple : pour chaque numéro d'action, il faudra indiquer les numéros de groupe et d'image des sprites qui composent cette action. Si vous avez suivi les conseils du chapitre 6, vous devriez avoir deux feuilles de papier. Sur la première, vous devriez avoir les numéros d'action et la liste des images correspondantes (les sprites). Sur la seconde, vous devriez avoir la liste de tous vos sprites, ainsi que le numéro du groupe et le numéro d'image correspondant à chaque nom de fichier.
Un petit exemple pour éclaircir tout ça :
|
Première feuille de papier
|
||
|
N° d'action
|
Description
|
Fichiers (sprites)
|
| 0 | Debout |
debout1.gif, debout2.gif, debout3.gif, debout4.gif |
|
Seconde feuille de papier
|
||
|
Fichiers (sprites)
|
N° de groupe
|
N° d'image
|
|
debout1.gif
|
0
|
0
|
|
debout2.gif
|
0
|
1
|
|
debout3.gif
|
0
|
2
|
|
debout4.gif
|
0
|
3
|
Votre travail consiste à attribuer les bons sprites aux bonnes actions. Je vous rappelle qu'un exemple de personnage se trouve sur ce site. Dans l'archive, vous trouverez un fichier AIR sans ses collisions (EMPTY.AIR). Je vous recommande de réutiliser ce fichier pour votre propre personnage, afin de gagner du temps : les indications "[Begin Action xxx]" sont déjà présentes et le fichier est commenté (en anglais).
Remplir le fichier AIR devrait être assez facile, maintenant. Il suffit de repérer le bon numéro d'action. Dans notre exemple, nous commençons par le numéro 0 (ou "000", c'est pareil). Sur la première feuille de papier, nous voyons que cette action est composée de 4 sprites. Sur la seconde feuille, ces 4 fichiers ont leur propre numéro de groupe et d'image. Nous allons donc écrire ces numéros dans le fichier AIR, tout simplement. A la fin, vous devriez obtenir ceci :
|
Le contenu de votre fichier AIR
|
| [Begin Action 000] |
| 0,0,0,0,6 |
| 0,1,0,0,6 |
| 0,2,0,0,6 |
| 0,3,0,0,6 |
C'est aussi simple que cela ! Mais ce travail demande à la fois du temps et de la rigueur. J'espère que vous avez bien suivi car c'est très important.
A chaque sprite doit correspondre un ou plusieurs rectangles de collision. La notion de collision est très importante.
Qu'est-ce qu'une collision ?
Lorsque deux combattants sont en train de se battre, Mugen a besoin d'informations
pour savoir si l'un des deux touche l'autre. C'est pour cela que chaque sprite
doit avoir au moins un rectangle de collision. Si deux personnages marchent
l'un vers l'autre, ils doivent forcément entrer en contact à
un moment donné. Le programme Airedit sert à définir
ces rectangles de collision. On les appelle "rectangles" car ce
sont de véritables rectangles, comme vous le constaterez par la suite.
Il existe deux types de rectangles de collision :
- Les rectangles de contact : ils délimitent grossièrement les pourtours de votre personnage.
- Les rectangles d'attaque : ils ne sont utilisés que lorsque votre personnage porte une attaque. Dans ce cas, vous devez entourer la partie de son corps qui porte un coup (le poing, par exemple).
Nous verrons tout ceci en détail dans la partie 7.2.
Remarque : les termes de "rectangles de contact" et de "rectangles d'attaque" sont ceux utilisés par ce didacticiel, et non pas par Mugen. Dans sa documentation, Mugen parle de "plain collision boxes" et de "attacking boxes".
Rien ne vaut une image pour bien mettre les choses au clair :
Ce sprite contient deux rectangles de contact et un rectangle d'attaque
Si l'on regarde le sprite ci-dessus, il a deux rectangles bleus et un rectangle
rouge. Les rectangles bleus sont les rectangles de contact ; leur but
est d'entourer approximativement le personnage. Plus ces rectangles sont nombreux,
et plus les collisions seront précises, mais plus le jeu ralentira
(car Mugen devra gérer plusieurs rectangles à la fois). Dans
la pratique, évitez de dépasser les 4 ou 5 rectangles de contact.
Dans notre exemple, nous avons un rectangle pour le buste et les cuisses,
et un autre rectangle pour le reste des jambes.
Le rectangle rouge est un rectangle d'attaque. La partie du corps qui
porte un coup doit être entourée par un ou plusieurs rectangles.
Le principe de la gestion des collisions est très simple: pour qu'un
coup puisse porter, Mugen doit détecter une collision entre un rectangle
d'attaque et un rectangle de contact.
A l'aide d'Airedit, vous allez pouvoir définir tous vos rectangles de collision. Cela vous évitera de rentrer à la main les paramètres de tous les rectangles. Une fois votre fichier AIR modifié par Airedit, vous pourrez visualiser son contenu avec un éditeur de texte. Votre fichier AIR ressemblera à ceci :
; Marcher vers l'avant [Begin Action 020] Clsn2: 1 Clsn2[0] = 14,-99,-19,0 3,1,0,0,6 Clsn2: 1 Clsn2[0] = 14,-99,-19,0 3,2,0,0,6 Clsn2: 3 Clsn2[0] = 29,-50,-26,-97 Clsn2[1] = -29,0,25,-19 Clsn2[2] = 16,-19,-20,-50 3,3,0,0,6 Clsn2: 3 Clsn2[0] = 29,-50,-26,-97 Clsn2[1] = -29,0,25,-19 Clsn2[2] = 16,-19,-20,-50 3,4,0,0,6 |
Nous avons vu que chaque sprite doit avoir ses propres rectangles. Dans l'exemple ci-dessus, les rectangles que vous aviez défini avec Airedit apparaissent sous la forme de "Clsn1" ou "Clsn2". Ces lignes sont difficilement compréhensibles pour un débutant, c'est pour cela qu'il faut utiliser Airedit pour gérer les rectangles de collision. Le mot "Clsn2" désigne les rectangles de contact, tandique que le mot "Clsn1" désigne les rectangles d'attaque. Quelques explications supplémentaires ne feraient pas de mal :
Clsn2: 1 |
Le sprite n'a qu'un seul rectangle de collision. |
Clsn2[0] = 14,-99,-19,0 |
Les coordonnées de cet unique rectangle. |
3,1,0,0,6 |
Ce rectangle ne concerne que le sprite "3,1". |
7.2/ Présentation et utilisation d'Airedit
Lorsque vous exécutez Airedit, vous vous trouvez devant plusieurs fenêtres et un menu déroulant. Nous allons voir chaque partie de ce logiciel en détail (désolé pour la qualité des images, mais je n'ai pas pu faire mieux) :
L'écran principal d'Airedit
| 1 |
 |
Voici le menu général d'Airedit. Si vous n'êtes pas sous Windows, n'oubliez pas de charger le pilote de la souris avant de lancer Airedit.
|
| 2 |
|
|
| 3 |
 |
Cette partie vous permet de sélectionner le sprite auquel vous souhaitez ajouter ou enlever des rectangles de collision. Si le curseur de votre souris se trouve sur l'un des boutons "ACT" ou "ELEM", une pression sur la barre d'espace ouvre une boîte de dialogue qui vous demandera le numéro d'action et le numéro d'élément du sprite qui vous intéresse. Cela permet de se déplacer très vite dans le fichier SFF. Voici la signification de chaque option :
|
| 4 |
 |
Cette petite fenêtre vous donnera des informations sur la position de la souris, de l'axe et du rectangle de collision ("BOX") que vous êtes en train de tracer. |
| 5 |
 |
|
| 6 |
 |
C'est ici qu'Airedit indique le numéro d'action du sprite courant. |
| 7 |
 |
Ces deux chiffres indiquent respectivement le numéro de groupe et le numéro d'image du sprite courant. |
Le principe de fonctionnement :
- Vous devez définir les rectangles en laissant le bouton gauche de la souris appuyé. Si vous n'en êtes pas satisfait, un second clic gauche permet d'effacer le rectangle que vous venez juste de tracer. Le but de ces rectangles est de recouvrir au maximum le corps de votre personnage.
- Dans un premier temps, commencez par définir tous les rectangles de contact pour tous vos sprites. Ensuite, définissez les rectangles d'attaque.
- Vous ne pouvez tracer qu'un rectangle à la fois. Si votre personnage a besoin d'autres rectangles, vous devrez utiliser les mémoires internes d'Airedit. Lorsque vous êtes satisfait de votre rectangle, cliquez sur le bouton SAVE1. Vous pouvez alors définir un second rectangle, il sera sauvé en mémoire grâce au bouton SAVE2. Et ainsi de suite, le maximum étant de 10 rectangles.
- Si vous avez commis une erreur en traçant l'un des rectangles, il est possible de l'effacer ou de le redéfinir en cliquant sur le bouton représentant son numéro. Le bouton CLEAR sert à effacer tous vos rectangles.
- Pour chaque sprite, lorsque vous avez fini de définir le(s) rectangle(s), cliquez sur le menu File (ou pressez ALT + F) et choisissez l'option Save (ou pressez la touche S). Ensuite, faîtes un choix entre "Clsn1" et "Clsn2". Petit rappel : "Clsn1" désigne les rectangles d'attaque, tandis que "Clsn2" désigne les rectangles de contact.
ATTENTION !!!
Si vous voulez rajouter un rectangle à un sprite, tous les rectangles du même type ("Clsn1" ou "Clsn2") déjà existants seront effacés.
Oui, mais... Combien de rectangles faut-il tracer, et à quel endroit ? En général, il vaudrait mieux ne pas définir trop de rectangles pour un seul sprite (4 ou 5 au maximum). La meilleure chose à faire est de charger le fichier AIR du personnage KFM avec Airedit, et de regarder ce qu'ont fait ses créateurs.
7.3/ Quelques conseils pour terminer
Optimisation des rectangles de collision dans le fichier AIR :
Si vous en avez le temps (et l'envie), vous pouvez réduire la taille de votre fichier AIR en éliminant les répétitions. Dans l'exemple ci-dessous, nous avons utilisé le même rectangle de contact pour les quatre sprites de l'action 100 :
; Courir vers l'avant [Begin Action 100] Clsn2: 1 Clsn2[0] = 14,-99,-19,0 30,1,0,0,8 Clsn2: 1 Clsn2[0] = 14,-99,-19,0 30,2,0,0,8 Clsn2: 1 Clsn2[0] = 14,-99,-19,0 30,3,0,0,8 Clsn2: 1 Clsn2[0] = 14,-99,-19,0 30,4,0,0,8 |
En utilisant la commande "Clsn2Default", on indique à Mugen que le rectangle qui suit sera le rectangle par défaut pour tous les sprites de cette action. Bien entendu, la commande "Clsn1Default" permet de faire de même avec les rectangles d'attaque. Ce qui nous donne ceci :
; Courir vers l'avant [Begin Action 100] Clsn2Default: 1 Clsn2[0] = 23,0,-21,-85 30,1,0,0,8 30,2,0,0,8 30,3,0,0,8 30,4,0,0,8 |
Grâce à l'utilisation systématique de "Clsn1Default" et de "Clsn2Default", vos fichiers AIR prendront moins de place. Cependant, vous n'êtes pas obligé de le faire.
Peut-on tester son personnage avec Mugen ?
Si vous suivez ce didacticiel dans l'ordre des chapitres, vous n'avez pas encore créé les fichiers CMD et CNS. Il est donc impossible de tester son personnage. Cependant, il existe une astuce qui pourra satisfaire les plus curieux d'entre vous : il suffit d'utiliser les fichiers CMD et CNS du personnage KFM, fourni avec Mugen !
Avant tout, créez un sous-répertoire portant le nom de votre personnage dans le répertoire CHARS de Mugen. Reportez-vous à la première partie du 3ème chapitre (dédiée à l'organisation des fichiers), afin d'avoir des explications sur les fichiers DEF. Copiez-y les fichiers DEF, CNS et CMD du personnage KFM, puis les fichiers AIR, SFF et ACT de votre propre personnage. Renommez le fichier KFM.DEF par le nom de votre personnage (bien entendu, laissez l'extension DEF). Normalement, votre nouveau fichier DEF, le répertoire de votre personnage et le nom de votre personnage lui-même doivent être identiques. Entrez le nom de votre personnage dans la partie "[Info]". Pour les besoins de l'exemple, supposons que votre personnage s'appelle John. Votre nouveau fichier DEF s'appellera JOHN.DEF et il sera inclus dans le répertoire JOHN. Vous devriez obtenir ceci :
; Player information [Info] name = John ; Files for the player [Files] cmd = kfm.cmd cns = kfm.cns st = kfm.cns stcommon = common1.cns sprite = john.sff anim = john.air pal1 = john.act |
L'utilisation des fichiers CMD et CNS de KFM ne devrait pas poser trop de problèmes. Cependant, vous ne pourrez vous servir que des boutons A et B pour porter un coup. Pour le moment, laissez tomber le fichier SND, il n'est pas obligatoire.
Mugen possède une option très pratique pour tester un personnage. Démarrez une session DOS et tapez ceci sur la ligne de commande (le nom du décor est falcutatif), en remplaçant "votre-perso" et "perso2" par les noms des personnages que vous souhaitez tester :
mugen votre-perso perso2 [décor] |
Maintenant, il est grand temps de passer à l'édition des fichiers SND, CMD et CNS pour finir votre personnage !