瓦片地图

简介:


在游戏开发过程中,我们会遇到超过屏幕大小的地图,例如即时战略游戏,使得玩家可以在地图中滚动游戏画面。这类游戏通常会有丰富的背景元素,如果直接使用背景图切换的方式,需要为每个不同的场景准备一张背景图,而且每个背景图都不小,这样会造成资源浪费。

瓦片地图就是为了解决这问题而产生的。一张大的世界地图或者背景图可以由几种地形来表示,每种地形对应一张小的的图片,我们称这些小的地形图片为瓦片。把这些瓦片拼接在一起,一个完整的地图就组合出来了,这就是瓦片地图的原理。

TileMap方案

在Cocos2d-x中,瓦片地图实现的是TileMap方案,TileMap要求每个瓦片占据地图上一个四边形或六边形的区域。把不同的瓦片拼接在一起,就可以组成完整的地图了。我们需要很多较小的纹理来创建瓦片。通常我们会将这些较小的纹理放在一张图片中,这样做会提高绘图性能。

瓦片地图编辑器

Cocos2d-x支持由瓦片地图编辑器Tiled Map Editor制作并保存为TMX格式的地图。Tiled Map Editor是一个开源项目,支持Windows、Linux及Mac OS X多个操作系统,我们可以从官网下载到编辑器的Java和QT版本。

如何使用Tiled工具建立地图可以参考以下文章:

如何使用Cocos2dx3.0制作基于tilemap的游戏

地图方向

Tiled地图支持直角鸟瞰地图(90°地图)、等距斜视地图(斜45°地图)和六边形地图,不支持左右或上下边界的六边形地图。

地图资源

  • 建议瓦片地图素材大小为32*32的倍数
  • 瓦片素材组与其他图片不能混合使用
  • 只有瓦片素材图能被导入TMX文件
  • 每个Layer最多支持1套瓦片素材组。

瓦片层

  • TMX文件中瓦片层的数量没有上限
  • 每一个瓦片层只能由一种瓦片素材组成
  • 每一个瓦片层可以被TMXLayer类表示-为SpriteSheet的子类
  • 每一个单一的瓦片被Sprite表示-父节点为TMXLayer

对象层

  • 瓦片地图支持对象组
  • 用来添加除背景以外的游戏元素-道具、障碍物等
  • 对象组中的对象在TMX文件中以键值对形式存在,因此可以直接在TMX文件中对他进行修改

瓦片地图坐标系

对于一个16*16的瓦片地图文件的坐标系统为

  • (0, 0): 左上角
  • (15, 15): 右下角

tiledmap

在Cocos2d-x中使用TMX

创建TMX节点

1
2
TMXTiledMap *map = TMXTiledMap::create( "bg.tmx" );
addChild(map, 0);

遍历子节点

1
2
3
4
5
6
7
8
9
10
11
Vector<Node*> pChildrenArray = map->getChildren();
 
SpriteBatchNode* child = NULL;
 
Ref* pObject = NULL;
 
for (Vector<Node*>::iterator it = pChildrenArray.begin(); it != pChildrenArray.end(); it++) {
     pObject = *it;
     child = (SpriteBatchNode*)pObject;
 
}

获取/删除一个瓦片

1
2
3
TMXLayer* layer = map->getLayer( "layer0" );
Sprite* tile0 = layer->getTileAt(Point(1, 15));
layer->removeTileAt(Point(1, 15));

遍历对象层中对象

1
2
3
4
5
6
7
8
TMXObjectGroup* objectGroup = map->getObjectGroup( "center" );
ValueVector object = objectGroup->getObjects();
 
for (ValueVector::iterator it = object.begin(); it != object.end(); it++) {
     Value obj = *it;
     ValueMap map = obj.asValueMap();
     log ( "x = %d y = %d" , map.at( "x" ).asInt(), map.at( "y" ).asInt());
}
目录
相关文章
|
8月前
|
缓存 资源调度 JavaScript
瓦片地图的介绍和Vue中使用Openlayer加载瓦片地图的方法使用
瓦片地图的介绍和Vue中使用Openlayer加载瓦片地图的方法使用
761 0
|
移动开发 前端开发 iOS开发
记录一下前端H5的复制功能在ios端的兼容性问题
记录一下前端H5的复制功能在ios端的兼容性问题
695 0
|
前端开发 测试技术 API
DDD领域驱动设计实战-分层架构及代码目录结构(上)
DDD领域驱动设计实战-分层架构及代码目录结构
1126 0
DDD领域驱动设计实战-分层架构及代码目录结构(上)
|
10月前
|
前端开发 定位技术 API
不用钱!纯前端打包下载离线瓦片地图
简直无语,瓦片地图明明是开放的,不用钱的,竟然有网站和程序要收费,本人绝不当冤大头,自己动手丰衣足食! 其实也有某些免费下载离线地图的良心程序,但因为下载瓦片的请求太频繁了,搞得打开该地图的时候卡死,被人家服务器记住了!
不用钱!纯前端打包下载离线瓦片地图
|
Android开发
AndroidStudio 前言中不允许有内容
AndroidStudio 前言中不允许有内容
366 0
|
XML Ubuntu 网络协议
OSS Python SDK
很多 oss 使用者在使用 Python SDK 时出现很多问题,不确定是否影响使用,有的安装失败环境有问题,今天说下遇到的几个案例 官方安装 pip install oss2 版本最好是 2.7.5 或以上 oss2 依赖 如果要开启 crc64 循环冗余校验,需要先将 crcmod 安装好。
OSS Python SDK
|
Ubuntu 定位技术
4 步 解决如何使用tilestache构建瓦片地图服务器
4 步 解决如何使用tilestache构建瓦片地图服务器
619 0
|
小程序 应用服务中间件 网络安全
域名配置https时,请求无响应的解决方法
在项目需要上线时,我们经常会遇到这样的需求,将`http`的域名换成`https`,或者当我们使用小程序开发时,只支持`https`的请求方式,那么这个时候我们可能就得需要配置一下`https`证书了,今天,我们就来看看如何配置`https`证书,包括遇到的一些坑(南辕北辙搞了5个小时)
467 0
域名配置https时,请求无响应的解决方法
|
NoSQL Shell Linux
Linux 更改用户环境变量和所有用户环境变量
Linux 更改用户环境变量和所有用户环境变量
|
Java 测试技术 Spring
SpringBoot——单元测试之JUnit5
SpringBoot——单元测试之JUnit5
SpringBoot——单元测试之JUnit5

热门文章

最新文章