• 12 heures
  • {0} Facile|{1} Moyenne|{2} Difficile

Ce cours est visible gratuitement en ligne.

Ce cours existe en livre papier.

Vous pouvez être accompagné et mentoré par un professeur particulier par visioconférence sur ce cours.

J'ai tout compris !

Mis à jour le 30/04/2014

Les collisions

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Un jour, si êtes amené à programmer des jeux vidéo, vous allez devoir vous intéresser à la notion de collisions. Vous souhaiterez alors savoir si votre voiture quitte la route, si un objet sort du cadre de la scène, si deux billes se touchent ou encore si votre personnage a les pieds sur terre…

Au cours de ce chapitre, nous découvrirons ensemble les prémices de la théorie des collisions. Ainsi, nous serons capables de détecter une collision entre des objets de différentes tailles et différentes formes. Nous verrons également comment affiner, plus ou moins, cette détection de collisions, en fonction de la forme des objets, afin d'optimiser au maximum les performances du programme.

À la fin de ce chapitre, vous serez enfin en mesure de réaliser vos propres jeux vidéo !

Préambule

Définition d'une collision

Comme cela a été annoncé en introduction, nous parlerons de collisions tout au long de ce chapitre.
Aussi, pour mieux comprendre tout ce qui va suivre, nous allons d'abord définir le terme "collision".

Dans la vie de tous les jours, nous attribuons ce terme à toutes sortes d'impact ou de choc entre deux objets. Nous pouvons citer l'exemple d'un verre qui se brise au contact du sol, d'une balle qui atteint sa cible ou encore d'une voiture qui percute un mur.

Dans un programme, nous pourrons parler de collision lorsque deux objets « se touchent » ou se chevauchent. De la même manière, nous pourrons savoir si un objet verre est en contact avec un autre objet sol ou si notre objet voiture percute l'objet mur.

En principe, rien n'empêche votre objet voiture de continuer sa course à travers l'objet mur. Cela ne posera absolument aucun problème à votre application pour continuer à s'exécuter. Il faut avouer que c'est tout de même fâcheux !
Il nous incombe donc de gérer les collisions à l'intérieur de notre programme afin de pouvoir exécuter des tâches appropriées.

À la figure suivante, vous pouvez voir que les objets voiture et mur se chevauchent légèrement, et sont, par conséquent, en collision.

Collision entre les objets voiture et mur
Collision entre les objets voiture et mur

Détecter des collisions

Des fonctions booléennes

Le principal objectif pour un programmeur sera donc de détecter l'existence d'une collision entre deux objets.

Mais alors, comment savoir s'il y a collision entre deux objets ?

C'est justement toute la difficulté de la chose, mais également la raison d'être de ce chapitre. Nous verrons qu'il existe différents moyens d'y arriver, qui dépendent principalement de la forme des objets et de la précision souhaitée.

Quoi qu'il en soit, nous détecterons les collisions toujours de la même manière : nous utiliserons diverses fonctions ou méthodes, prenant en paramètres les objets à tester, et renvoyant un booléen, qui sera vrai si il y a collision entre les objets transmis ou faux dans le cas inverse.

Effets produits par une collision

Les effets engendrés par une éventuelle collision ne sont pas pris en compte dans ces fonctions de détection de collisions. Ce n'est qu'une fois la collision confirmée qu'il est possible de gérer l'impact généré par celle-ci.

Prenons l'exemple d'un choc entre deux boules quelconques, comme sur la figure suivante.

Choc élastique entre deux boules
Choc élastique entre deux boules

Dans l'exemple précédent, nous voyons que nos boules sont en collision à la troisième position. À la suite de ce choc, les boules sont alors déviées et leur vitesse modifiée. Dans ce cas précis, nous pourrions nous appuyer sur la théorie des chocs élastiques pour mettre à jour le mouvement de chacune des boules. Néanmoins, l'effet produit par la collision aurait été traité différemment s'il s'agissait d'un choc entre un objet voiture et un objet mur ou encore entre les objets verre et sol.

Les instructions qui découlent d'une collision sont donc directement liés aux types d'objets que vous manipulez, ou plutôt à ce qu'ils représentent. Par ailleurs, cela dépend également de ce que vous, en tant que programmeur, souhaitez faire. Par exemple, l'impact de l'objet voiture sur le mur pourrait stopper net cette dernière en déformant son capot, mais pourrait tout aussi bien la faire « rebondir » et laisser celle-ci intacte. De plus, suivant la vue utilisée (vue de face, de dessus, de côté, etc.) et la manière dont vos classes sont construites, les instructions ne seront pas tout les mêmes.

La théorie des collisions

Collisions rectangulaires

La méthode hitTestObject()

Par défaut, tout objet héritant de DisplayObject dispose de deux méthodes servant à détecter des collisions entre objets d'affichage. La première, nommée hitTestObject() est celle dont nous allons parler maintenant. Pour cela, nous aurons besoin de deux objets.
Traçons deux rectangles qui se superposent, au moins partiellement :

var obj1:Shape = new Shape();
obj1.graphics.beginFill(0x000000);
obj1.graphics.drawRect(0, 0, 100, 100);
var obj2:Shape = new Shape();
obj2.graphics.beginFill(0x880088);
obj2.graphics.drawRect(50, 50, 100, 100);
addChild(obj1);
addChild(obj2);

La figure suivante nous confirme que les objets obj1 et obj2 se chevauchent bien.

Collision entre deux rectangles
Collision entre deux rectangles

À présent, testons la collision entre ces deux objets.

Pour cela, nous allons donc nous servir de la méthode hitTestObject() qui prend en paramètre simplement l'objet d'affichage avec lequel tester la collision. Sachant que la méthode hitTestObject() appartient à la classe DisplayObject, nous pouvons aussi bien l'utiliser à partir de l'objet d'affichage obj1 comme obj2.

Pour s'assurer de son bon fonctionnement, affichons le résultat de cette fonction dans la console, comme ceci :

trace(obj1.hitTestObject(obj2)); // Affiche : true

Comme vous n'êtes pas dupes, confirmons le bon fonctionnement de la méthode hitTestObject() en déplaçant un de des rectangles et en ré-affichant le résultat :

obj2.y = 100;
trace(obj1.hitTestObject(obj2)); // Affiche : false

La méthode hitTestObject() possède néanmoins un énorme défaut lorsqu'il s'agit d'étudier une collision entre deux objets non rectangulaires. En effet, la détection de collision réalisée à l'intérieur de cette méthode est effectuée non pas sur les objets d'affichages eux-mêmes, mais sur leur cadre de sélection que nous allons à présent évoquer.

Les cadres de sélection

Un cadre de sélection (ou bounding box en anglais) peut être défini comma la plus petite zone rectangulaire incluant intégralement un objet d'affichage.

Étant donné qu'un dessin est toujours plus parlant, reprenons l'exemple de la collision entre nos objets d'affichage voiture et mur. La figure suivante nous montre alors ces deux objets délimités par leur cadre de sélection respectif.

Les objets d'affichage et leur cadre de sélection
Les objets d'affichage et leur cadre de sélection

Pour revenir aux collisions rectangulaires, la méthode hitTestObject() réalise donc un test de collision entre les cadres de sélection de deux objets d'affichage et non sur leurs formes réelles.

Collisions avec la scène principale

Jusqu'à présent, nous avons vu uniquement comment détecter des collisions rectangulaires correspondant, plus ou moins, à deux objets qui se percutent. Toutefois, dans d'autres cas, il peut être utile de détecter si un objet sort d'une certaine zone délimitée.

Par exemple, ce type de collisions peut être utilisé pour détecter si un objet sort de la scène principale. Nous allons donc voir maintenant comment gérer ce genre de cas.

Sur la figure suivante, j'ai rappelé les coordonnées limites de la scène principale de votre animation.

Limites de la scène principale
Limites de la scène principale

Pour apprendre à gérer les collisions avec la scène principale, je vous propose un petit exemple. Nous allons ainsi réaliser une animation où un rectangle suivra les mouvements de souris, mais sans sortir du cadre de la scène principale.

Commençons par dessiner un rectangle et faisons-le suivre la souris. Vous devriez maintenant savoir coder tout ça, mais je vais quand même vous donner un petit coup de pouce pour ceux qui auraient oublié comment procéder ;) :

var rectangle:Shape = new Shape();
rectangle.graphics.beginFill(0x00BB00);
rectangle.graphics.drawRect(-50, -50, 100, 100);
addChild(rectangle);
stage.addEventListener(MouseEvent.MOUSE_MOVE, deplacer);
function deplacer(event:MouseEvent):void
{
    rectangle.x = event.stageX;
    rectangle.y = event.stageY;
}

Pour tester si notre objet sort de la scène principale, nous devons tester les limites de notre rectangle par rapport aux dimensions de l'animation. Étant donné que notre rectangle est centré sur son origine locale, nous pouvons détecter les dépassements de cette manière :

function deplacer(event:MouseEvent):void
{
    rectangle.x = event.stageX;
    rectangle.y = event.stageY;
    
    // Bord gauche
    if (rectangle.x - rectangle.width / 2 < 0)
    {
        trace("Trop à gauche");
    }
    // Bord droit
    if (rectangle.x + rectangle.width / 2 > stage.stageWidth)
    {
        trace("Trop à droite");
    }
    // Bord haut
    if (rectangle.y - rectangle.height / 2 < 0)
    {
        trace("Trop haut");
    }
    // Bord bas
    if (rectangle.y + rectangle.height / 2 > stage.stageHeight)
    {
        trace("Trop bas");
    }
}

Enfin, pour empêcher le rectangle de sortir de la scène principale, il suffit de réinitialiser sa position pour que celui-ci reste adjacent à la bordure éventuellement franchie.

Voilà comment nous pourrions faire :

function deplacer(event:MouseEvent):void
{
    rectangle.x = event.stageX;
    rectangle.y = event.stageY;
    if (rectangle.x - rectangle.width / 2 < 0)
    {
        rectangle.x = rectangle.width / 2;
    }
    if (rectangle.y - rectangle.height / 2 < 0)
    {
        rectangle.y = rectangle.height / 2;
    }
    if (rectangle.x + rectangle.width / 2 > stage.stageWidth)
    {
        rectangle.x = stage.stageWidth - rectangle.width / 2;
    }
    if (rectangle.y + rectangle.height / 2 > stage.stageHeight)
    {
        rectangle.y = stage.stageHeight - rectangle.height / 2;
    }
}

Collisions circulaires

Le théorème de Pythagore

Pour détecter des collisions entre deux objets de forme circulaire, nous aurons besoin de calculer la distance qui sépare leurs centres. Pour cela, nous utiliserons le théorème de Pythagore !
Certains d'entre vous auront peut-être l'impression de retourner sur les bancs de l'école, mais il est important de faire un petit rappel de ce théorème. Je passerai néanmoins relativement vite sur ce point, ne vous inquiétez pas !

Pour rappel, le théorème de Pythagore définit une relation entre les trois côtés d'un triangle rectangle, tel que celui sur la figure suivante.

Un triangle rectangle
Un triangle rectangle

En utilisant la notation de l'image précédente, le théorème de Pythagore définit la relation suivante :
$\[a^2 = b^2 + c^2\]$

Calcul des distances

Maintenant, nous allons voir comment calculer la distance entre deux objets. Dans le cas présent, nous nous focaliserons sur les cercles. Néanmoins, ceci peut facilement être transposable à d'autres types d'objets.

Lorsque nous utilisons le terme "distance" entre deux objets, nous parlons de celle qui sépare les centres de nos objets. Ainsi, à la figure suivante, nous pouvons voir comment elle est définie dans le cas des cercles.

Distance entre deux cercles
Distance entre deux cercles

D'après le théorème de Pythagore, nous avons donc la relation suivante :
$\[d^2 = (\Delta x)^2 + (\Delta y)^2\]$
Dans l'expression précédente, $\Delta x$ représente la différence d'abscisse entre les deux objets, c'est-à-dire $\[x_2 - x_1\]$. Bien entendu, c'est la même chose pour $y$.

Nous supposerons ici que les objets d'affichage correspondant aux cercles possèdent leur origine d'affichage au centre des cercles. Nous pouvons alors calculer la distance entre deux cercles de cette manière :

var d:Number = Math.sqrt(Math.pow(objet2.x - objet1.x, 2) + Math.pow(objet2.y - objet1.y, 2));

Toutefois, en considérant le temps nécessaire pour réaliser cette opération, il serait préférable d'utiliser quelque chose de plus optimisé. En effet, l'utilisation de la multiplication est plus rapide que le passage par la méthode pow() de la classe Math. En fait, il serait plus intéressant, du point de vue des performances, de ne pas utiliser cette classe. C'est pourquoi, il est préférable de travailler avec des distances au carré, ce qui nous évite d'avoir recours à la méthode sqrt().

Voici donc comment redéfinir cette même instruction sans utiliser la classe Math et en restant en distance au carré :

var d:Number = (objet2.x - objet1.x)*(objet2.x - objet1.x) + (objet2.y - objet1.y)*(objet2.y - objet1.y);
Détecter une collision

À présent, vous savez calculer la distance entre deux cercles. Cela tombe bien, nous allons justement en avoir besoin pour détecter les collisions entre objets de forme circulaire. Quelle que soit la position et l'orientation de chacun des deux cercles, ceux-ci seront en collision si la distance entre leurs centres est inférieure à une certaine valeur.
Voyez plutôt la figure suivante.

Distance maximale de collision
Distance maximale de collision

En regardant l'image précédente de plus près, nous pouvons en déduire que la distance maximale de collision entre deux cercles est $r_1 + r_2$, soit $2r$ dans le cas de deux cercles de rayons identiques. Par ailleurs, nous pouvons également utiliser le fait que le rayon d'un objet correspond exactement à la moitié de sa largeur ou de sa hauteur.

Pour détecter une collision entre deux objets d'affichage obj1 et obj2 de forme circulaire, nous pouvons définir une fonction de ce style :

function testerCollision(obj1:DisplayObject, obj2:DisplayObject):Boolean
{
    var collision:Boolean = false;
    var d:Number = (obj2.x - obj1.x)*(obj2.x - obj1.x) + (obj2.y - obj1.y)*(obj2.y - obj1.y);
    if(d < (obj1.width/2 + obj2.height/2)*(obj1.width/2 + obj2.height/2))
    {
        collision = true;
    }
    return collision;
}

Collisions ponctuelles

La méthode hitTestPoint()

Nous allons maintenant nous pencher sur le cas des collisions ponctuelles, c'est-à-dire entre un objet d'affichage et un point. Ce dernier sera alors uniquement caractérisé par ses coordonnées x et y.

Nous n'allons pas entrer dans la théorie, je vais plutôt vous présenter une méthode faisant le travail à votre place. Il s'agit de la méthode hitTestPoint() présente dans toute classe héritant de DisplayObject. En voici sa signature :

hitTestPoint(x:Number, y:Number, shapeFlag:Boolean = false):Boolean

Comme vous le voyez, l'utilisation de cette méthode nécessite de renseigner les coordonnées du point avec lequel tester la collision ainsi qu'un troisième paramètre facultatif nommée shapeFlag. Ce dernier paramètre, de type Boolean, sert à spécifier si la détection de collision doit être faite sur l'objet lui-même en tant que forme complexe (true) ou uniquement d'après son cadre de sélection (false).

Ce type de détection de collisions peut être extrêmement utile dans certains cas. Par exemple, vous pourriez réaliser un jeu de tir et détecter la collision entre la position de votre curseur et un ennemi quelconque comme l'illustre bien la figure suivante.

Un jeu de tir utilisant les collisions ponctuelles
Un jeu de tir utilisant les collisions ponctuelles

Pour vous donner un exemple de code, voici comment il serait possible de réaliser cette détection à partir de la méthode hitTestPoint() :

stage.addEventListener(MouseEvent.MOUSE_DOWN, tir);
function tir(event:MouseEvent):void
{
    if (maCible.hitTestPoint(event.stageX, event.stageY, true)) {
        trace("Cible atteinte");
    }
}

Si vous souhaitez tester ce code, il vous suffit d'instancier un objet d'affichage maCible et de l'ajouter à la liste d'affichage. Le code précédent vous servira alors à détecter les collisions entre votre curseur et cet objet lors d'un clic avec votre souris.

Exercice : Un mini-jeu de tir

Le principe du jeu va être relativement simple. Nous allons tout d'abord dessiner une balle qui se baladera à l'intérieur de la scène principale. Puis, lorsque vous cliquerez dessus, votre score de points augmentera.

Démarrons tout de suite en dessinant un disque représentant notre balle que nous placerons initialement au centre de l'écran :

var cible:Shape = new Shape();
cible.graphics.beginFill(0x880088);
cible.graphics.drawCircle(0, 0, 50);
cible.x = stage.stageWidth / 2;
cible.y = stage.stageHeight / 2;
addChild(cible);
var score:int = 0;

Pour gérer les mouvements de notre balle, nous allons avoir besoin d'utiliser deux variables vitesseX et vitesseY qui représenteront donc sa vitesse de déplacement horizontale et verticale. Pour détecter les collisions avec la scène principale, nous utiliserons le principe des collisions rectangulaires, qui, dans ce cas, sera plus que suffisant. À la suite d'une collision, nous pourrons mettre à jour la position de l'objet ainsi que sa vitesse, qui sera inversée suivant le côté de la scène que la balle aura percuté.

Tout ceci peut sans doute vous paraître compliqué, pourtant, regardez le code correspondant qui n'est pas si terrible :

// On initialise des vitesses horizontales et verticales aléatoirement
var vitesseX:int = 1 + Math.random() * 10;
var vitesseY:int = 1 + Math.random() * 10;

// Pour chaque frame
addEventListener(Event.ENTER_FRAME, deplacer);
function deplacer(event:Event):void
{
    // On déplace la balle
    cible.x += vitesseX;
    cible.y += vitesseY;
    
    // On détecte les collisions de la balle avec la scène
    
    // Bord gauche
    if (cible.x - cible.width / 2 < 0)
    {
        cible.x = cible.width / 2;
        vitesseX = - vitesseX;
    }
    // Bord droit
    else if (cible.x + cible.width / 2 > stage.stageWidth)
    {
        cible.x = stage.stageWidth - cible.width / 2;
        vitesseX = - vitesseX;
    }
    
    // Bord haut
    if (cible.y - cible.height / 2 < 0)
    {
        cible.y = cible.height / 2;
        vitesseY = - vitesseY;
    }
    // Bord bas
    else if (cible.y + cible.height / 2 > stage.stageHeight)
    {
        cible.y = stage.stageHeight - cible.height / 2;
        vitesseY = - vitesseY;
    }
}

Enfin, la gestion des tirs peut se faire à l'aide la méthode hitTestpoint() comme cela a été décrit précédemment :

stage.addEventListener(MouseEvent.CLICK, tir);
function tir(event:MouseEvent):void
{
    if (cible.hitTestPoint(event.stageX, event.stageY, true))
    {
        score += 10;
        trace("Score : " + score);
    }
}

L'exercice que nous venons de réaliser est un préambule à un jeu de tir plus complexe. Pour vous exercer, je vous invite donc grandement à essayer de réaliser un vrai jeu de tir suivant vos envies.

Les collisions de pixels

Utiliser l'opacité

Les masques

Une autre manière d'appréhender les collisions est d'utiliser les objets d'affichage sous forme d'images bitmap. Comme vous le savez maintenant, ces images sont décrites par une série de pixels. Et rappelez-vous, les pixels sont caractérisés par des nombres de la forme 0xAARRVVBB, où AA représentent l'opacité du pixel.

L'opacité d'un objet d'affichage permet justement de décrire les contours de la partie visible de celui-ci. C'est pourquoi, l'opacité est grandement utile pour effectuer des tests de collisions. Mais nous reviendrons là-dessus plus tard.

En attendant, la figure suivante vous montre à quoi peut ressembler le canal alpha de l'image voiture, appelé généralement masque de l'image.

Masque (ou opacité) de l'objet voiture
Masque (ou opacité) de l'objet voiture
Une manière de détecter des collisions

Ici, nous allons voir comment nous pourrions procéder pour détecter une collision entre deux images bitmap. Toutefois, nous verrons que la classe BitmapData intègre une méthode hitTest(). Malheureusement, je ne suis pas certain de son fonctionnement interne. Mais, quoi qu'il en soit, cela ne nous empêche pas d'imaginer la manière dont cela pourrait être fait.

La technique dont je vais vous parler est simplement tirée de mon imagination. Il est donc fort probable qu'il y ait d'autres façons d'y parvenir et de manière plus optimisée. Néanmoins, je cherche ici simplement à vous faire découvrir une méthode que vous pourriez vous-mêmes transcrire en code. Vous pourrez ensuite très facilement adapter celle-ci ou une autre à vos projets pour des applications diverses.

La technique que je vais vous présenter maintenant tire parti du fait qu'une transparence totale est représentée par une valeur correspondante nulle. Je ferais également l'hypothèse que l'opacité est représentée par une valeur décimale comprise entre 0 et 1. Ainsi, en multipliant simplement les valeurs des opacités des deux pixels devant se superposer, nous obtenons un nouveau masque contenant simplement l'intersection des deux images.

Je vous propose un exemple utilisant des matrices pour illustrer ceci. Pour cela, nous utiliserons le produit d'Hadamard ou produit composante par composante. N'ayez pas peur, cela n'est pas aussi compliqué que ça en a l'air.

Voyez plutôt :
$\begin{pmatrix} 1 & 1 & 0 & 0\\ 1 & 1 & 0 & 0\\ 1 & 1 & 0 & 0\\ 1 & 1 & 0 & 0 \end{pmatrix} . \begin{pmatrix} 1 & 1 & 1 & 1\\ 1 & 1 & 1 & 1\\ 0 & 0 & 0 & 0\\ 0 & 0 & 0 & 0 \end{pmatrix} = \begin{pmatrix} 1 & 1 & 0 & 0\\ 1 & 1 & 0 & 0\\ 0 & 0 & 0 & 0\\ 0 & 0 & 0 & 0 \end{pmatrix}$
Grâce à ce calcul, toute valeur non-nulle correspond donc à un pixel étant en collision entre les deux objets. Il pourrait même être envisageable d'utiliser un seuil pour les valeurs intermédiaires entre 0 et 1 pour considérer s'il y a collision ou non.

Dans l'encadré rouge de la figure suivante, je vous laisse apprécier ce que cette méthode pourrait donner localement pour notre problème de collision entre les objets voiture et mur.

Résultat d'une multiplication entre les masques de deux images
Résultat d'une multiplication entre les masques de deux images

Une fois cette multiplication faite, nous n'allons plus qu'à parcourir l'ensemble des pixels pour détecter si les pixels dépassent le seuil d'opacité définit (ou son carré si vous souhaitez prendre en compte la multiplication appliquée aux valeurs de base). Un seul pixel dépassant le seuil d'opacité est alors synonyme de collision.

Application en code

Une méthode prête à l'emploi

Vous ayant déjà détaillé le principe, je vais simplement ici vous exposer le code d'une classe intégrant une méthode statique réalisant ce travail à partir d'objets d'affichage quelconques.

package
{
    import flash.display.DisplayObject;
    import flash.display.BitmapData;
    import flash.geom.Matrix;
    import flash.geom.Point;
    import flash.geom.Rectangle;
    
    public class Collision
    {
        
        public function Collision()
        {
            throw new Error('Classe abstraite');
        }
        
        static public function tester(obj1:DisplayObject, obj2:DisplayObject, seuil:uint):Boolean
        {
            var collision:Boolean = false;
            if (obj1.hitTestObject(obj2) == true)
            {
                var img1:BitmapData = creerBitmapData(obj1);
                var img2:BitmapData = creerBitmapData(obj2);
                var rect1:Rectangle = obj1.getBounds(obj1);
                var rect2:Rectangle = obj2.getBounds(obj2);
                var pos1:Point = new Point(obj1.x + rect1.x, obj1.y + rect1.y);
                var pos2:Point = new Point(obj2.x + rect2.x, obj2.y + rect2.y);
                collision = img1.hitTest(pos1, seuil, img2, pos2, seuil);
            }
            return collision;
        }
        
        static private function creerBitmapData(objet:DisplayObject):BitmapData
        {
            var image:BitmapData = new BitmapData(objet.width, objet.height, true, 0x00000000);
            var rect:Rectangle = objet.getBounds(objet);
            var transformation:Matrix = new Matrix();
            transformation.translate(-rect.x, -rect.y);
            image.draw(objet, transformation);
            return image;
        }
    
    }

}

Comme je l'ai dit plus haut, tout repose sur la méthode hitTest() de la classe BitmapData. Le reste est uniquement la mise en place des éléments à transmettre à cette méthode.

Un exemple d'utilisation

Pour tous ceux qui souhaiteraient voir l'efficacité de la méthode statique donnée précédemment, je vous propose ci-dessous un petit code d'exemple. Regardez alors la simplicité d'utilisation de cette méthode.
Encore une fois, un grand merci à la POO.

var obj1:Shape = new Shape();
obj1.graphics.lineStyle(20, 0x000000);
obj1.graphics.drawCircle(200, 200, 100);
var obj2:Shape = new Shape();
obj2.graphics.beginFill(0x880088);
obj2.graphics.drawCircle(0, 0, 15);
obj2
addChild(obj1);
addChild(obj2);
addEventListener(Event.ENTER_FRAME, maFonction);
function maFonction():void
{
    obj2.x = mouseX;
    obj2.y = mouseY;
    if (Collision.tester(obj1, obj2, 0x11)) {
        obj1.filters = new Array(new GlowFilter());
    }else{
        obj1.filters = new Array();
    }
}

Ce chapitre n'était qu'une introduction à la théorie des collisions. Même si vous savez désormais répondre à la plupart de vos besoins en termes de collisions, n'hésitez pas à vous perfectionner, notamment grâce au tutoriel « Théorie des collisions » de Fvirtman.

En résumé
  • La détection d'une collision entre deux objets d'affichage se fait à l'aide d'une fonction booléenne.

  • Suivants la forme des objets d'affichage et la précision de détection souhaitée, ces fonctions de tests de collisions doivent être différentes.

  • Pour tout DisplayObject, la méthode hitTestObject() permet de détecter des collisions entre deux objets à partir de leur cadre de sélection.

  • La méthode hitTestPoint() de la classe DisplayObject sert à tester une éventuelle collision entre un objet quelconque et un point.

  • Pour affiner au mieux les collisions entre deux objets aux formes complexes, la méthode hitTest() de la classe BitmapData effectue des tests au niveau des pixels.

  • Les effets engendrées par une collision doivent être traités en dehors des fonctions booléennes de détection des collisions.

Exemple de certificat de réussite
Exemple de certificat de réussite