代码参考王哲博客 C++版本

http://www.cnblogs.com/walzer/archive/2010/11/08/1871561.html

吐槽:原文说是上下篇,结果有了上篇,没了下文。。。

 

Qt版本瓦片地图编辑器的使用

我使用Qt版本的瓦片地图编辑器,设定地图大小。记住这是以地图块为单位,不是像素点。

图1

在编辑器中加入地图块集,边距间距都选择一像素,为什么?因为给的图片资源每个格子间有间隔

 

  • Margin就是当前的tile计算自身的像素的时候,它需要减去多少个像素(宽度和高度都包含在内)。(类比word、css的margin)
  • Spacing 就是相邻两个tile之间的间隔(同时考虑宽度和高度)(类比word、css的spacing)
  • 边缘,指的是一个地图块的外面一圈,在这个边缘里面是实际的地图块内容。 
  • 间隔,即两个地图块之间的间距(像素单位)。

 

图2

按照博客里要求,点击图层按钮,加入对象层,有了对象层真的是方便了不少,因为我们可以根据自定义的位置来获得精灵的一些属性了,默认为6种属性,name,type,

x,y,height,width(在程序中用的还是属性的英文名),命名为spawnpoint,位置在图4中显示,图层(这里是唯一的背景层)重命名为background,对象层命名objects

图3

 

图4 地图全貌

 

把tile地图添加到cocos2d-x的场景中

 

接下来就是要在cocos2d-x中使用了,生成项目,就用HelloWorld。

首先在类声明中加了个成员CCTMXTiledMap *_tileMap;

代码:

在init方法中添加代码

 
    
  1. _tileMap = CCTMXTiledMap::tiledMapWithTMXFile("tilemap.tmx"); 
  2. _tileMap->setPosition(ccp(0, 0)); 
  3. //瓦片地图 锚点默认就是0,0点 
  4. this->addChild(_tileMap);       //加入层中进行渲染 

王哲博客说明:CCTMXTiledMap。这是一个CCNode,所以你可以设置它的位置,尺寸等,该节点的子节点是地图上的层,而且也有 一个接口可以通过名字来获取这些层,比如这里的“background”层。每一个层都是CCSpriteSheet的子类,这也意味着每一层你只能有一 个tileset。

上面是王哲大大博客里的说明,最常用的子节点就是对象层,而他说的对应接口就是objectGroupNamed()方法。

接下来再添加下述代码

 
    
  1. CCTMXObjectGroup *objGroup = _tileMap->objectGroupNamed("objects"); 
  2. CCStringToStringDictionary *spawnPoint = objGroup->objectNamed("spawnpoint"); 
  3. float fSpawnPointX = spawnPoint->objectForKey("x")->toFloat(); 
  4. float fSpawnPointY = spawnPoint->objectForKey("y")->toFloat(); 
  5.  
  6. CCTexture2D *pPlayerTexture = CCTextureCache::sharedTextureCache()->addImage("player.png"); 
  7. CCSprite *pPlayer = CCSprite::spriteWithTexture(pPlayerTexture); 
  8. pPlayer->setPosition(ccp(fSpawnPointX, fSpawnPointY)); 
  9. _tileMap->addChild(pPlayer); 
  10. //pPlayer->setPosition(CGPoint(fSpawnPointX, fSpawnPointY));

王哲博客说明:对象层和对象组。在这里,我们通过CCTMXTiledMap对象的objectGroupNamed接口得到了对象层,它返回的是一个CCTMXObjectGroup对象。然后,我们通过CCTMXObjectGroup的objectNamed方法来得到一个CCMutableDictionary,它包含了对 象层的对象的一堆有用的信息,包括X和Y坐标,宽度和高度。不过这里我们关心的是X,Y坐标,所以我们就只取得X,Y坐标,并把它作为精灵的位置。

吐槽:谎言,根本就看不到,因为视角在左下方,必须要调整视角才能看到。

子龙山人博客说明:首先,注意你通过CCTMXTiledMap对象的objectGroupNamed方法来获得对象层(而不是layerNamed方法)。它返回一个特殊的CCTMXObjectGroup对象。我们然后调用CCTMXObjectGroup类的objectNamed方法来获得一个CCMutableDictionary,这个字典包含了关于对象的大量信息,包括x和y坐标值,宽度和高度。在这个例子中,我们只关心x和y坐标,因此,我们提取出这两个信息,并且设置player的位置。

子龙山人博客中视角解决方法:

 
    
  1. void HelloWorld::setViewpointCenter(CCPoint position) 
  2.     CCSize winSize = CCDirector::sharedDirector()->getWinSize(); 
  3.     int x = MAX(position.x, winSize.width/2); 
  4.     int y = MAX(position.y, winSize.height/2); 
  5.     x = MIN(x, (_tileMap->getMapSize().width * _tileMap->getTileSize().width) - winSize.width/2); 
  6.     y = MIN(y, (_tileMap->getMapSize().height * _tileMap->getTileSize().height) - winSize.height/2); 
  7.     CCPoint actualPosition = ccp(x, y); 
  8.  
  9.     CCPoint centerOfView = ccp(winSize.width/2, winSize.height/2); 
  10.     CCPoint viewPoint = ccpSub(centerOfView, actualPosition); 
  11.     this->setPosition(viewPoint); 

子龙山人相关文章链接:

http://www.cnblogs.com/andyque/archive/2011/04/11/2012852.html

 

这回终于看到猥琐的大哥了!!

 

下一篇 瓦片地图在cocos2d-x应用增强版