Cocos2d-x3.3利用TileMap绘制Polygon/PolyLine

转自： http://www.cnblogs.com/lucky-hugh/p/4119931.html

tiled提供了多边形/折线的绘制, 在Cocos2dx3.3(不知道其他版本如何)中能够读取这些对象. 但是网上似乎没有Cocos2dx读取多边形/折线的相关教程. 今天尝试了PolyLine的绘制, 就在这里记录一下, 也希望能够帮到需要的人. 这里只介绍PolyLine的情况. Polygon情况是类似的.

在CCTMXXMLParse.cpp中,有方法

void TMXMapInfo::startElement(void *ctx, const char *name, const char **atts)

找到else if (elementName == "polyline"), 即解析折线的情况

可以看到, 最后一行为dict["polylinePoints"] = Value(pointsArray);

即将解析得到的pointsArray以"polylinePoints"为key存储. 所以我们在第12行用该key获取储存points的ValueVector.

 1     auto map = experimental::TMXTiledMap::create("map.tmx");
 2     //处理对象层
 3     auto objectGroup = map->getObjectGroup("Object");
 4     auto objects = objectGroup->getObjects();
 5     for (auto object: objects)
 6     {
 7         auto dic= object.asValueMap();
 8         float objectX = dic.at("x").asFloat();
 9         float objectY = dic.at("y").asFloat();
10 
11         auto drawNode= DrawNode::create();
12         auto pointsVector = dic.at("polylinePoints").asValueVector();
13         auto size = pointsVector.size();
14         //获取点
15         if (size>0)
16         {
17             Vec2* points= new Vec2[size];
18             int i =0 ;
19             for (auto pointValue:pointsVector)
20             {
21                 auto dicp = pointValue.asValueMap();
22                 auto x  = dicp.at("x").asFloat();
23                 auto y  = -dicp.at("y").asFloat();//y取负值
24                 points[i]= Vec2( x , y );
25                 i++;
26             }
27             //绘制折线
28             drawNode->drawPoly(points,size,false,Color4F::RED);
29             delete[] points;
30             drawNode->setPosition(objectX,objectY);
31             this->addChild(drawNode,10);
32         }
33     }

 

第16行的代码似乎没有实际意义, 因为当对象不是PolyLine时会报错. 所以如果直接使用上面的代码的话, 在tiled中,PolyLine所在的对象层只能有PolyLine对象而不能有其他的对象.

或者在tiled中给PolyLine添加一个类型, 并在代码中进行判断. 

 

tilemap截图

 

绘制结果

 

在tilemap中, 我不太清楚如何确定点的顺/逆时针方向, 然而在Cocos2dx中利用3.x的API创建多边形是要求顺时针方向的. 

这个给出凸多边形求顺/逆时针的方法:

转自http://www.oschina.net/question/437512_129417

关于如何判定多边形是顺时针还是逆时针对于凸多边形而言，只需对某一个点计算cross product = ((xi - xi-1),(yi - yi-1)) x ((xi+1 - xi),(yi+1 - yi))  
= (xi - xi-1) * (yi+1 - yi) - (yi - yi-1) * (xi+1 - xi) 
如果上式的值为正，逆时针；为负则是顺时针而对于一般的简单多边形，则需对于多边形的每一个点计算上述值，如果正值比较多，是逆时针；负值较多则为顺时针。

我根据这个写了判断代码:

bool LogicLayer::isClockWise(Vec2 p1,Vec2 p2,Vec2 p3)
{
    if (  ((p2.x=p1.x) * (p3.y-p2.y) - (p2.y - p1.y ) * (p3.x - p2.x))>0 )//为正则是逆时针
        return false;
    else
        return true;
}

返回true时为顺时针. 

如果结果为0 的情况是无法判断的.