Tiledmap基本使用教程

来源:互联网 发布:老滚5捏脸数据导入 编辑:程序博客网 时间:2024/05/17 05:14

如果你是第一次使用tiledmap的朋友,那么这篇文章一定能给你带来一些帮助。相信大家都玩过飞行射击类游戏,游戏中不断有敌方飞机biubiu的飞向玩家,那么这些飞机不是随机出现,是可以用tiledmap在地图上面标记出来,然后加上代码,让他们在一定的时间出现。
下面给大家带来tiledmap基本使用的详细过程,我们在tiledmap中画一个方框,并且在cocos中得到这个方框的位置。

  • 翔仔cocos2d版本是3.2,Tiledmap版本:这里写图片描述

  • 创建新文件 ,然后写入自己的地图大小,和块大小。这里所谓的地图大家可以想象成自己游戏中的地图大小,tiled中将地图分为一个一个块,每一个块大小相同,所有的块拼接成一张地图。下面是翔仔的地图设置:

    这里写图片描述
    这张地图设计出来明显就是射击游戏的地图,很长很长··。那么大家可以计算一下这张图片的大小应该是480*6400像素。

  • 下面大家选择一张背景图片加入到该项目,直接将一张图片拖入到右边的“图块”中。如图:
    这里写图片描述
    翔仔这里选择了一张512*768的图片,那么在拖入图片的时候设置块大小也是32*32,刚好可以把图片平均的分开来(高宽都可以整除,大家在做地图的时候最好把图片的分块大小和创建项目的块大小调整成一样,才能更好的设计。

  • 接下来把图块中的图片全部选中拖入到左边的窗口中,可以贴很多张因为刚开始我们创建的项目图片大小是6400的高度。如图:
    这里写图片描述
    这样我们的地图就创建好了,看起来像一张很长的射击游戏地图。

  • 接下来创建地图中的对象,也就是所谓的敌军飞机,首先在地图中创建一个图层(记住给图层改一个名字,翔仔用的SpriteLayer),然后再图层中画方框,或者圆形来代表敌军飞机。
    这里写图片描述
    选中图层,然后选择矩形图标,你就可以在地图中画矩形对象了。如下:
    这里写图片描述
    翔仔画了一个名字叫做name的矩形,大家可以在右下角的属性窗口中来设定该矩形的各种属性,大家可以在地图上面画很多的矩形,从上画到下面,就感觉是射击游戏敌军飞机在地图出现的顺序一样,懂不懂?反正我是领悟到了··。最后保存我们最好了第一张地图。然后我们在cocos中取出这个对象。

    //创建tiled地图,刚才创建的工程名字就是Text6.    auto m_ptmap = TMXTiledMap::create("Test6.tmx");    //获取到对象层,就是刚才创建的SpriteLayer对象层!    auto m_ptobjectGroup = m_ptmap->getObjectGroup("SpriteLayer");    //将该对象层的对象全部取出来。    auto m_vecobject = m_ptobjectGroup->getObjects();    //这里可以测试下对象的个数,刚才的例子我们只画了一个name    log("对象个数 %d````", m_vecobject.size());    //这里遍历所有的对象来做个测试,其实就只有一个    for (auto it = m_vecobject.begin(); it != m_vecobject.end(); it++)    {        //将取出来的对象转为ValueMap类型,接下来大家都懂了吧。        ValueMap map = it->asValueMap();        //取出该对象的名字转为Cstring类型。        log"%s",map.at("name").asCString();)        //这里大家可以看到输出为“name”。    }
  • 上面的代码例子已经给大家展示了如何取出地图中的对象,然后将其名字取出来,当然也可以取出其他的属性,比如坐标map.at(“x”).asInt(),那么同理大家在制作射击游戏地图的时候可以在地图上面画很多的对象(也就是所谓的敌军飞机),根据他们的Y坐标的高度来设置敌军飞机出现时间,再根据各个对象的不同名字或者类型来创建不同的飞机,根据Y坐标,X坐标来设置飞机出现的位置。

  • 最后要注意一点的是tiledMap是以左上角为原点,Y向下,X向右的坐标系,Y轴跟cocos的坐标是相反的,所以要将对象的Y坐标进行计算转换才能得到cocos的坐标。如下:

//getMapSize是得到整个地图有多少个块,乘以每个块的大小,就是整个高度,减去对象的y坐标,得到的值就是以cocos为坐标系的Y坐标。int y= m_ptmap->getMapSize().height*m_ptmap->getTileSize().height-map.at("y").asInt() );
0 0
原创粉丝点击