box2dweb基礎

大名鼎鼎的物理引擎box2d基本上你們都據說過，網上有兩個javascript版本的box2d庫，一個時box2djs，已經中止維護，一個是box2dweb。下面就來介紹一下box2dweb的基本信息。

一 包，類介紹

BOX2D.Collision>>>碰撞，衝擊包；
b2AABB AABB座標
b2OBB OBB座標
b2ContactID 接觸ID
b2ContactPoint 接觸點
b2ManifoldPoint 繁殖點

BOX2D.Collision.Shapes>>>碰撞形狀形變包；
b2CircleShape 圓外形.
b2EdgeChainDef邊緣圖形.
b2MassData 質量運算器.
b2PolygonShape 凸多邊形.
b2Shape 圖形基類.

BOX2D.Common >>>通用包；
b2Color 調試繪圖顏色.
b2Settings 全局設置

BOX2D.Common.Math>>>通用數學包；
b2Mat22 2*2 矩陣
b2Mat33 3*3 矩陣
b2Sweep 碰撞描述.
b2Vec2 向量(x ,y).
b2Vec3 向量(x, y z).
b2XForm 座標轉換,平移或旋轉
BOX2D.Dynamics>>>動態包；
b2Body 剛體或叫物體.
b2BodyDef 剛體定義.
b2ContactFilter 繼承這個類用來獲取過濾碰撞
b2ContactListener 繼承這個類用來獲取碰撞結果,根據這個判斷遊戲邏輯或聲音處理. 你也能夠獲取碰撞在時間步後,時間步會有一個碰撞列表.然而你也有可能漏掉一些碰撞,由於在一個時間步內有多個子步.你應該儘可能提升碰撞回調方法的效率,由於在每一個時間步內有諸多回調.
b2FilterData 碰撞過濾數據
b2DebugDraw 調試繪圖,用於調試.
b2DestructionListener 關節或外形銷燬時處理方法
b2FixtureDef 材質定義類
b2Fixture材質類
b2World 物理世界


Box2D.Dynamics.Contacts>>>碰撞管理包
b2Contact 管理兩個外形接觸.
b2ContactEdge 接觸邊用來鏈接多個物體和接觸到一個接觸表(物體是一個節點而接觸至關於一個接觸邊)
b2ContactResult 記錄接觸結果

BOX2D.Dynamics.Joints>>>動態關節包；
b2DistanceJoint 距離鏈接
b2DistanceJointDef 距離鏈接定義.
b2GearJoint 齒輪鏈接.
b2GearJointDef 齒輪鏈接定義.
b2Joint 鏈接基類.
b2JointDef 鏈接定義基類.
b2JointEdge 用於組合剛體或鏈接到一塊兒.剛體至關於節點,而鏈接至關於邊
b2MouseJoint 鼠標鏈接.
b2MouseJointDef 鼠標鏈接定義.
b2PrismaticJoint 移動鏈接.
b2PrismaticJointDef 移動鏈接定義.
b2PulleyJoint 滑輪鏈接.
b2PulleyJointDef 滑輪鏈接定義.
b2RevoluteJoint 旋轉鏈接.
b2RevoluteJointDef 旋轉鏈接定義.

二 建立世界

 var world = new b2World( gravity, doSleep);

上面這段代碼就建立了一個box2d的世界（Box2D.Dynamics.b2World），全部的box2d中的物體都依託於這個世界存在。下面詳細介紹:

gravity 定義了世界的重力 也是一個2d向量（Box2D.Common.Math.b2Vec2(x,y)),其中x是水平方向重力，正爲右，負爲左；y是垂直方向重力，正爲下，負爲上。

var gravity=new b2Vec2(0,300）;

 

doSleep 一個布爾值變量，設定了當物體中止移動時是否容許物體休眠。一個休眠中的物體不須要任何模擬。

經常使用的方法:
CreateBody(b2BodyDef);//*全部世界中的物體都必須由本方法建立
DestoryBody(b2Body);
ClearForces();
GetBodyList();
GetBodyCount();
GetJointCount();
GetJointList();
IsLocked();
SetDebugDraw(b2DebugDraw);
Step(dt, velocityIterations, positionIterations);
上面咱們就建立了一個box2d的世界。下面讓咱們來看如何向這個世界中添加物體。

三 建立物體、剛體

1 首先要建立一個物體定義

var bodydef=new b2BodyDef();
// 物體類型定義，基本上經常使用的有兩種定義：b2_staticBody 靜態物體; .b2_dynimacBod動態物體
bodydef.type= b2Body.b2_staticBody;
//定義物體位置。也能夠這樣 bodydef.position.x=10; bodydef.position.y=10;
bodydef.position.Set(x,y);
//定義用戶本身的數據
bodydef.userData=*;

2 其次要定義一個材質定義

var fixDef = new b2FixtureDef();
fixDef.density = 1.0; // desity 密度，若是密度爲0或者null，該物體則爲一個靜止對象
fixDef.friction = 0.5; //摩擦力（0~1）
fixDef.restitution = 0.2;// 彈性（0~1）

3 爲材質定義添加一個形狀
b2PolygonShape多邊形；b2CircleSharp圓形設置該材質形狀的大小；b2PolygonShape對應着SetAsBox(halfWidth,halfHeight)方法設置半長半寬，值//得注意的是Box2d中的單位//是米，一米是30像素，若是自定義多邊形可使用一個SetAsArray(vertexArray,vertexCount)，其中vertexArray爲頂點矢量（b2Vec2）數組，vertexCount爲頂點數，最多8個。b2CircleSharp對應的設置屬性爲SetRadius(radius);

fixDef.sharp=new b2PolygonShape();
fixDef.sharp.SetAsBox(100/30,20/30);
fixDef.sharp=new b2CircleShape(60/30);
fixDef.sharp=new b2CircleShape();
fixDef.sharp.SetRadius(100/30);
fixDef.shape.SetAsArray([new b2Vec2(0,0),
new b2Vec2(2,0),
new b2Vec2(3,1.5),
new b2Vec2(2,3),
new b2Vec2(0,3),
new b2Vec2(-1,1.5)],6);

 

4 根據物體定義，材質定義建立物體

var body=world.CreateBody(bodydef);
body.CreateFixture(fixDef);

其餘一些屬性
body.ApplyForce(force, point); //添加一個外力，force一個b2Vec2的向量表明外力，point一個b2Vec2的向量表明物體的着力點。

body.SetMassFromShapes();//根據形狀計算質量

四 調試

實現一個基於html5的canvas對象的2d上下文的調試實例，並利用SetDebugDraw方法將其賦予一個世界。

var debugDraw = new b2DebugDraw();
debugDraw.SetSprite(document.getElementById("canvas").getContext("2d"));
debugDraw.SetDrawScale(30.0);
debugDraw.SetFillAlpha(0.3);
debugDraw.SetLineThickness(1.0);
debugDraw.SetFlags(b2DebugDraw.e_shapeBit | b2DebugDraw.e_jointBit);
world.SetDebugDraw(debugDraw);

五 世界更新

一切都準備好了，咱們要讓全部對象模擬運動。其實他也是經過偵聽幀頻率而不斷刷新實現的，把上面那兩個參數傳入世界對象的Step方法中便可，
同時咱們須要遍歷世界中的一切對象，並對每一個對象的座標和角度進行更新。

function update() {
world.Step(
1/60//幀率
,10//速率
, 10//position iterations
);
world.DrawDebugData();//繪製調試數據
world.ClearForces();//繪製完畢後清除外力
};

//循環更新和繪製世界
setInteval(update,1000 / 60);