Cocos2d-x v3.0物理系统 利用PhysicsEditor创建多边形

Posted 2022-12-09 wangdi1224

Cocos2d-x 3.0的新物理系统我就不必多说了，接触一段时间，感觉还是不错的。对于那些基本概念，网上的教程已经泛滥了，就不多说了，不过对于创建多边形物体的教程，还真不多，很多都是创建圆形和矩形，这两个很简单，传入图片的大小数据基本就可以搞定了。多边形的麻烦之处在于每个点的位置，Mac下有VertexHelper可以很轻松获取到多边形的每个点，然后创建出来，但Windows下，呃，确实我没找到什么好的工具，PhysicsEditor在以前使用Box2d原生的代码创建多边形还是挺好用的，现在就不太适合了，所以本篇的用法也是建立在它的之上做出来的，如果有好的办法，欢迎提出分享哈。

话不多说，看看如何利用PhysicsEditor来创建一个多边形。

打开PhysicsEditor，导入一张多边形，姑且咱们先拿个三角形开刀说，导入图片之后，选择上方的add polygon

将我们的三角形区域拉出来，像这样，

这样多边形的几个点位置就算完成了，下面的步骤很关键，

在右边Exporter选择“Chipmunk generic”，因为cocos封装的多边形顶点是按照顺时针的方向来的，和box2d不一样，box2d是反方向的。

当你选择之后，会看到图中多了一个点，那个是锚点的位置，所以接下来是设置锚点的位置，新版的物理系统在setPhysicsBody的时候是将Body绑定在图片的中心点位置，所以我们在PhysicsEditor中绘制的Body区域也需要将锚点设置在中心点，不然回过头在创建Body的时候还要设置偏移量offset。

如下图，将关键的地方设置成（0.5， 0.5）就可以了。

接下来，保存一下这个文件，是一个plist格式的，用个Notepad++打开下，找到下面有个点数组的位置，

我们就是需要这一组点数据，我想后面的事大家应该就很清楚了，打开VS，创建一个多边形咯。

 auto triangle = Sprite::create("CyanTriangle.png");	
	triangle->setPosition(Point(size.width/2, size.height*0.8));
	Point points[3] =  Point(-50.00000, -43.50000), Point(0.00000, 43.50000), Point(51.00000, -43.50000) ;

	auto polygonBody = PhysicsBody::createPolygon(points, 3);
	triangle->setPhysicsBody(polygonBody);
	addChild(triangle);

PhysicsBody::createPolygon的参数第一个是点数组，第二个是数组的大小，也就是边的个数。

运行看一下效果，

由于打开了debug模式，所以红色的区域非常贴切，可以用啦。

当然咯，PhysicsEditor也可以做凹多边形的，不过这个步骤要麻烦不少，但过程基本一样，简单过一遍，

拿个logo图片做一下，可以右键添加点哦，然后简单拉出这样的效果。然后还是保存我们的plist文件。

对于凹多边形，我们的策略基本就是采用addShape的方式，将其分割成多个凸多边形，然后组合在一起，他们的碰撞区域是组合起来的，所以没问题。

这个时候打开plist文件，可以看到是这样的点数组，

它的策略也是这样的，所以符合我们的要求，只是这么多点，咱们要一个一个添加，确实略显麻烦，没办法，继续来吧。。。。

一个数组点创建一个多边形Shape，所以代码是这样的。

 auto logo = Sprite::create("powered.png");
	auto logoBody = PhysicsBody::create();
	Point vert1[4] =  Point(1.00000, 134.50000), Point(24.00000, 111.50000), Point(-16.00000, 126.50000), Point(-22.00000, 149.50000) ;
	logoBody->addShape(PhysicsShapePolygon::create(vert1, 4));
	Point vert2[4] =  Point(-100.00000, -149.50000), Point(24.00000, 111.50000), Point(101.00000, 111.50000), Point(101.00000, -149.50000) ;
	logoBody->addShape(PhysicsShapePolygon::create(vert2, 4));
	Point vert3[4] =  Point(24.00000, 111.50000), Point(-100.00000, -149.50000), Point(-32.00000, 112.50000), Point(-16.00000, 126.50000) ;
	logoBody->addShape(PhysicsShapePolygon::create(vert3, 4));
	Point vert4[3] =  Point(-32.00000, 112.50000), Point(-100.00000, -149.50000), Point(-100.00000, 112.50000) ;
	logoBody->addShape(PhysicsShapePolygon::create(vert4, 3));
	logo->setPhysicsBody(logoBody);
	logo->setPosition(Point(size.width*0.8, size.height*0.7));
	addChild(logo);
	logo->setRotation(180);

好了，这样就可以了，我还旋转了一下，为了测试一下上面那一撮头发的碰撞区域，哈哈~