[Tuto][GBA] Créez vos propre émoticone, et plus encore.

Pages: [1]

Unifag

  • Membre
  • 883 posts
09 mai 2013, 21:26
Créez vos propre émoticône

Dans ce tuto je vais vous expliquez comment modifier les émotes de manière assez poussées. Donnant même des résultats qui n’ont plus rien à voir avec ce qu'on peut appeler "émote". (aller voir à la fin du tuto pour vous faire une petite idée).
Attention, je ne vais pas vous apprendre comment modifier une image (avec NSE ou un autre logiciel), ni les bases de l'hexa.

Pour ce qui ne voit pas ceux que sont les émotes, c'est ça: ?,!,!!,^^,X Ils sont utilisable dans les applyMovements (#raw 61 à #raw 66).
Malheureusement je n'ai pas encore réussi à augmenter le nombre d'émotes disponible, donc pour le moment il faudra se limiter à 5 (2 pour RSE). Mais j'y travaille.

Les nombres précédés d'un '#' sont en hexadécimal, sinon ils sont en décimal.

La liste d'images

Elle permet de lister l'ensemble des images qui pourront être utilisées dans les émotes. Dans se tuto je part du principe que vous voulez crée un tout nouveau smiley sans réutiliser les images des anciens émotes, donc ce n'est pas la peine de toucher à la liste déjà existante, on va en créer une nouvelle.

Avant même de créer cette liste je vous laisse insérer les images que vous allez utiliser. Je ne donne pas de détails la dessus, c'est très simple. (notez les offsets, on en aura besoin)
Malheureusement la palette est la même que celle du personnage ce qui limite énormément les possibilités que nous offre ces "émotes", mais je vais essayer de palier à ce problème.

            Où crée notre liste

Chaque images prendra 8 octets dans la liste, il vous faut donc trouver un espace dans la rom avec une taille suffisante. (notez l'offsets auquel vous commencez la liste)

A partir de maintenant j'ai décidé d'illustrer chaque étapes avec un exemple qui sera de couleur grise. Personnellement j'ai décidé que mon "émote" contiendrait 9 images, que j'ai déjà inséré. Ma liste aura alors une taille de 9*8 = #48 octets. J'ai choisis de créer ma liste en commençant à l'offset #BF0000 pour avoir largement la place.


            Le re-pointage

Avant même de créer notre animation on va s'attaquer au re-pointage, c'est simple et sa évitera de perdre l'offsets.
VersionRouge FeuVert FeuilleRubySaphireEmeraude
Offset#3C170C#3C1548#3A219C#3A1FE4#5556AC
Tableau donnant l'offset du pointeur pour chaque version

Il faut remplacer le pointeur à cette offset par celui de l'offset à partir duquel va débuter votre nouvelle liste. (celui que vous venez de noter)
Dans mon exemple se sera 00 00 BF 08.

            Créons notre propre liste

On va enfin s'attaquer à cette liste, rendez vous à l'offset que vous avez choisis.
Chaque image se présente sous la forme suivante:
Citer

XX XX XX 08 YY YY 00 00
XX XX XX 08 est le pointeur sur l'image.
YY YY dépend de la taille de l'image. (Plus d’explication dans la partie sur les dimensions)
Le XX XX XX ne devrait pas vous posez de problème. Il s'agit de l'offset de l'image en little-endian (inversé).
Pour le YY YY, voici ce qu'il faut mettre en fonction de la taille de votre image : 16*16 = 80 00 ; 32*32 = 00 02; 64*64 = 00 08.

Et vous reproduisez ce schéma pour chaque image. Ce qui donnera quelque-chose sous la forme:
Citer

XX XX XX 08 YY YY 00 00 XX XX XX 08 YY YY 00 00
XX XX XX 08 YY YY 00 00 XX XX XX 08 YY YY 00 00
XX XX XX 08 YY YY 00 00 XX XX XX 08 YY YY 00 00
...
Personnellement, j'avais inséré ma première image à l'offset #B00000 et la seconde à l'offset #B00200. Toutes mes images sont en 32*32.
J'obtiendrai donc la liste suivante:

00 00 B0 08 00 02 00 00 00 02 B0 08 00 02 00 00
...

L'ordre dans lequel vous mettez les images dans la liste n'a pas d'importance, mais je vous conseille quand même de les mettre dans le même ordre que celui dans lequel elles seront affichées, ca vous simplifiera la tache pour la suite.

Et voilà, on a enfin terminé cette liste.

Les animations

Mais dire au jeu où se trouve nos images n'est pas suffisant, il faut aussi lui dire dans quelle ordre afficher ces images. C'est à ça que servent les "animations".

            Où crée son animation
Avant toute chose il faut choisir où insérer notre animation dans la rom, chaque étape est codée sur 4 octets et 2 autres octets sont nécessaire pour marquer la fin de l'animation. Faite donc en sorte d'avoir assez de place. (notez l'offsets auquel débute votre animation).

Souvenez vous, j'avais 9 images pour composer mon "émote", mais mon animation sera plus longue car je choisis d'afficher plusieurs fois certaines images, mon animation ressemblera à sa: img1 - img2 - ... - img8 - img9 - img5.
J'ai alors un total de 10 étapes. Donc il faut que je prévois un espace avec au moins 10*4+2= #2A octets disponibles. Encore une fois je prend large et je choisis de commencer à l'offset #BF1000.


            Le re-pointage
Encore une fois on va s'attaquer au re-pointage avant même de crée notre animation.
VersionRouge FeuVert FeuilleRubySaphireEmeraude
Offset#3C16EC - #3C1700#3C1528 - #3C153C#3A2188 - #3A2190#3A1FD0 - #3A1FD8#555698 - #5556A0
Tableau donnant les offsets des pointeurs pour chaque version
Il y a en faite 5 pointeurs différents (2 pour RSE), alors comment savoir lequel modifier, et bien en faite ça dépend de vous, il y a un pointeur pour chaque "émote" et ils sont dans l'ordre des raws, donc le premier pointeur correspond au #raw 61, le second au #raw 62, etc.

Moi j'ai envie que mon animation soit appelée quand j'utilise l'instruction #raw 62, je vais donc modifier le second pointeur (offset: #3C 16 F0) en #0001BF08.

            Créons notre animation
On va enfin pouvoir s'attaquer à cette animation. Chaque étape de l'animation peut être défini par 3 paramètres: l'image à afficher, sa durée, et le split à appliquer.

La structure pour chaque étape de l'animation est la suivante:
Citer
XX 00 YY 00
XX est l'indice de l'image dans la liste que l'on a créer au début, d’où l'importance de ne pas mettre les images dans n'importe quelle ordre. Attention on commence à l'indice 0 et non à l'indice 1.
YY correspond en faite à plusieurs informations. Pour les obtenir il faut le mettre sous la forme binaire (je donnerais pas d’explication sur cette conversion, ce n'est pas le but du tuto):
uvwwwwww
D'abord les wwwwww, il s'agit en faite de la durée pendant laquelle l'image doit être affichée, en frame (sachant que la gba à une fréquence de 60 image/s).
Le premier bit (u) correspond au split horizontal. 0 = pas de split ; 1 = split.
Le second bit (v) correspond au split vertical. 0 = pas de split ; 1 = split.

Remarque:
1 - Si aucun split n'est à appliquer contentez vous de mettre le nombre de frame directement en hexa, pas besoin de passer par le binaire.
2 - Le nombre maximum de frame est #3F (63), donc si vous voulez que votre image reste affichée plus longtemps il faudra faire plusieurs étapes avec la même image à la suite.

La première étape de mon animation sera la première image de la liste (donc indice 0), et sera affichée pendant 10 frames, sans split vertical n'y horizontal. Elle sera donc codée comme suit:

00 00 0A 00

Il me suffit alors de mettre le code de chaque étape à la suite et de finir par #FFFF pour avoir mon animation, on aura quelque chose sous la forme:

Citer
XX 00 YY 00 XX 00 YY 00 XX 00 YY 00 XX 00 YY 00
...
XX 00 YY 00 XX 00 YY 00 FF FF
Pour moi ce sera:
00 00 0A 00 01 00 0A 00 ...
08 00 0A 00 09 00 10 00 04 00 CF 00 FF FF

Et voilà, notre animation est terminée. Si vous avez gardé les dimensions par défaut vous pouvez déjà admirer votre création. Pour les autres ça continue, mais rassurez vous, c'est presque fini.

Les dimensions

Les images en 16*16 c'est gentil mais a part de simple "émote" ça permet pas de faire grand chose, mais il est possible d'augmenter ces dimensions pour avoir du 32*32 ou encore du 64*64.

Mais attention, il y a une contrainte très importante, toute les images doivent avoir la même dimension, sans exception.

            Les dimensions de l'image à afficher

VersionRouge FeuVert FeuilleRubySaphireEmeraude
Offset#3C161F#3C145B#3A215B#3A1FA3#55566B
Tableau donnant l'offset pour chaque version
L'octet à cette offset correspond aux dimensions des "émotes", il se présente sous la forme: X0 suivit de 00 04. Il vous suffit de remplacer le X par la valeur correspondant à vos dimensions: 4 pour 16*16 ; 8 pour 32*32 ; C pour 64*64.

            La quantité de donnée à mettre en mémoire
En faite vous n'aurez ici plus rien à modifier, vous avez donc fini ce tuto. Mais j'estime qu'une explication sur ce point pouvait vous être utile pour mieux comprendre certains points (pas uniquement en rapport avec ce tuto).

Le titre peut vous paraître flou mais en faite vous avez sans le savoir déjà dit au jeu quelle quantité de données mettre en mémoire, et oui c'était dans la partie sur comment créer sa liste, je vous avez dis que YY YY dépendais des dimensions de l'image sans donnéer plus de détaille.
Et bien ce YY YY (en little ediant) correspond à la quantité de données mis en mémoire. Et plus précisément la quantité d'octet à mettre en mémoire. Par exemple pour une image en 16*16 : 16*16 = 256 pixels, mais comme chaque octets code 2 pixels on divise par 2, soit 256 / 2 = 128 = #40.
En théorie, un nombre YY YY très grand donnerait toujours le bon résultat visuel car suffisamment de donnée serait en mémoire. Mais la mémoire est limitée donc on risque d’empiéter sur d'autres données en mémoire (et c'est ce qui arrive si YY YY est trop grand).
Vous pouvez essayer de faire varier YY YY et d'observer ce qui se passe en mémoire avec VBA (Tool->map) pour mieux comprendre ce que je tente d’expliquer.

           
Quelque exemples d'utilisation
Avant de vous quittez voici quelque exemples d'utilisation possibles de ces "émotes" offrant des possibilités scénariste vraiment sympa:
- Voir le rêve d'un personnage.
- Illustrer les propos d'un personage avec une petite animation.
- Faire parler les personnage à travers de petites bulles (Comme volucité dans N/B)
Une petite vidéo de ce que j'ai pu obtenir sans trop d'effort:
« Modifié: 10 mai 2013, 15:25 par Unifag »

yago58

  • Invité
09 mai 2013, 21:34
GG ajouté à la bibliothèque.

Tuturosso

  • Membre
  • 773 posts
09 mai 2013, 21:46
Genial le wattouat !
Il est normal le sprite du héros par contre?

yago58

  • Invité
09 mai 2013, 21:47
C'est pas gênant, le must c'est la bulle :D

Unifag

  • Membre
  • 883 posts
09 mai 2013, 21:54
Justement je parle du problème de la palette dans le tuto, le souci c'est que le hero et les émotes utilises la même palette. Mais je vais faire en sorte de palier à ce problème pour que l'on puissent utilisez une palette spécialement pour les émotes.

Tuturosso

  • Membre
  • 773 posts
09 mai 2013, 22:11
Dac donc si les sprites du heros sont modifiés tu as pas forcément de problèmes?

Unifag

  • Membre
  • 883 posts
09 mai 2013, 22:13
Bien sur que si, même si on modifie la palette du hero (ou encore le sprite) la palette reste commune au deux. Si la solution était si simple je l'aurais évoqué tu crois pas?

Tuturosso

  • Membre
  • 773 posts
09 mai 2013, 22:17
Bien sur que si, même si on modifie la palette du hero (ou encore le sprite) la palette reste commune au deux. Si la solution était si simple je l'aurais évoqué tu crois pas?
Au risque de paraître con on est obligé d avoir une palette commune à n importe quel sprite ou element?on peut pas en créer une en gros?

Unifag

  • Membre
  • 883 posts
09 mai 2013, 22:33
Enfaîte tu ne vois pas la chose correctement, je vais avoir du mal à m’expliquer la dessus mais je veux bien essayer.

La console n'est capable de charger qu'un certain nombre de palette à la fois (16 pour être exact), et chaque palette chargé peu être numéroté (de 0 à 15).
Donc à un certain moment la console va cherchez la palette du héro pour la placer dans le slot 3 (de mémoire mais peut importe).
Dis toi que le jeu ne dit pas directement "la palette du héro c'est celle qui se trouve à telle endroit dans la rom" mais plutôt "la palette du héro c'est celle qui se trouve dans le slot 3 de la mémoire".
Et c'est la même chose pour les émotes le jeu se dit "la palette à utilisez est celle dans le slot 3" (donc la même que pour le héro)

En faite je suis capable de dire au jeu d'utilisé la palette d'un autre slot (le slot 13 est en général inutilisé) mais le souci c'est que je ne sais pas comment mettre une palette en mémoire.

Donc on pourrais effectivement créer une nouvelle palette dans un espace vide de la rom mais si je n'arrive pas à la charger en mémoire c'est inutile.

Edit: j'ai rajouter les offsets de vert feuille dans le premier post + j'avais mis 16*32 mais c'était 16*16
Edit2: j'ai rajouté tous les offsets manquant + enlever certains trucs qui aurez pus vous embrouillez et qui ne servais à rien.
« Modifié: 10 mai 2013, 14:51 par Unifag »

Groud

  • Invité
10 mai 2013, 22:42
Attend, j'ai raté un wagon ou tu à réglé le problème de la palette?

Unifag

  • Membre
  • 883 posts
10 mai 2013, 23:20
Non toujours pas, mais je ne me suis pas encore penché dessus. Ce qu'est j'ai dit c'est que je peux changer le slot de la palette qu'utilise les émotes en mémoire pour choisir un slot vide, et il suffirait alors de charger la palette souhaité dans ce slot.  Mais je ne sais pas charger une palette en mémoire :/
« Modifié: 10 mai 2013, 23:25 par Unifag »

yago58

  • Invité
10 mai 2013, 23:37
Prends ton temps pour étudier la question, t'as fais un sacré boulot pour ce tuto, ça serait dommage que tu te plantes en voulant speeder

Groud

  • Invité
11 mai 2013, 15:27
C'est clair.
J'ai vu su PL hier, parle en à link il pourra peut-être t'aider ;)

Pages: [1]    En haut ↑