Unity__TexturePacker使用图集来减少UI的开销

在游戏开发过程中,图片的使用是必不可少的,尤其是在UI部分,往往会使用大量的图片。如果每一张图片都是单独使用的话,实际上会对性能造成很大的损耗的。

这时候我们往往是把需要的图片资源进行分类,然后按照需要打包成对应的图集。这样会方便管理和更新迭代,同时也减少了很多的性能开销。

假如你一个UI界面使用了10张不同的图片,那么加载这个界面的时候,就会同时对10个图片资源进行渲染,而如果这10张图片是在同一个图集里面的话,那么就相当于同时只进行了1张相对较大的图片的渲染,这样实时渲染的性能开销会更少,这是一种用空间换时间的一种办法。

大家在学习过程中有可能见过类似这样的一张图片(下图),这其实就是打包图集后图片,接下来我将教大家如何使用TexturePacker工具制作这样图片,并用在Unity3D中。

v2-8ae3554ea0ec43e405fa5293e6e960ab_hd

安装

软件安装部分我就不细说了,正常的安装步骤,我使用的版本是3.0.9,希望大家保持和我一样的版本来学习,这里我放出一个链接,里面包含TexturePacker的安装包和Unity工程所需要的Editor工具,将$TexturePackerImporter.unitypackage导入unity工程即可,导入unitypackage包属于unity基本操作的内容,不在本节讨论范围,小白请看这(导入教程)

安装包及Editor工具链接:https://pan.baidu.com/s/1i6TxRP7
密码:0e4y

界面属性

接下来打开软件:

目前有两种导入图片的方法:

1、 拖拽图片到右边空白处即可完成添加单张图片的操作

2、 拖拽文件夹到右边空白处,即可添加文件夹内所有图片

(建议使用文件夹形式,因为方便管理,不用每次拖拽到界面,甚至可以结合外部程序去管理文件夹)

v2-3047a21a682e406bbc31165d3f6f3762_r

v2-aeb63339513a76468818c71895fcce36_r

以上红框中的内容建议详细了解一下,是比较重要的修改项,将鼠标悬停在上面就会显示每个修改项的详细介绍

v2-49413a0328b6c8823364129f29a6b40c_hd

这里简单讲解一下:

Output

DataFormat:务必选择Uniyt3D

Datafile:打包导出图集数据的路径

Texturefile:保存的图片格式(建议PNG)

Texturefile:打包导出图集图片的路径

Geometry

Maxsize:最大导出尺寸

Sizeconstrains : 尺寸约束,对图集尺寸进行约束,因为unity的对图片的要求是2的次幂最为合适,所以这里建议选择Pot(Power of 2)

Scale:导出比例,意思是原图进行一定比例的压缩

Layout

Allowrotation:是否允许旋转(务必取消勾选,否则导入到游戏中图片会发生旋转)

Layout标签下的前几条属性均与图集的排序,图片的间隔等有关,可以自行测试了解

打包图集

接下来就是正式导出图集了,点击上方工具栏的Publish按钮即可导出(导出前请先设置图集图片和数据导出的路径)导出完成后建议Save保存工程,保存成.tps文件,这样我们的一个图集工程就成功建立起来了!

v2-1683adcb2873fe3f63d58e5a675ce8a7_hd

打包前v2-c2f5a157660aef65518cd14acc05ddaa_hd打包后

以后更新和管理图集的快捷操作:把更新的图片放到对应文件夹里面,打开.tps工程,直接点击Publish按钮导出即可

因为打开的时候会自动重新识别文件夹里面图片并按照之前的属性排序,操作非常方便

导入Unity3d中

把导出的.png和.txt文件导入到unity工程中(两个文件必须在同一目录下),然后右键点击图集数据文件(.txt文件),点击TexturePacker—Process to Sprite即可(此菜单项需要在导入了Editor工具后才会出现)

v2-89086ac9e356015131b9a8af5e223aab_r

使用之后效果如图:

v2-ffdc6df08bb364df99ab937c12c1827c_hd

分割后

这样就可以像使用普通图片一样拖拽使用这些图片了,接下来到底如何使用这些图片将由你决定了!下一节我将写一个Editor工具类,批量引用到一个预制体上,这样我们就能在运行过程中根据图片的名字(或约定的命名约束),动态加载图集中的某一张图片使用,敬请期待!

转载至:qiubs
原贴地址:http://www.cnblogs.com/cnxkey/articles/9743920.html

猜你喜欢

转载自blog.csdn.net/Le_Sam/article/details/84928464