Cocos2d-x V3.0 physical system using physicseditor to create Polygon

Cocos2d-x 3.0 new physical system I don't have to say much, contact for a period of time, I feel good. For those basic concepts, there have been a flood of tutorials on the Internet, so I won't say much about them. However, there are not many tutorials on Creating polygon objects. Many of them are creating circles and rectangles. These two are very simple, you can simply import the image size data. The trouble with polygon lies in the location of each vertex. vertexhelper in MAC can easily obtain each vertex of the polygon and create it. However, in windows, I did not find any good tool. physicseditor was quite useful in the previous use of box2d native code to create polygon. It is not suitable now, therefore, the usage of this article is based on it. If you have a good solution, please share it with us.

Let's not talk much about it. Let's see how to use physicseditor to create a polygon.

Open physicseditor and import a polygon. Let's start with a triangle. After importing the image, select Add Polygon

Pull out our triangle area, like this,

In this way, the polygon points are completed, and the following steps are critical,

Select "chipmunk generic" for the exporter on the right, because the polygon vertices encapsulated by Cocos are in the clockwise direction. Unlike box2d, box2d is in the inverse direction.

After you select, you will see that there is another point in the figure, which is the position of the anchor, so the next step is to set the location of the anchor, the new version of the physical system binds the body to the center point of the image when setphysicsbody is set. Therefore, the anchor in the body area drawn in physicseditor also needs to be set to the center point, otherwise, you need to set the offset when creating the body.

For example, set the key points to (0.5, 0.5.

Next, save the file in plist format. Open it with notepad ++ and find the position of the Dot Array below,

We just need this set of point data. I think we should be very clear about the following. Open Vs and create a polygon.

<span style="white-space:pre"></span>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: The first parameter of createpolygon is the vertex array, and the second parameter is the size of the array, that is, the number of edges.

Run the command to check the effect,

Because the debug mode is enabled, the red area is very appropriate and can be used.

Of course, physicseditor can also be used as a concave polygon, but this step requires a lot of trouble, but the process is basically the same. It's easy to go over it again,

Take a logo image and do it. You can right-click and add a dot, and then simply pull out the effect. Then save the plist file.

For a concave polygon, we basically adopt addshape to divide it into multiple Convex Polygon and then combine them. Their collision areas are combined, so there is no problem.

Open the plist file at this time and you can see the Dot Array like this,

Its policy is also like this, so it meets our requirements, just so many points, we need to add one by one, it is really a little troublesome, there is no way to continue ....

An array point creates a Polygon Shape, so the code is like this.

<span style="white-space:pre"></span>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);

Okay, so we can. I also rotated it. To test the collision area of the above hair, haha ~

Cocos2d-x V3.0 physical system using physicseditor to create Polygon