瓦片地图简介
瓦片地图是游戏中常用的一种技术.瓦片地图,见其名知其意,它是类似于用瓦片一个个小的模块拼凑出一张大的地图,例如老式的黑白机的坦克90游戏就是用一个个小的模块拼凑出来的.那么瓦片地图的优势或者说瓦片地图的美丽道理在哪呢?其实还是内存的问题,你想想如果一幅巨大无比的游戏地图,使用几个简单的瓦片就可以生成.与直接使用这一张巨大无比的游戏地图,不管在内存还是管理上都有着巨大的优势.
TML地图文件生成工具
瓦片地图其实就是一个二维的数组,每一个数组上面都含有地图上某一个位置的区域信息.瓦片地图的创建方式总共有三种,一种是直接使用二维数组,一种是加载txt文档,在文档当中包含着瓦片地图的相关信息,最后一种是加载TML地图文件的形式创建.其实对于第一种和第二种来说,我们比较熟悉,但是第三种TML地图文件是什么东东?闻所未闻.TML文件是常见的游戏地图文件.使用场景比较广泛.那么接下来,工欲善其事必先利其器,看一下我们都需要什么工具生成瓦片地图.如下图所示,一个是生成纹理集的工具TexturePacker.一个是瓦片地图制作工具Tilded.-->工具传送门
TexturePacker
那么下面,先看一下纹理集工具TexturePacker的使用.我们先按照下面的图中所示步骤安装TexturePacker.
现在我们打开TexturePacker,我们首先用图片介绍一下TexturePacker工具的菜单栏和工具栏.如下图所示
TexturePacker工具栏中常用的属性主要有这么几种.按照图片设置即可.
注意:请按照上述条件如实设置....如若操作不当,出现失误,骚栋概不负责..😂😂😂😂
那么接下来我们就导出我们的纹理集图片.首先我们先添加一个图片的文件夹,如图所示.
当我们把文件夹拖进去之后,所需要生成的纹理集图片预览如下图所示.(这里的左边工具栏相关设置请设置好!!!!)
然后如下图.导出我们的纹理图集即可.
如图所示,导出一个plist文件和一个png纹理图片.这样我们的纹理集图片工作就完成了.
Tilded
上面使用TexturePacker已经完成了纹理集合的生成.这样瓦片素材已经准备好了,恩恩,我们首先先安装Tilded.如图所示.
那么接下来我们来简单的介绍一下Tilded的工具页面,其实Tilded有点像简化版的PS页面一样,比如油漆桶,橡皮擦,矩形选择工具,图层等等,对于有点PS基础的人上手非常简单.
紧接着,我们就要创建我们的第一个瓦片地图了.
在此之前有个信息一定要搞好,那就是每个瓦片的尺寸大小,我的每个瓦片都是16*16的.不知道尺寸的童鞋可以直接查看图片简介,记住是每一个瓦片地图尺寸,而不是合成完成的纹理集图片的尺寸.....
新建一个新的瓦片地图文件.快捷键:command + N,如下图示.设置完成之后,我们就直接创建我们的第一个瓦片地图吧.
创建完成瓦片地图之后,我们就需要导入我们的瓦片素材.一共有两种方式,一种是直接把纹理集的图片拖到图块区,另外一种就是使用菜单栏上的"地图"工具,然后点击"新图块"选项添加我们的图块.如图所示.(这里TexturePacker生成的plist文件是没有任何用途的~~莫慌莫慌.😌)
接下来,我们需要对新图块的属性进行设置.设置完成之后,点击OK即可添加新的图块了.
这里需要说明一下,因为我这几个瓦片的尺寸都是一样的,那么当瓦片尺寸不一样,生成的纹理集中下图中的块的高和宽要设置多少呢?例如,其中一个瓦片是32x32,其他的瓦片是16x16;那么我们需要设置设置为16 x16;因为16x16是最小的尺寸,我们可以使用16x16组成32x32的尺寸,反之,却不行.现在就是这么一提,随着下面就会说到这个问题是如何解决的.
接下来我们就要绘制我们的瓦片地图了. 我们要选择图块,我们可以点击每一个图块,也可在纹理图片上按住左键拖动鼠标,选择完成之后的绘制单元是选中状态的.如图所示,选择一个16x16,选择一个32x32的.
接下来,我们拿着我们的选择单元在我们的工作区的绘制瓦片地图即可,(绘制是可以按住鼠标直接如同画笔一样绘制,也可以使用单击鼠标的形式对细节进行绘制)我们可以适当的选择一些工具,来增加我们的工作效率,比如先使用矩形选择工具选择一个区域,然后直接油漆桶.或者我们需要随机创建我们的单元,我们只需要全选纹理集图片之后.直接选择随机创建按钮即可.
创建完成,我们就保存我们的TML地图文件就好.快捷键:command +S ,我们的TML地图文件就创建完成了.
TML的文件中到底包含着什么呢?是一张完整的地图图片吗?不,其实TML文件包含着还是二元数组,以及纹理集的相关信息,不过相比于数组形式创建和txt文件形式创建更加的生动形象.也更加的方便.
最后说一下吧,因为TexturePacker和Tilded都是付费的,所以我就从网上找到的破解版的,恩有可能会出现Bug.但是日常的开发需求应该是足够满足了.下一篇,我将对瓦片地图的三种创建方式以及轻量级的瓦片地图SDmapNode进行一个详细的讲解分析,欢迎关注.谢谢.
