，相信很多人都已经很熟悉了，通过它的可视化编辑界面，点一点，拉一拉就可以轻松创建任意的多边形刚体模型，并将这个模型数据导出成我们所需的格式，例如AS3类。PhysicsEditor支持Box2D、Cocos2d、Nape等多种2D物理引擎。闲话少说，我们马上开始学习PhysicsEditor。
PS：如果你喜欢学习英文资料，可以参考。
在学习PhysicsEditor之前，先讲一下它是uhe跟Flash一起工作的。学习新事物就要和我们熟悉的东西联系到一起，这样才能理解的更快，不是吗？！大约有下面几个步骤：
在PhysicsEditor中创建好刚体模型后(怎么创建，稍后再讲)，导出成一个PhysicsData.as类。这个类中有一个createBody方法，用来创建刚体，以及保存了刚体的顶点数据。
把在PhysicsEditor中用来创建刚体模型的图像导入到Flash中，稍后作为刚体的userData使用。当然，如果不需要userData，可以省略这一步。
创建文档类，键入代码，创建一个。
在文档类中，创建一个PhysicsData实例对象，用下面的代码创建刚体。然后正常的更新Box2D世界就可以了。
以拉登大叔的头像为例，实现的效果如下，点击舞台创建头像。
Sorry, either Adobe flash is not installed or you do not have it enabled
具体的用PhysicsEditor创建刚体模型和导入PhysicsData类的方法，我们下一节继续介绍。上面示例的完整代码和注释如下：
ActionScript
import Box2D.Collision.b2WorldM
mon.Math.b2Vec2;
import Box2D.Dynamics.b2B
import Box2D.Dynamics.b2W
import Box2D.Dynamics.Contacts.b2C
import flash.display.B
import flash.display.S
import flash.events.E
import flash.events.MouseE
* @author ladeng6666
public class Main extends Sprite
private var world:b2W
private var phyicsData:PhysicsD
public function Main()
createWorld();//创建世界
phyicsData = new PhysicsData();
//添加事件侦听器
addEventListener(Event.ENTER_FRAME, loop);
stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
//创建Box2D世界
private function createWorld():void
//创建Box2D世界
world = world = new b2World(new b2Vec2(0, 10), true);
//添加调试视图
addChild(LDEasyBox2D.createDebug(world));
LDEasyBox2D.stage =
LDEasyBox2D.createWrapWall(world, this);
private function onMouseDown(me:MouseEvent):void
//用拉登大叔的头像创建userData,并添加到舞台上
var userData:Bitmap = new Bitmap(new ladeng));
addChild(userData);
//用physicsData实例的createBody方法创建刚体，参数的重点是第一个
//它是在PhysicsEditor中添加的图像的名称，不要Flash库里的图像名称混为一谈
//现在不明白也没关系，下一节我们会仔细学习
var body:b2Body = phyicsData.createBody("ladeng6666", world, b2Body.b2_dynamicBody, userData);
//设置刚体的坐标
var position:b2Vec2 = new b2Vec2(mouseX / phyicsData.ptm_ratio, mouseY / phyicsData.ptm_ratio);
position.Subtract(body.GetLocalCenter());
body.SetPosition(position);
private function loop(e:Event):void
var body:b2Body = world.GetBodyList();
//遍历所有的刚体，更新它们的userData的坐标个角度
for (; body = body.GetNext()) {
if (body.GetUserData() != null) {
body.GetUserData().x = body.GetPosition().x * phyicsData.ptm_
body.GetUserData().y = body.GetPosition().y * phyicsData.ptm_
body.GetUserData().rotation = body.GetAngle() *180/Math.PI;
LDEasyBox2D.updateWorld(world);
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
package&&{ import Box2D.Collision.b2WorldManifold; import Box2D.Common.Math.b2Vec2; import Box2D.Dynamics.b2Body; import Box2D.Dynamics.b2World; import Box2D.Dynamics.Contacts.b2Contact; import flash.display.Bitmap; import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent;& /**
* @author ladeng6666
*/ public class Main extends Sprite
private var world:b2World;
private var phyicsData:PhysicsData;&
public function Main()
createWorld();//创建世界&
phyicsData = new PhysicsData();
//添加事件侦听器
addEventListener(Event.ENTER_FRAME, loop);
stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);&
//创建Box2D世界
private function createWorld():void
//创建Box2D世界
world = world = new b2World(new b2Vec2(0, 10), true);
//添加调试视图
addChild(LDEasyBox2D.createDebug(world));
LDEasyBox2D.stage = stage;
LDEasyBox2D.createWrapWall(world, this);&
private function onMouseDown(me:MouseEvent):void
//用拉登大叔的头像创建userData,并添加到舞台上
var userData:Bitmap = new Bitmap(new ladeng6666(0, 0));
addChild(userData);
//用physicsData实例的createBody方法创建刚体，参数的重点是第一个
//它是在PhysicsEditor中添加的图像的名称，不要Flash库里的图像名称混为一谈
//现在不明白也没关系，下一节我们会仔细学习
var body:b2Body = phyicsData.createBody("ladeng6666", world, b2Body.b2_dynamicBody, userData);
//设置刚体的坐标
var position:b2Vec2 = new b2Vec2(mouseX / phyicsData.ptm_ratio, mouseY / phyicsData.ptm_ratio);
position.Subtract(body.GetLocalCenter());
body.SetPosition(position);
private function loop(e:Event):void
var body:b2Body = world.GetBodyList();
//遍历所有的刚体，更新它们的userData的坐标个角度
for (; body; body = body.GetNext()) {
if (body.GetUserData() != null) {
body.GetUserData().x = body.GetPosition().x * phyicsData.ptm_ratio;
body.GetUserData().y = body.GetPosition().y * phyicsData.ptm_ratio;
body.GetUserData().rotation = body.GetAngle() *180/Math.PI;
LDEasyBox2D.updateWorld(world);
本文出自 Ladeng6666 的博客，转载时请注明出处及相应链接。本文永久链接: /blog//create-customer-body-shape-using-physicseditor-step1/
0, , , ,
Box2D 下的最新文章
Ɣ回顶部下次自动登录
现在的位置:
& 综合 & 正文
cocos2d-x+box2d+PhysicsEditor+win7强大的box2d工具
&&&&推荐文章:
【上篇】【下篇】Cocos（32）
下载与安装PhysicsEditor
物理编辑器介绍
1.VertexHelper
免费、开源的物理编辑器，只能在Mac平台下使用。
2.PhysicsEditor
收费，支持windows与mac。可免费使用，有功能限制。
这里使用的是PhysicsEditor。
PhysicsEditor下载地址：
下载地址一：
下载地址二：
在PhysicsEditor安装目录下有一个Examples文件夹。这里有各个物理引擎的使用示例。Cocos2d-X文件夹是Cocos2d-x的例子，但是是使用Cocos2d-x1.0。
编辑器的使用
1.点击Add Sprites按钮添加图片，或者直接拖到左边的窗口
2.编辑顶点，编辑之前先在编辑界面顶部选择形状的类型（圆形、多边形），右键添加顶点，用鼠标拖拽顶点，编辑形状。
3.导出格式设置，在Cocos2d-x中使用的是plist格式的文件。所以选择Box2D geneic PLIST
4.相关参数的设置
5.使用魔法棒自动填充顶点。
点击魔法棒后，在弹出的对话框中的Tolerance字段设置顶点的数量因子。数字越小，顶点数量越多；数字越大，顶点数量越少。默认为5，一般已经可以把图形轮廓描绘出来了。
6.点击Publish导出，导出文件记录了图片的夹具定义信息，key为在编辑器中设置的资源名称。
在Cocos2d-x中使用导出文件
开发环境说明：
游戏引擎版本：Cocos2d-x2.2.1
物理引擎：box2d
系统：win7
1.拷贝GB2ShapeCache-x.cpp和GB2ShapeCache-x.h到工程。
对于导出文件的加载和解析方法封装在GB2ShapeCache这个类中。类的定义与实现在PhysicsEditor\Examples\Cocos2d-X\Demo\Demo\generic-box2d-plist目录下的GB2ShapeCache-x.cpp和GB2ShapeCache-x.h文件中。
把这两个文件拷贝到工程Classes目录下。
注意：由于例子工程使用是的Cocos2d-x1.0，使用了过时的api，所以在使用的时候还需要做些修改。
2.替换GB2ShapeCache-x.cpp中使用的废弃api
3.首先#include &GB2ShapeCache-x.h&，使用GB2ShapeCache的addShapesWithFile方法加载plist文件
4.定义资源名称数组，需要与编辑器中定义的资源名称相同。
5.通过GB2ShapeCache的addFixturesToBody方法建立夹具定义与刚体的关联。
工程地址：
相关文章：
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：95542次
积分：1908
积分：1908
排名：第15385名
原创：92篇
评论：10条【Box2D】物理引擎入门002 - 简书
下载简书移动应用
写了24780字，被13人关注，获得了10个喜欢
【Box2D】物理引擎入门002
物理编辑器篇（PhysicsEditor）
在Box2D中，除了可以使用内置的几种基本形状之外，它还支持从外部文件中进行材质（b2Fixture）的创建。在创建一些复杂的刚体形状时，单纯的使用多边形描点是一个比较费劲的工作，这时候借助PhysicsEditor这款出色的物理材质编辑器来进行可视化编辑会大大提高效率。
一、形状编辑
PhysicsEditor主界面
如上图所示，PhysicsEditor的主界面大致分为四个区域（工具栏、形状列表、形状编辑面板和参数编辑面板）。
1、工具栏（ToolsBar）
工具栏位于界面的顶部（如果Windows版本的话，在工具栏上方还有有一行菜单栏），工具栏从左往右依次包含以下6个工具项。
New：新建文件。
Open：打开一个已有的物理材质编辑文件。
Save：保存当前的编辑文件。
Publish：导出配置文件。
Publish As：导出所有。
Add Sprites：添加精灵。
2、形状列表（Shapes）
形状列表的面板默认在主界面的左边位置，该面板显示的是文件编辑的形状。为了方便编辑形状，开发者可以直接将要编辑的形状对应的图片拖进该面板松开。
形状列表面板
如果要删除某个形状，只需要在Shapes面板上面选中要删除的形状，然后点击面板右下角的删除按钮即可。（图片的名字会默认为形状的名称，以便导出到文件最后在代码里面使用，所以一般使用合法标识符对图片命名。）
3、形状编辑面板（Editor）
主界面中央是用于编辑形状的面板，选中Shapes面板上面的形状后，该面板会显示对应的图片，开发者可以根据图片的轮廓进行描点，编辑出想要的形状。
形状编辑面板
形状编辑面板的顶部是一组形状编辑工具，从左往右依次是：圆形、多边形、魔术棒、左右对称、上下对称、顶点的x坐标值、顶点的y坐标值和一个删除按钮。
3.1、魔术棒
魔术棒顶点信息
在形状列表里面选择一个形状（我这里的carBody_1），这样便可以编辑carBody_1的形状了。先从魔术棒开始吧，点击魔术棒之后，编辑器会弹窗(如上图)显示自动描绘的形状顶点，直接点击右下角的“OK”按钮。物理编辑器根据图片的像素点自动生成了一个多边形（如下图）。
魔术棒生成的形状
3.2、多边形
虽然编辑器可以使用魔术棒自动生成多边形，但是这样形成的多边形顶点个数太多，会影响物理模拟的性能（计算量增加了），所以对于多边形，通常建议开发者使用多边形手动编辑（不用太过精确）。
点击多边形按钮，我们可以看到多生成了一个三角形（多边形默认为三角形），如下图：
新建形状后，原本使用魔术棒生成的形状会变灰掉，开发者可以点击灰掉的形状（形状变成红色选中状态），然后点击编辑面板右上角的删除按钮（y值右边的那个按钮）去除不要的形状。
生成的多边形默认在图片的左下角位置，开发者可以手动将其拖拽到合适的位置。然后，可以在形状相应的边线附近双击添加一个顶点（也可以右键创建一个顶点）。
编辑好的多边形
编辑好形状之后，可以选中一个顶点，然后顶部的x和y后面的文本框就会现实该顶点的坐标值，开发者可以手动输入进行微调（如上图）。
在形状列表选择wheel_1，然后点击形状编辑面板顶部的圆形按钮，这样就可以创建一个圆的形状。圆形在形状右边（3点钟位置）有一个顶点，拖拽它便可以调整圆形的大小。
3.4、形状镜像显示
如果要把编辑好的形状变成它的左右翻转镜像或者上下翻转的镜像，只需要点击一下左右对称或者上下对称按钮，这里就不再赘述（自己玩去，点个按钮反正很简单，不想写，任性--！）。
3.5、缩放编辑面板
由于编辑面板的大小受限，很多时候如果要编辑的图片比较大，或者想要描点更加精确，开发者可以使用形状编辑面板底部的缩放功能，默认是原图大小。
4、参数面板（Parameters）
参数面板分为：Exporter（导出）、Image parameters（图片参数）、Body parameters（刚体参数）和Fixture parameters（材质/夹具参数）四个部分。
在没有创建形状的时候，参数面板上面的部分参数是无法进行编辑的。
4.1、Exporter
Exporter用于设置导出的文件格式，默认为“AndEngine Exporter(XML)”，该选项是一个下拉选择列表，开发者可以根据使用情景选择合适的导出格式。这里我选择“Box2D generic(PLIST)”。
4.2、Gloabl parameters(全局参数)
当Exporter设置为Box2D generic(PLIST)选项后，原本的Body parameters便没有了，反而多出了一个Gloabl parameters(全局参数)，全局参数里面可以设置“PTM-Ratio”（Cocos2D与Box2D的度量单位的一个缩放系数）。
PTM-Ratio默认值是32，通常在Cocos2D中也是使用32，但是这边需要将其设置为64，否则在创建的时候会发现刚体过大（具体原因我也没有去深究）。
4.3、Image parameters
在Image parameters中，我们通常也只需要关注“Relative”这一项，其它的都可以不用管（看看就知道其它参数是什么意思）。
当Exporter设置为Box2D generic(PLIST)选项后，在形状编辑面板的左下角便会多出一个小圆圈（如下图）。
这个圆圈表示的是刚体的质心（搓一点的人就把它当成中心点吧）。我们可以手动拖动这个小圆圈到想要设置的位置，通常是图片的中间，因为Cocos2D的精灵（Sprite）默认的锚点在中心点，这样设置方便进行物理世界和渲染世界的效果同步。
在拖动小圆圈的时候就会发现，Relative参数的对应的在变化，开发者可以直接在Relative后面的两个输入框里面把值改成0.5，这样就肯定居中了。
4.4、Fixture parameters
在材质参数这边一共有7个个参数要设置。
Density：密度，用于设置形状的密度，间接的影响刚体的质量。
Restitution：恢复系数，控制刚体发生碰撞时，能量的损失。0表示完全非弹性碰撞，1表示完全弹性碰撞。
Friction：摩擦系数，用于模拟形状的摩擦效果。
Is Sensor：是否为传感器类型，勾选时表示该形状发生碰撞时可以接收到碰撞信息，触发碰撞回调，但是没有碰撞的效果。
Id：刚体的id。
Group：碰撞组，用于碰撞检测，默认为0。
除了上述6个参数之外，在Group下面还有16个碰撞种群的设置，用于进行碰撞筛选：
Bit's name：种群名称。
Cat：刚体所在的种群（可以多选），默认选择第一个。
Mask：与该形状发生碰撞的种群（可以多选），勾选后即表示当前形状可以与对应的种群的刚体发生碰撞。
二、文件导出和保存
编辑结束后点击顶部工具栏的“Publish”按钮，进行导出，Publish导出的是plist格式，可以在Cocos2D中进行解析（关于如何使用该文件将在下一篇关于关节的篇幅中介绍）。
除此之外，我们还需要“CTRL + S”或者点击工具栏的“Save”按钮将文件保存成pes格式的文件，pes格式的文件可以使用PhysicsEditor直接打开，方便后续开发中进行修改。
如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮
如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
选择支付方式：}