Search code examples
cocos2d-xcocos2d-x-3.0chipmunkcocos2d-jscocos2d-html5

How to create chipmunk debug layer with Cocos2d-JS v3?


How to create chipmunk debug layer with Cocos2d-JS v3? I could not find an example of how to do it.


Solution

  • Assuming you have added "chipmunk" to "modules"in your projects project.json, simply place the following within the ctor or init method of the Layer that has the Chipmunk space defined in it:

    //Add the Chipmunk Physics space
    var space = new cp.Space();
    space.gravity = cp.v(0, -10);
    
    //Add the Debug Layer:
    var debugNode = new cc.PhysicsDebugNode(space);
    debugNode.visible = true;
    this.addChild(debugNode);
    

    You could also add the following to set up a "floor" and a sprite to bounce on it:

    //add a floor:
    var floor = new cp.SegmentShape(this.space.staticBody, cp.v(-1000, 10), cp.v(1000, 0), 10);
    floor.setElasticity(1);
    floor.setFriction(0);
    space.addStaticShape(floor);
    
    //add a square to bounce
    var myBody = new cp.Body(Infinity, cp.momentForBox(Infinity, 10, 50));
    myBody.p = cc.p(derecha - 10, arriba / 2);
    space.addBody(myBody);
    
    var myShape = new cp.BoxShape(myBody, 10, 50);
    myShape.setElasticity(1);
    myShape.setFriction(0);
    space.addShape(myShape);