이 글은 H5EDU 조직의 공식 HTML5 트레이닝 튜토리얼입니다. 주로 소개하는 내용은 다음과 같습니다: JavaScript 향상 튜토리얼 - cocosjs 충돌 감지
게임의 충돌 감지 원리를 간략하게 설명합니다. 먼저, 충돌 감지 영역을 지정합니다. 각 게임 개체를 업데이트한 후 Update 메서드에서 두 개체의 영역이 겹치는지 실시간으로 감지하면 충돌이 발생합니다.
코드를 간단히 살펴보겠습니다. 이 코드는 공식 코드에서 추출한 것입니다.
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); } };
코드를 간단히 살펴보겠습니다. 충돌 감지 중에 각 게임의 충돌 영역이 표시됩니다. 객체가 비교됩니다(위 코드에서는 영역의 높이와 너비를 20으로 설정했습니다. 영역의 좌표는 현재 게임 객체 좌표에서 3을 뺀 값입니다. 이 3은 게임의 다양한 객체에 따라 동적으로 조정되어야 합니다) . 이 두 영역의 위치를 얻은 후 cc.lectInterestsRect 함수가 해당 작업을 수행합니다. 실제로 영역 범위 감지는 cc.lectInterestsRect 함수 내에서도 수행됩니다.
충돌 후 게임 개체를 숨기려면 gameObject.setVisibility(false)를 사용하세요.
cc.fadeIn, cc.fadeOut의 충돌 감지 결과를 이용하면 충돌 애니메이션을 쉽게 만들 수 있습니다