Box2D镜头跟随效果

作者: ladeng6666 分类: Box2D 发布时间: 2012-09-22 11:55 阅读: 25,297

在疯狂的小鸟中,由于背景很大,玩家可视区域有限,所以当小鸟弹出后,镜头会随小鸟一起移动,让玩家可以看到完整的场景。这种效果叫做”镜头跟随”或者”卷屏”。今天我们就来学习在Box2D中实现镜头跟随效果。

这个效果实现起来并不难。当游戏角色超出内边界时,反向移动游戏背景即可。什么是”内边界”?这是我在”内边界卷屏” 教程里用到的一个名词。具体实现的原理和过程,已经在”内边界卷屏”里讲的很详细了,这里我们重点学习一下Box2D中实现这个效果的重点。

在这之前,还是请先自己看过”内边界卷屏”。

首先,我们定义好内边界。如下图,图中较亮的部分表示舞台,暗部表示已经移出舞台不可见的部分。

刚体坐标问题

首先是刚体坐标的问题,在”内部边界卷屏”中,当游戏角色超出内部边界时,我们可以停止更新它的坐标,反相移动背景坐标。但是在Box2D中,刚体的坐标是有引擎自动计算的,我们应进行不要修改。所以要把刚体的坐标转换成相对于舞台(0,0)的本地坐标localx和localy,如下图所示:

背景移动问题

因为刚体的运动是由Box2D自动计算模拟的,我们无法停止,所以背景也就不能用反相移动来模拟镜头跟随了。不过,我们知道运动是相对的嘛,如果将背景的坐标更新成与刚体相反的坐标,那么刚体就像不动,而背景在动。
如下图所示,用innerStage.top – body.y模拟模拟背景运动。这里的this是指整个舞台,因为我们要更新的背景包括背景图片和debugSprite。

记得当背景移动到边缘时,停止更新背景坐标,恢复刚体运动,如下图所示:

具体的实现过程,我们在代码中已经注释的很详细了。
下面是实际的效果,用鼠标拖动或抛出刚体,看看效果如何

完整的代码和注释如下:

 源文件下载地址

 

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

2条评论
  • s-man

    2012 年 9 月 25 日 下午 1:41

    酷,拉登兄打算从这章开始一步步来实现小鸟吗?

  • 贤明君

    2012 年 9 月 25 日 下午 7:52

    您的博客内容很丰富,定会常来学习!已加您的友链!

发表评论

电子邮件地址不会被公开。 必填项已用*标注