分别用box2d和chipmunk实现了一下,不过box2d没整理,也懒得整理了。
chipmunk整理了一下,分享给大家吧。
刚开始研究,抛砖引玉
简要说明:
1、初始化物理环境,增加边界
initPhysics: function () { var space = this.space ; var staticBody = space.staticBody; //开启物体形状测试 //this.initDebugMode(); // Gravity space.gravity = cp.v(0, -980); //重力 space.sleepTimeThreshold = 0.5; //休眠临界时间 space.collisionSlop = 0.5; // // Walls--四个边界 var walls = [ new cp.SegmentShape( staticBody, cp.v(0,0-1), cp.v(winSize.width,0), 0-1 ), // bottom new cp.SegmentShape( staticBody, cp.v(0,winSize.height), cp.v(winSize.width,winSize.height), 0), // top new cp.SegmentShape( staticBody, cp.v(0,0), cp.v(0,winSize.height), 0), // left new cp.SegmentShape( staticBody, cp.v(winSize.width,0), cp.v(winSize.width,winSize.height), 0) // right ]; for( var i=0; i < walls.length; i++ ) { var shape = walls<i>; shape.setElasticity(1); //弹性 shape.setFriction(0); //摩擦 //space.addStaticShape( shape ); space.addShape( shape ); if(i >= 2){ shape.setCollisionType(3); } shape.setLayers(1); } },</i>
2、物体形状测试
initDebugMode: function () { this._debugNode = cc.PhysicsDebugNode.create(this.space); this.addChild(this._debugNode); },
3、物体定义
initBoxWithBody: function () { //物体的定义 var mass = 1; var boxWidth = 32; var body = new cp.Body(mass, cp.momentForBox(mass, boxWidth, boxWidth) ); body.setPos( cc.p(winSize.width/2, winSize.height/2) ); this.space.addBody( body ); var shape = new cp.BoxShape( body, boxWidth, boxWidth); shape.setElasticity( 0.5 ); shape.setFriction( 0.3 ); shape.setCollisionType(1); shape.setLayers(3); this.space.addShape( shape ); //创建一个箱子 var v_texture = cc.textureCache.addImage(res.box_png); this.box = cc.PhysicsSprite.create(v_texture,cc.rect(0,0,boxWidth,boxWidth)); this.box.setBody(body); this.addChild(this.box,1); this.box.setTag(101); //上下移动 var moveTo1 = cc.MoveTo.create(0.5, winSize.width / 2, this.box.y + 40); var moveTo2 = cc.MoveTo.create(0.5, winSize.width / 2, this.box.y - 40); this.downUpAction = cc.RepeatForever.create(cc.Sequence.create(moveTo1,moveTo2)); this.box.runAction(this.downUpAction); },
4、增加点击事件、碰撞检测监听
onEnter: function () { this._super(); cc.sys.dumpRoot(); cc.sys.garbageCollect(); //事件处理 if( 'touches' in cc.sys.capabilities ){ cc.eventManager.addListener({ event: cc.EventListener.TOUCH_ALL_AT_ONCE, onTouchesEnded: function(touches, event){ event.getCurrentTarget().processEvent( touches[0] ); } }, this); } else if( 'mouse' in cc.sys.capabilities ){ cc.eventManager.addListener({ event: cc.EventListener.MOUSE, onMouseDown: function(event){ event.getCurrentTarget().processEvent( event ); } }, this); } //重置数据 this.resetDatas(); // this.scheduleUpdate(); //添加碰撞监听事件 // 1 & 2 检测box和上下BLOCK碰撞 this.space.addCollisionHandler( 1, 2, this.collisionBegin.bind(this), this.collisionPre.bind(this), this.collisionPost.bind(this), this.collisionSeparate.bind(this) ); // 1 & 3 检测box和左右边界碰撞 this.space.addCollisionHandler( 1, 3, this.collisionBegin.bind(this), this.collisionPre.bind(this), this.collisionPost.bind(this), this.collisionSeparate.bind(this) ); // 1 & 4 检测box和左右BLOCK碰撞 this.space.addCollisionHandler( 1, 4, this.collisionBegin.bind(this), this.collisionPre.bind(this), this.collisionPost.bind(this), this.collisionSeparate.bind(this) ); },
5、碰撞检测
collisionBegin : function ( arbiter, space ) { var shapes = arbiter.getShapes(); var shapeA = shapes[0]; var shapeB = shapes[1]; var collTypeA = shapeA.collision_type; var collTypeB = shapeB.collision_type; if(collTypeB == 3){ console.log( 'Collision Type A:' + collTypeA ); console.log( 'end Collision Type B:' + collTypeB ); this.boxDirectionX = -this.boxDirectionX; this.space.addPostStepCallback(function () { this.updateBoxAndBlocks(); }.bind(this)); }else if(collTypeB == 2 || collTypeB == 4) {//碰到上下墙壁 或者 左右出来的BLOCKS 就Gameover this.gameOver(); } return true; }, collisionPre : function ( arbiter, space ) { //console.log('collision pre'); return true; }, collisionPost : function ( arbiter, space ) { //console.log('collision post'); }, collisionSeparate : function ( arbiter, space ) { //console.log('collision separate'); }