Heim > Artikel > Web-Frontend > Tutorial zur JavaScript-Verbesserung – CocosJS-Kollisionserkennung
Dieser Artikel ist das offizielle HTML5-Schulungs-Tutorial der H5EDU-Organisation. Er stellt hauptsächlich vor: JavaScript-Erweiterungs-Tutorial – CocosJS-Kollisionserkennung
Beschreiben Sie kurz das Kollisionserkennungsprinzip des Spiels: Geben Sie zunächst einen Kollisionserkennungsbereich an Jedes Spielobjekt wird dann in der Update-Methode in Echtzeit erkannt, ob sich die Bereiche der beiden Objekte überlappen. Wenn ja, dann kommt es zu einer Kollision.
Werfen Sie einen kurzen Blick auf den Code.
tools.CollisionHelper={ IsCollided:function(ccA,ccB){ var ax = ccA.x, ay = ccA.y, bx = ccB.x, by = ccB.y; /*if (Math.abs(ax - bx) > 5|| Math.abs(ay - by) >5) { return false; }*/ var aRect = this.MakeCollideRect(ccA); var bRect = this.MakeCollideRect(ccB); return cc.rectIntersectsRect(aRect, bRect); }, MakeCollideRect: function (ccA) { return cc.rect(ccA.x - 3, ccA.y - 3, 20, 20); } };
Sehen Sie sich kurz den Code an: Während der Kollisionserkennung wird der Kollisionsbereich jedes Spiels angezeigt Objekt wird verglichen (Im obigen Code legen wir die Höhe und Breite des Bereichs auf 20 fest. Die Koordinaten des Bereichs sind die aktuellen Spielobjektkoordinaten minus 3. Diese 3 müssen dynamisch an verschiedene Objekte im Spiel angepasst werden.) . Nachdem Sie die Standorte dieser beiden Bereiche erhalten haben, senden Sie sie an die Funktion cc.rectInterestsRect. Tatsächlich erfolgt die Bereichserkennung auch innerhalb der Funktion cc.rectInterestsRect.
Wenn Sie das Spielobjekt nach einer Kollision ausblenden möchten, verwenden Sie einfach: gameObject.setVisibility(false).
Es ist einfach, eine Kollisionsanimation zu erstellen, indem Sie die Ergebnisse der Kollisionserkennung mit cc.fadeIn und cc.fadeOut verwenden