Cocos-js 之 使用Chipmunk实现碰撞 和 碰撞的监听
2015-07-18 00:00
661 查看
这两天在用cocos-js 开发一个一堆小球碰来碰去的游戏,就打算选择一款物理引擎来简化代码。第一开始打算用box2d(网上一片好评),但是看看之后发现box2d适用于js-HTML版本,对js打包版本(jsb)是不适用的(我没有深入探究,不知道是不是)。于是打算使用Chipmunk来开发。但由于Chipmunk没有js文档,只有C++版本的(官网地址:http://chipmunk-physics.net/),百度也找不到合适的教程,在做碰撞监听这块儿时,废了很大功夫,在一定程度上是根据C++文档来猜js中对应的函数的。。。所以做完之后,写出这篇博客来方便有同样需求的哥们儿。(但不知效果如何)
博客中如有错误的地方,请大家指出,谢谢!
Cocos IDE工程代码免费下载地址:http://download.csdn.net/detail/u013647453/8910481
(目前功能有随机产生小球,点击屏幕产生小球,小球碰撞的监听和处理)
(注释掉的代码大家可以忽略)
1.先对Chipmunk的核心进行简单介绍。(摘自Cocos官方文档:http://cn.cocos2d-x.org/tutorial/show?id=2706)
Chipmunk物理引擎有一些自己的核心概念,这些核心概念主要有:
空间(space):物理空间,所有物体都在这个空间中发生。
物体(body):物理空间中的物体。
形状(shape):物体的形状。
关节(joint):用于连接两个物体的约束。
使用Chipmunk物理引擎进行开发的一般步骤,如下图所示。
2.游戏Demo的概述
只有一个scene:PlayingScene和一个layer:PlayingLayer。大家只需要关注PlayingLayer中代码即可。
PlayingLayer代码结构概述:(重点关注红色标注的函数代码)
ctor():
initPhysicsWorld:创建物理空间(space),设置重力,设置空间边缘及其弹性、摩擦和碰撞检测要用到的参数:shape.setCollisionType(constant),这个参数相当于物体的一个标志。对于所有参与碰撞的物体,要监听其碰撞的话都应该设置这个标志,在添加碰撞监听、处理监听到的事件时都要用到。
scheduleUpdate:调用update函数,用来告诉Chipmunk引擎更新界面。
schedule:每两秒调用addBall()来随机添加一个小球。
onEnter():
this.space.addCollisionHandler(
COLLISION_TYPEA, COLLISION_TYPEB //要监听的两种碰撞物体的标志
collisionBegin, collisionPre, collisionPost, collisionSeparate //碰撞过程的回调函数):
space添加碰撞监听,需要针对每个碰撞的情况来添加监听。小球游戏中参与碰撞的物体有:上、左、右边界;
下边界
;
小球
(因为小球碰到下边界将来要特殊处理,所以在这里把边界分为两部分)。碰撞的情况有:小球和小球;小球和上、左、右边界;小球和下边界。那么这里需要添加三类监听。
cc.EventListener.create():手势监听,用来监听触摸手势,在触摸位置添加小球。
update():用来告诉Chipmunk引擎更新界面。
addBall():在空间(space)中添加物体。添加body:设置形状、位置、速度;添加shape:设置形状、弹性、摩擦和碰撞检测要用到的参数;添加sprite。
碰撞后的回调函数:(摘自http://my.oschina.net/lonewolf/blog/173593)
collisionBegin():碰撞开始时调用,碰撞处理代码可以放在这里
collisionPre():持续碰撞(相交),可以设置相交时独自的摩擦,弹力等
collisionPost():调用完collisionPre后,做后期处理,比如计算破坏等
collisionSeparate():物体分开,当删除一个shape时也会调用
3.从下图的角度来看Chipmunk
重点函数及其完成的功能:
initialPhysicsWorld:创建物理空间(space),指定空间边界。
addBall:创建空间中的物体,创建空间中的形状,链接精灵与物体。
addCollisionHandler:检测(监听)碰撞。
collisionBegin:处理碰撞。
简化的过程是这样的:
创建一个space,给space添加物体。然后只需要通知Chipmunk更新界面就行了(update函数)。
附加解释:
边界是不动的物体,小球是动的物体。
Chipmunk更新界面时是根据space设置的属性:gravity等;边界的属性:弹性、摩擦、碰撞物体的标志;小球的属性:初速度、位置、弹性、摩擦、碰撞物体的标志 这些属性,然后通过时间的推移,并处理过碰撞之后,来计算并更新小球未来的位置的。
给space添加的碰撞监听其实就是告诉Chipmunk在物体碰撞的过程中(碰到、相交、分离),如果碰撞的两个物体的COLLISION_TYPE(碰撞物体的标志)跟传递的两个参数一致的话,就调用所传递的collisionBegin,collisionPre,collisionPost,collisionSeparate函数。
4.代码解读
详细代码就请大家下载代码来看吧,加了英文注释(欢迎吐槽),一方面是中文编码问题,另一方面是我自己的习惯问题,不习惯的哥们儿还请见谅,不过都是常见英文,比较容易理解。
Cocos IDE工程代码免费下载地址:http://download.csdn.net/detail/u013647453/8910481
(注释掉的代码大家可以忽略)
为什么不把代码贴上来呢?
因为我在读别人博客的时候,感觉把代码分散开来,然后在代码前加一句说明并没有实际意义,相对直接读有注释的源代码来说,后者可以有一个整体的感觉,而非零散的代码片段,另外加上注释后,并不会影响对代码的理解。
主要参考的博客:
http://my.oschina.net/lonewolf/blog/173593 http://www.cnblogs.com/linn/p/3656041.html http://cn.cocos2d-x.org/tutorial/show?id=2706
Chipmunk官网(有C++ API文档和一些教程):
http://chipmunk-physics.net/
如有谬误,欢迎指出,谢谢!
最后,附上Android真机的运行截图(其实没什么用):
版权声明:本文为博主原创文章,未经博主允许不得转载。
博客中如有错误的地方,请大家指出,谢谢!
Cocos IDE工程代码免费下载地址:http://download.csdn.net/detail/u013647453/8910481
(目前功能有随机产生小球,点击屏幕产生小球,小球碰撞的监听和处理)
(注释掉的代码大家可以忽略)
1.先对Chipmunk的核心进行简单介绍。(摘自Cocos官方文档:http://cn.cocos2d-x.org/tutorial/show?id=2706)
Chipmunk物理引擎有一些自己的核心概念,这些核心概念主要有:
空间(space):物理空间,所有物体都在这个空间中发生。
物体(body):物理空间中的物体。
形状(shape):物体的形状。
关节(joint):用于连接两个物体的约束。
使用Chipmunk物理引擎进行开发的一般步骤,如下图所示。
2.游戏Demo的概述
只有一个scene:PlayingScene和一个layer:PlayingLayer。大家只需要关注PlayingLayer中代码即可。
PlayingLayer代码结构概述:(重点关注红色标注的函数代码)
ctor():
initPhysicsWorld:创建物理空间(space),设置重力,设置空间边缘及其弹性、摩擦和碰撞检测要用到的参数:shape.setCollisionType(constant),这个参数相当于物体的一个标志。对于所有参与碰撞的物体,要监听其碰撞的话都应该设置这个标志,在添加碰撞监听、处理监听到的事件时都要用到。
scheduleUpdate:调用update函数,用来告诉Chipmunk引擎更新界面。
schedule:每两秒调用addBall()来随机添加一个小球。
onEnter():
this.space.addCollisionHandler(
COLLISION_TYPEA, COLLISION_TYPEB //要监听的两种碰撞物体的标志
collisionBegin, collisionPre, collisionPost, collisionSeparate //碰撞过程的回调函数):
space添加碰撞监听,需要针对每个碰撞的情况来添加监听。小球游戏中参与碰撞的物体有:上、左、右边界;
下边界
;
小球
(因为小球碰到下边界将来要特殊处理,所以在这里把边界分为两部分)。碰撞的情况有:小球和小球;小球和上、左、右边界;小球和下边界。那么这里需要添加三类监听。
cc.EventListener.create():手势监听,用来监听触摸手势,在触摸位置添加小球。
update():用来告诉Chipmunk引擎更新界面。
addBall():在空间(space)中添加物体。添加body:设置形状、位置、速度;添加shape:设置形状、弹性、摩擦和碰撞检测要用到的参数;添加sprite。
碰撞后的回调函数:(摘自http://my.oschina.net/lonewolf/blog/173593)
collisionBegin():碰撞开始时调用,碰撞处理代码可以放在这里
collisionPre():持续碰撞(相交),可以设置相交时独自的摩擦,弹力等
collisionPost():调用完collisionPre后,做后期处理,比如计算破坏等
collisionSeparate():物体分开,当删除一个shape时也会调用
3.从下图的角度来看Chipmunk
重点函数及其完成的功能:
initialPhysicsWorld:创建物理空间(space),指定空间边界。
addBall:创建空间中的物体,创建空间中的形状,链接精灵与物体。
addCollisionHandler:检测(监听)碰撞。
collisionBegin:处理碰撞。
简化的过程是这样的:
创建一个space,给space添加物体。然后只需要通知Chipmunk更新界面就行了(update函数)。
附加解释:
边界是不动的物体,小球是动的物体。
Chipmunk更新界面时是根据space设置的属性:gravity等;边界的属性:弹性、摩擦、碰撞物体的标志;小球的属性:初速度、位置、弹性、摩擦、碰撞物体的标志 这些属性,然后通过时间的推移,并处理过碰撞之后,来计算并更新小球未来的位置的。
给space添加的碰撞监听其实就是告诉Chipmunk在物体碰撞的过程中(碰到、相交、分离),如果碰撞的两个物体的COLLISION_TYPE(碰撞物体的标志)跟传递的两个参数一致的话,就调用所传递的collisionBegin,collisionPre,collisionPost,collisionSeparate函数。
4.代码解读
详细代码就请大家下载代码来看吧,加了英文注释(欢迎吐槽),一方面是中文编码问题,另一方面是我自己的习惯问题,不习惯的哥们儿还请见谅,不过都是常见英文,比较容易理解。
Cocos IDE工程代码免费下载地址:http://download.csdn.net/detail/u013647453/8910481
(注释掉的代码大家可以忽略)
为什么不把代码贴上来呢?
因为我在读别人博客的时候,感觉把代码分散开来,然后在代码前加一句说明并没有实际意义,相对直接读有注释的源代码来说,后者可以有一个整体的感觉,而非零散的代码片段,另外加上注释后,并不会影响对代码的理解。
主要参考的博客:
http://my.oschina.net/lonewolf/blog/173593 http://www.cnblogs.com/linn/p/3656041.html http://cn.cocos2d-x.org/tutorial/show?id=2706
Chipmunk官网(有C++ API文档和一些教程):
http://chipmunk-physics.net/
如有谬误,欢迎指出,谢谢!
最后,附上Android真机的运行截图(其实没什么用):
版权声明:本文为博主原创文章,未经博主允许不得转载。
相关文章推荐
- 我是运营,我没有假期
- 每个 Linux 游戏玩家都绝不想要的恼人体验
- Steam 让我们在 Linux 上玩 Windows 的游戏更加容易
- 如何使用 Steam Play 在 Linux 上玩仅限 Windows 的游戏
- 新一代iPad适配应用之游戏篇
- VB实现的《QQ美女找茬游戏》作弊器实例
- C#实现洗牌游戏实例
- C#实现的算24点游戏算法实例分析
- C#实现简单的井字游戏实例
- C++编写简单的打靶游戏
- C++实现基于控制台界面的吃豆子游戏
- JavaScript实现俄罗斯方块游戏过程分析及源码分享
- JS小游戏之仙剑翻牌源码详解
- JS小游戏之宇宙战机源码详解
- JavaScript游戏之优化篇
- js实现俄罗斯方块小游戏分享
- 用javascript做一个webgame连连看大家看下
- jquery实现的美女拼图游戏实例
- python简单猜数游戏实例
- 基于C语言实现的扫雷游戏代码