基于Unity制作2.5D物体编辑器
最近工作做了一个很有意思的东西,觉得其中有一些技术也可以和大家一起分享,故写了这篇文章。 这是一个基于Unity制作的2.5D物体编辑器,可以导出二进制数据,以便于日后进行读取。
(注意学习前最好先了解下tilemap)
首先这个界面我使用了FGUI,这是一个很棒的UI编辑工具,他帮我完成了大部分的UI编辑工作。 然后我们的格子计算与获取,我使用了Tilemap来作为标准,虽然我可以自己写自己算格子,但这太过麻烦了,我个人认为既然Tilemap直接帮我处理好了,也做好了坐标系的转化,我为什么不用呢?
现在开始正式制作,首先我的思路是一个物体分为两个部分,他的基础信息,名字、类型、物理上的占地面积、以及渲染层上的实际占地面积,因为这是一个2.5D的游戏,从游戏角度出发,我们分为物理层与渲染层。 首先物理层涉及到了我们的人物再数据层面上能否通过,渲染则是展示效果,因为游戏中是肯定会出现人物被物体挡住但是又能通过的物体后面的情况,就像这样 比较抽象,但是如果我们只有一层,那么人物既不能通过,也不能被挡住,这是不应该的事情,所以我们应该分为两层。 现在我们来看如何在编辑器对阻挡层和渲染层进行编辑,首先我们要知道所有编辑的数据,位置都因该是相对位置而不是绝对位置,编辑器地图的中心点作为锚点,我们在制作时进行数据偏移,确定起始点,然后再从起始点开始填充格子,比如说偏移坐标(1,1),格子占地长宽为(2,2)也就是说我们相对于物体来说,我们从物体的(1,1)坐标开始往X轴2格,往Y轴2格所画出来的矩形都是被我们所使用的格子也就是说(1,1),(1,2),(2,1),(2,2)都是被我们所占用的。 至于如何显示出来我这里是比较简单的一个处理白底黑线的格子用了一个tilemap进行渲染,红格子,绿格子也各用了一个tilemap 这里涉及到一个坐标系的转化,因为我们的物体是在地图的中心点我这里地图是50*50的大小,也就是说物体是在(25,25)的位置,那么根据我上面刚刚举得例子,我们应该在地图的(25,25)+(1,1,)的位置开始进行绘制,但我们编辑器上显示的数据还应该是X=2、Y=2,Offest(1,1)这是我们需要注意的,也是一个难点。 剩下的高度类型那是更具需求来说的了,我在这就不说了,高度也就是一个Y轴方向的偏移,也是相互对的。
这样我们再来看编辑器的右半部分,因为我们的物体是由一个一个的组件拼凑出来,最初我有想做一个树形结构,不过策划不想这样,所以就变成了现在这样,通过点击下方列表来选择,我们当前选择中的组件, 这里也是需要注意的,一开始我也是基于格子来进行计算,后来我觉得不应该这么做,首先我们得图片其实就是很简单的一个spriteRenerder贴上去的,如果我是根据格子的中心点强制他的坐标,就会出现图片拼接不上的事情,因为我们是肯定会把一把椅子给拆开的,分成4个凳腿,一个椅背,一个椅面。 所以后来我改成了以世界坐标来偏移,这里也是一个注意点。 后面是很关键的一点,层级在一款2d游戏里,层级是最麻烦,最头疼的事情,这里怎么处理我就不说了,但一定别忘了层级。 其实到这里也就没什么可以再继续往下说的了,这款编辑器最需要注意的就是坐标系的转换以及层级关系的处理。 至于数据导出为什么格式,这些我就不多说了,我这里是二进制数据,你们可以凭喜好随意处理XML,jSON都是可以的。
这里我再推荐一款插件,Unity运行时文件浏览器,可以再编辑器运行时选择读取与保存路径我觉得十分好用~ 这里是演示视屏各位有什么技术难点,或者建议也可以与我交流~