[Cocos Creator] Physics Manager 정복하기(1) - 물리공간 생성 및 설정

물리엔진

물리엔진이란 게임 등에서 물체에 작용하는 물리적 현상, 즉, 중력이나 관성 등에 관한 부분을 처리하는 프로그래밍 파트입니다. 물리엔진은 여러종류가 있는데 Cocos Creator 는 그중 Box2d 엔진을 Physics Manager를 통해 사용하기 편하게 제공하고 있습니다.

그럼 Physics Manager를 어떻게 사용하는지 알아보겠습니다.

프로젝트생성

Physics Manager 를 사용하기 위해서 먼저 테스트 할 프로젝트를 만들고 테스트를 위해서 Sprite Node 2개를 추가하겠습니다.

그다음 Physics Component 를 추가합니다. Node Tree 에서 해당 Node 를 클릭하고 Add Component -> Add Physics Component -> Collider 에서 원하는 모양의 Collider 를 추가할 수 있습니다. 저같은 경우는 상자는 Box, 오렌지는 Circle 로 추가했습니다.

추가를 하면 2개의 Component 가 생성됩니다. 2개의 Component 에 대해서는 따로 설명하겠습니다.

이제 테스트 세팅이 완료되었으니 Physics Manager 를 사용하기위해 스크립트를 작성해보겠습니다.

Physics Manager 활성화

Physics Manager 를 활성화 시키기 위해 스크립트를 생성하여 Canvas 노드에 추가하겠습니다. 스크립트 기본 세팅은 아래와 같이하겠습니다.

cc.Class({

extends: cc.Component,

properties: {

},

onLoad: function () {

},

start: function () {

}

});

Physics Manager 는 기본적으로 비활성화 되어 있습니다. 물리공간을 사용할 경우 먼저 해야할 일은 Physics Manager 를 활성화하는 것입니다. 그렇지 않으면 스크립트에서 설정한 모든 물리 객체가 아무런 영향을 끼치지 않습니다. Physics Manahger 를 활성화하는 코드는 아래와 같습니다.

this.physicsManager = cc.director.getPhysicsManager();

this.physicsManager.enabled = true;

cc.director.getPhysicsManager() 를 호출해서 Physics Manager 객체를 가져온 후 enabled 를 통해서 실행합니다. 이렇게하면 물리공간이 생성됩니다.

중력설정

중력은 물리에서 매우 중요한 것이며, 대부분의 물리 게임은 중력을 사용합니다 중력을 적용하면 Physics Component 가 있는 노드는 모두 중력을 받게 됩니다. 중력값은 x, y 값으로 설정 할 수 있고 아래와 같이 작성합니다.

this.physicsManager.gravity = cc.v2(0, -200);

y값이 마이너스면 아래로 중력이 적용됩니다. 기본값은 cc.v2(0, -320) 이며 중력을 없애고 싶으면 cc.v2(0, 0)으로 설정하면 됩니다.

Timestep 설정

물리시스템은 timestep 값에 따라 물리 세계를 Update 합니다. 기본 time step 은 게임의 Frame Rate 이며 설정을 변경할 수 있습니다.

this.physicsManager.enabledAccumulator = true;

this.physicsManager.FIXED_TIME_STEP = 1/30;

this.physicsManager.VELOCITY_ITERATIONS = 10;

this.physicsManager.POSITION_ITERATIONS = 10;

enabledAccumulator: timestep 변경 활성화 유무입니다.

FIXED_TIME_STEP: 고정된 timestep을 설정합니다. 기본값은 1/60 입니다.

VELOCITY_ITERATIONS: 업데이트당 물리 속도 처리 반복횟수입니다. 기본값은 10입니다.

POSITION_ITERATIONS: 업데이트당 물리 이동 처리 반복횟수입니다. 기본값은 10입니다.

VELOCITY_ITERATIONS와 POSITION_ITERATIONS은 미니게임에서는 10이 적당하며, 값이 높아질수록 CPU를 많이 사용하게 되니깐 적당한 값을 정해야합니다.

DEBUG MODE 설정

디버그 모드는 물리세계 안에 물체들이 어떻게 이동하는지, 충돌범위는 어느정돈지를 화면에 그려줍니다. 개발을 시작할때는 디버그 모드를 항시켜서 테스트를 하는것을 추천합니다. 물론 게임을 배포할 때는 주석을 처리하거나 지우는것을 잊지 말아야 합니다.

var bits = cc.PhysicsManager.DrawBits;

// 디버그 모드 활성화

this.physicsManager.debugDrawFlags = bits.e_aabbBit | bits.e_pairBit |

bits.e_centerOfMassBit | bits.e_jointBit | bits.e_shapeBit;

디버그 모드는 debugDrawFlags 에 어떤 값을 넣는지에 따라서 다르게 됩니다. 종류는 아래와 같습니다.

e_shapeBit = 0x0001 // Shape 영역을 나타내는 그림

e_jointBit = 0x0002 // 조인트를 나타내는 그림

e_aabbBit = 0x0004 // 바운딩 박스를 그림

e_pairBit = 0x0008 // 연결된 오브젝트의 중심과 라인을 그림

e_centerOfMassBit = 0x0010 // 오브젝트 중심을 그림

확인하시고 테스트 할 디버그 종류를 추가하시거나 삭제하시면 됩니다. 

디버그 모드를 활성화 하고 실행을하면 아래와같이 선들이 보이게 됩니다.

이제 물리를 사용 할 수 있는 설정이 끝났습니다. 다음 파트에서는 Physics Manager 의 메서드에 대해서 알아보겠습니다.

cc.Class({

extends: cc.Component,

properties: {

},

onLoad: function () {

// physics manager 활성화

this.physicsManager = cc.director.getPhysicsManager();

this.physicsManager.enabled = true;

/**

* e_shapeBit = 0x0001 // Shape 영역을 나타내는 그림

* e_jointBit = 0x0002 // 조인트를 나타내는 그림

* e_aabbBit = 0x0004 // 바운딩 박스를 그림

* e_pairBit = 0x0008 // 연결된 오브젝트의 중심과 라인을 그림

* e_centerOfMassBit = 0x0010 // 오브젝트 중심을 그림

*/

var bits = cc.PhysicsManager.DrawBits;

// 디버그 모드 활성화

this.physicsManager.debugDrawFlags = bits.e_aabbBit | bits.e_pairBit |

bits.e_centerOfMassBit | bits.e_jointBit | bits.e_shapeBit;

// 디버그 모드를 사용하고싶지 않을 때

// this.physicsManager.debugDrawFlags = 0;

// 중력 설정

// x,y 값을 변경하여 중력을 변경할 수 있다. 기본값은 cc.v2(0, -320)

this.physicsManager.gravity = cc.v2(0, -200);

// timestep 설정

// 물리 시스템은 timestep 에 따라 물리 세계를 업데이트한다. 기본 timestep은 1 / framerate.

// timestep 설정 활성화

this.physicsManager.enabledAccumulator = true;

// 고정된 timestep 설정, 기본값은 1/60 이다.

this.physicsManager.FIXED_TIME_STEP = 1/30;

// 업데이트당 물리 속도 처리 반복횟수. 기본값은 10이다.

this.physicsManager.VELOCITY_ITERATIONS = 10;

// 업데이트당 물리 이동 처리 반복횟수. 기본값은 10이다.

this.physicsManager.POSITION_ITERATIONS = 10;

},

start: function () {

}

});