Forums Développement Multimédia

Les formations Mediabox
Les formations Mediabox
Vous êtes dans la section des pages en cours de rédaction. Cette page n'est pas terminée, et peut contenir des informations erronées.

Le binaire dans les jeux : hitTest

Par hubeert (hubeert), le 10 juillet 2011
Prérequis

Savoir ce qu'est un hitTest et connaitre les opérateurs sur le bit

Nous allons faire évoluer une balle ; l’arrêter aux limite voulues.

D'abords sur une ligne

Sur une colonne

en diagonale

Avec un obstacle

Avec des obstacles

Considérer l’interaction des balles entres elles ( “hitTest” multiples)

faire des ” hitTest” plus fin par l'image

Avant propos

Dans de nombreux jeux ; il est très utile de savoir ou est notre perso; de lui indiquer des limites a ne pas franchir; de lui indiquer ou sont des obstacles. Divers moyens sont utilisables, Monsieur Spi l'explique fort bien dans son tutoriel le tuto de Monsieur Spi

Pour ma part j'utilise une méthode fonctionnant avec les opérateurs sur le bit qui a l'avantage d’être très véloce

(Durant mon exposé j'utilise le terme de hitTest qui est inappropriée je le mettrai donc entre guillemet

"hitTest" sur un déplacement rectiligne horizontal

ou comment définir les limites a ne pas franchir par la balle

la faire déplacer de manière rectiligne.

Inverser sa direction lorsque elle touche les limites définies.

Voici un petit visuel composé d'un clip appelé “carre” a l'intérieur de ce clip un balle appelé “bal0”

L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu. voici le code.

var ligne:uint=ligne=1<<30 | 1<<0 ;// on  initialise nos variables le bit 30 est a true (la place est prise
//le bit zéro est a true la place est prise) 
var a:int=30;//la balle est placé au point 0 mais au point 30 de ma ligne car les coordonnées X augmentent 
//en allant vers la droite alors qu'un nombre en binaire se lit de de droite a gauche
var b:int=1;
var t:int;
 
var vitesse : int=carre.width/(31)// la vitesse est égale a la distance possible a parcourir divisée par le 
//nombre de déplacement possible mais aussi a la taille de la balle
carre.bal0.addEventListener(Event.ENTER_FRAME,Avance)
function Avance(e:Event) {
 if ( ligne & 1<<t){b=-b;}// si le bit  est a true inverse le sens
 if(a%b !=0) return //il faut que b soit un sous multiple de a
 t=Math.abs(a+=b);
 //Pour des raison de simplification je me sers de la variable b a la fois pour inverser la vitesse
 // mais aussi pour parcourir la variable ligne et a ce titre dans cette formule elle doit toujours 
 //etre positive
 e.target.x -=vitesse*b;// au départ on inverse le sens car la balle etant placée
 // au point 30 qui est a true le programme va de suite inverser le sens a nouveau
				}

Pour l'instant rien de transcendant avec deux conditions et un hitTest traditionnel ; en tenant compte de la grosseur de la balle et de la vitesse de déplacement nous aurions pu faire la même chose.

Notons quand même que je n'ai pas (trop) a me soucier de la grosseur de la balle.(il suffit quelle soit égale a la largeur de la zone de déplacement divisé par le nombre de déplacement possible (ici 31)

ni (trop) de la vitesse de déplacement.

si je double par exemple ma vitesse il suffit de doubler la valeur de b

avec un petite contrainte il faut que la l’accélérateur “b” soit un sous-multiple de 30

Alors quel intérêt? ici il est moindre mais dans le cas d'obstacles multiples le fait que les places libres ou prises soient inscrites dans une variable il nous suffira de comparer la place de notre perso par rapport a la place décrite dans notre variable.

maintenant voyons comment déplacer notre balle sur les Y

"hitTest" sur un déplacement rectiligne vertical

En fait c'est exactement pareil. On remplace la variable ligne par la variable colonne on change la direction .x par direction .y ; comme l'orthonormée de flash est un peu spéciale pour les y faut aussi inverser le sens de la direction des .y

L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu.

"hitTest" sur un déplacement rectiligne vertical et horizontal (diagonale)

C'est aussi simple qu'auparavant ; sauf que nous allons nous servir des deux variables “colonne” et ligne en même temps . Chaque variable gérant son propre déplacement X ou Y avec les contraintes spécifique de limite. L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu.

var colonne:uint=colonne=1<<30 | 1<<0 ;
var ligne:uint=ligne=1<<30 | 1<<0 ;
 
var a:int=27;// placé au point 27 car ma balle est placée a 3 place vers la droite sur les x
var a1:int=30// variable position pour les y
var b:int=1;
var b1:int=1
var t:int;
var t1:int;
 
 
var vitesse : int=carre.width/(31);
 
carre.bal0.addEventListener(Event.ENTER_FRAME,Avance);
 
function Avance(e:Event) {
      if ( ligne & 1<<t){b=-b;}// si le bit  est a true inverse le sens
      if(colonne & 1<< t1) {b1=-b1;}
      if(a % b !=0) return //il faut que b soit un sous multiple de a
      if(a1 % b1 !=0) return
      t=Math.abs(a+=b);
      t1=Math.abs(a1+=b1);
      e.target.x -=vitesse*b;
      e.target.y+= vitesse*b1
 }

Voila pour les divers déplacement nous allons ajouter un obstacle puis des obstacles fixe dans le prochain paragraphe.

"hitTest" sur un déplacement avec obstacle vertical ou horizontal continu

Imaginons un obstacle fixe un mur par exemple situé a 8 case en partant du haut et obturant completement notre aire de jeu. j'ai juste un ajout de code a faire. Il faut que je dise au programme ligne 8 il y a un obstacle sur toute les colonnes.

var colonne:uint=colonne=1<<30 | 1<<0 ;
var ligne:uint=ligne=1<<30 | 1<<0 ;

devient

var colonne:uint=colonne=1<<30 | 1<< 8| 1<<0 ;
var ligne:uint=ligne=1<<30 | 1<<0 ;

1« 8 signifie a que toutes les colonnes ont un obstacle a la ligne huit. ce qui donne visuellement.

L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu.

Plaçons un obstacle vertical..

il suffit d'indiquer au programme ou se trouve l'obstacle.

var colonne:uint=colonne=1<<30 | 1<< 8| 1<<0 ;
var ligne:uint=ligne=1<<30 |1<<6| 1<<0 ;

1« 6 signifie que toutes les lignes on un obstacle a la colonne 6.Ce qui donne visuellement.

L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu.

avec des changements minimes je contrôle ma balle avec facilité. :D

Voyons maintenant les “hitTest” avec des obstacles discontinus.

"hitTest" sur un déplacement avec obstacle vertical ou horizontal discontinu

Les test de collisions ne sont pas toujours linéaire un mur peut avoir un passage, un labyrinthe une sortie.

Dans les exemples précédents nous avions selon les cas des lignes ou des colonnes qui avait toutes la même valeur si l'on veut considérer un obstacle comportant un passage ou plusieurs passages il suffit de “remodeler” les lignes ou les colonnes en fonction de nos besoins.

Dans le visuel suivant j'ai placer un obstacle sur la ligne 7 cet obstacle commence a la colonne 10 et fini a la colonne 30 (le bit le plus bas est a gauche) il me suffit donc d'ecrire de 0 a 10 les colonnes serton dépourvues d'obstacle ormis les limites fixées.

var colonne :Array=new Array()
for( var i:int=0;i<11;i++) {
	colonne[i]=1<<30 |1<<0 // les colonnes sont vide d'obstacle ormis aux limites
	}  

et pour les autres

for( var j:int=10;j<31;j++) {
	colonne[j]=1<<30 | 1<< 7|1<<0 // les colonnes ont un obstacle  a la ligne 7
}

et dans ma fonction Avance il suffit que j'indique au programme quelle colonne tester le numero de la colonne etant donné par sa position sur les X .

En deux boucles j'ai placer un obstacle discontinu simple et la balle réagit bien a l'obstacle.

L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu.

et pour le fun

L"extension Adobe Flash Plugin est nécessaire pour afficher ce contenu.

En quelques lignes de code on peut mettre autant d'obstacle que l'on veut .

La performance est telle qu'on est est pas pas obligé de recourir a l'astuce qui consiste a ne tester que les point environnant par la force des choses l'ordinateur sachant ou est la balle ne teste que le point suivant lignes ou colonne.

Dans des jeux plus évoluée relevant de l'intelligence artificielle comme un jeux de croix on peut être amener a tester en plus des lignes et des colonne les diagonales droites et gauches.

"hitTest" sur les balles entre elles

Puisque nous connaissons la place des balles sur la colonne ou la ligne concernée On peut facilement faire un “hittest” entres les balles.

Afin de gérer les collisions mettons en place ce principe :

chaque balle gère ses collision avec les obstacles ( nous avons vu ci dessus comment faire)

opérateurs binaires et Base de données

Le binaires et ses opérateurs; Exemple

Généralité sur les opérateurs binaires,Par Thoutmosis

Le binaire et la representation des nombres,Par Thoutmosis