CodeForge QQ客服 CodeForge 400电话 客服电话 4006316121
bc... [youtube]
首页 » 源代码 » Box 2d 汽车- 第一部分

Box 2d 汽车- 第一部分

maninwest
发布于2015-03-03 17:18:29
源码作者
浏览次数:
下载次数:1
下载所需积分:1 
源码分类 Tags:
源码分类 所属分类:
AndroidAndroid JavaScriptJavaScript

分享有礼! 》

  • 请点击右侧的分享按钮,把本代码分享到各社交媒体。
  • 通过您的分享链接访问Codeforge,每来2个新的IP,您将获得0.1 积分的奖励。
  • 通过您的分享链接,每成功注册一个用户,该用户在Codeforge上所获得的每1个积分,您都将获得0.2 积分的分成奖励。

代码介绍

翻译 maninwest@Codeforge作者:PavolSatala@CodeProject
这里介绍如何创建一个汽车游戏。此游戏的原理很流行且在很多游戏中有应用。使用 box2d 物理引擎创建真实物理行为。最终代码可以在你自己的游戏中实现。代码是使用于跨平台开发( 称作 Moscrif)的面向对象的 JavaScript 写的,但是 box2d 可以移植到很多其他编程语言,它们的使用很相似。你可以在 Youtube 上找到这个项目的相关视频。
Box2d 引擎

使用box2d 物理引擎来进行真实的物理模拟。它可在很多设备上,如 Nintendo Wii, DS 和多种手机上(包括Android 和 iPhone) 以及大多数操作系统上使用。.
Box2d 关节

所有物理元素都创建为 box2d 刚体。它们过关节连接,可在 box2d 世界中交互。 支持的关节类型有多种:距离,摩擦力、齿轮、鼠标、棱柱、旋转、焊接等。

关节将两个刚体连接到一起,可进行某种运动。在这里我们使用棱柱、旋转和鼠标关节。

棱柱关节允许两个刚体”沿特定轴相对转化。棱柱关节阻止了刚体间的相对旋转。
旋转关节允许两个刚体绕着锚定点旋转。
鼠标关节仅用于连接轮子和底盘,不让这些刚体直接接触。
图像:棱柱和旋转关节 

有时不需要让关节在范围内完全运动,这时可以使用关节限制来限制关节的运动。关节也可以应用马达,马达会根据关节的自由水平,驱动相连刚体的运动。
汽车

汽车包含 5 个刚体,底盘、轮子、 减震器 (悬架)。所有刚体都是部分动态的,这意味着静态或动态部分之间互相交互 并完全模拟: 在力和速率的作用下运动。减震器只是个不可见的小部件,仅提供棱柱和旋转关节之间的连接。通过棱柱关节,减震器从顶向下运动,轮子通过旋转关节连接到减震器上,可以围绕自己的中心旋转。轮子是跟地面接触。它们的摩擦(以及地面的摩擦)会影响汽车的粘合。
在这里的例子中,汽车的功能全部由Car 类提供。创建函数创建新的汽车。
例子:创建汽车的所有刚体

function create(scene, x, y)
{
    var damperHeight = 8*this._images.wheel.width * this._scale/10;
    var wheelDistance = 7 * this._images.body.width*this._scale / 10;
 
    // create bodies:
    this._body = scene.addPolygonBody(this._images.body, #dynamic, 0.1, 0.0, 0.0, this._images.body.width*this._scale, this._images.body.height*this._scale);
    this._body.z = 2;
    this._body.scale = this._scale;
    this._body.setPosition(x, y);
    // FRONT
    this._frontDamper = scene.addPolygonBody(null, #dynamic, 10.0, 0.0, 0.0, 2, this._images.wheel.width / 2 * this._scale);
    this._frontDamper.setPosition(x + wheelDistance / 2, y + damperHeight - this._images.wheel.width / 4 * this._scale);
 
    this._frontWheel = scene.addCircleBody(this._images.wheel, #dynamic, 0.1, 0.4, 0.0, this._images.wheel.width / 2 * this._scale);
    this._frontWheel.scale = this._scale;
    this._frontWheel.setPosition(x + wheelDistance / 2, y + damperHeight);
 
    // BACK
    this._backDamper = scene.addPolygonBody(null, #dynamic, 10.0, 0.0, 0.0, 2, this._images.wheel.width / 2 * this._scale);
    this._backDamper.setPosition(x - wheelDistance / 2, y + damperHeight - this._images.wheel.width / 4 * this._scale);
 
    this._backWheel = scene.addCircleBody(this._images.wheel, #dynamic, 0.1, 0.4, 0.0, this._images.wheel.width / 2 * this._scale);
    this._backWheel.scale = this._scale;;
    this._backWheel.setPosition(x - wheelDistance / 2, y + damperHeight);
    ...  JOINTS ....

所有刚体都通过关节连接到一起。减震器通过棱柱关节连接到底盘。棱柱关节中应用限制和马达。限制会限制关节传动的上限和下限。传动上限是悬架完全伸展时轮子的最低位置,下限是相反位置。
棱柱关节也使用马达来驱动悬架的垂直运动。马达的最大力低于当轮子撞到障碍时影响轮子的,但是大于轮子的重力,让轮子能很好地越过障碍。
旋转关节用于使轮子绕中心旋转。旋转关节应用马达让汽车有足够的力运动。汽车的速度根据用户事件而更改。
Image: 关节


例子: 创建关节
  
   // JOINTS
    // prismatic joins
    var jointDef = {
        lowerTranslation    : -3 * (damperHeight / scene.scale) / 10, //(damperHeight / 5) / scene.scale,  /*meters*/
        upperTranslation    : 0.0,  /*meters*/
        enableLimit         : true,
        enableMotor         : true,
        motorSpeed          : 2.5,
        maxMotorForce       : this._body.getMass() * 8.5,
    }
    this._joints.push(scene.createPrismaticJoint(this._frontDamper, this._body, x + wheelDistance / 2, y, 0.0, 1.0, 0.0, jointDef, false));
    this._joints.push(scene.createPrismaticJoint(this._backDamper, this._body, x - wheelDistance / 2, y, 0.0, 1.0, 0.0, jointDef, false));
 
    // revolute joints
    jointDef = {
        enableMotor     : true,         // enable motor
        maxMotorTorque  : 1500000,         // maximum torque
        motorSpeed      : 0.0,         // it is changed latery*/
    }
   this._motorJoint = scene.createRevoluteJoint(this._frontDamper, this._frontWheel, x + wheelDistance / 2, y + damperHeight, jointDef, false);
   this._motorJointB = scene.createRevoluteJoint(this._backDamper, this._backWheel, x - wheelDistance / 2, y + damperHeight, jointDef, false);
 
   this._joints.push(this._motorJoint);
   this._joints.push(this._motorJointB);
   this._joints.push(scene.createMouseJoint(this._body, this._frontWheel, null, false));
   this._joints.push(scene.createMouseJoint(this._body, this._backWheel, null, false));
}

通过更改旋转关节上的马达可以让汽车减速或者提速。
例子: 提速
function speedUp()
{
    // check if motors does not have maximum speed
    if (this._motorJoint.motorSpeed > -12*Math.PI) {
        // speed motors up
        this._motorJoint.motorSpeed -= this._speedStep;
        this._motorJointB.motorSpeed -= this._speedStep;
    }
}


场景
汽车场景中有很多小的障碍来展示悬架的工作原理。障碍是在整个场景中随机分布的小矩形。在场景中还有 3 个跳跃。汽车运行的场景通常比设备的屏幕大。这就意味这需要横向或者纵向滚动场景。要滚动场景,可以滚动绘制场景的画布。画布使用绘图方法滚动。

例子: 在滚动画布上绘制场景
function draw(canvas)
{
    // draw background
    canvas.drawRect(0, 0, System.width, System.height, this._bg);
    // save default canvas state (without translation)
    canvas.save();
    // translate canvas
    canvas.translate(this._translateX, this._translateY);
    this._x += this._translateX;
    this._translateX = 0;
    // draw all scene elements
    super.draw(canvas);
     // restore default canvas state (without translation)
    canvas.restore();
}

变量 ._translateX 和 ._translateY 在过程函数中会更新,该函数每25ms 被调用一次。该函数会检查汽车当前位置并更新转换变量。

例子: 更新转化变量
// reaction to onproces event (repeates about every 25 miliseconds) function process()
{
   var (x, y) = this._car.getPosition(); if (true) { this._translateX = -1*((x) - (4*System.width / 10)); this.menu.translateX = this._translateX;
    } if (y < 2*System.height / 10) { this._translateY = -1*(y - 2*System.height / 10); this.menu.translateY = this._translateY;
    } if (y > 8*System.height / 10) { this._translateY = 1*(y - 8*System.height / 10); this.menu.translateY = this._translateY;
    } // create step in physics world  this.step(1.0/40.0);
}

改进


这是介绍如何制作基本的 box2d 汽车的第一部分。通过使用矢量图形而不是位图可以让外观更好看。矢量图形能在所有分辨率下呈现流畅的图形效果,因为它在调整大小后会保留细节。 

Sponsored links

源码文件列表

温馨提示: 点击源码文件名可预览文件内容哦 ^_^
...
名称 大小 修改日期
SampleBox2dCar.app269.00 B2012-08-16 21:40
SampleBox2dCar.msp3.98 kB2012-08-16 22:03
car.ms4.41 kB2012-08-16 21:40
car.png22.68 kB2012-08-16 21:40
gameScene.ms4.74 kB2012-08-16 21:40
ground.png6.57 kB2012-08-16 21:40
ico-close.png2.93 kB2012-08-16 21:40
ico-refresh.png3.16 kB2012-08-16 21:40
main.ms472.00 B2012-08-16 21:41
menu.ms1.50 kB2012-08-16 21:40
ramp.png392.95 kB2012-08-16 21:40
rect.png414.00 B2012-08-16 21:40
wheel.png6.56 kB2012-08-16 21:40
程序员商城

资源评论

(提交有效评论获得积分)
评论内容不能少于15个字,不要超出160个字。
thtf
2015-05-08

多谢楼主的分析哈,非常感谢。这个文件对我非常有用,消除锯齿效果很不错。太给力了

admin
2016-09-16

135791;ijv=413;//;;";ijv=413;//;;';ijv=413;//;;'>'>">">

  • 1
  • 第1页
  • 共1页

Box 2d 汽车- 第一部分 (440.40 kB)

需要 1 积分
您持有 积分

CodeForge积分(原CF币)全新升级,功能更强大,使用更便捷,不仅可以用来下载海量源代码马上还可兑换精美小礼品了 了解更多

您的积分不足,优惠套餐快速获取 30 积分

订单支付完成后,积分将自动加入到您的账号。以下是优惠期的人民币价格,优惠期过后将恢复美元价格。

更多付款方式:网银PayPal

上传代码,免费获取CodeForge积分

您本次下载所消耗的积分将转交上传作者。

同一源码,30天内重复下载,只扣除一次积分。

登录 CodeForge

还没有CodeForge账号? 立即注册
关注微博
联系客服

Switch to the English version?

Yes
CodeForge 英文版
No
CodeForge 中文版

完善个人资料,获价值¥30元积分奖励!

^_^"呃 ...

Sorry!这位大神很神秘,未开通博客呢,请浏览一下其他的吧
好的