Fairygui优化教程（一）分享向

前言

大家好，我在最近的工作中遇到了大量的Fairygui的优化需要，但是事与愿违，没有在网络上找到一个解答相对简单直接并且全面的教程，于是我就想把自己在工作中积累的优化经验分享给大家。本次教程基于的是新版的Fairygui，不用担心版本过久。如有错误，请在评论区指出，非常感谢。

基本原理

我目前工作中使用的是Untiy开发，Fairygui优化本质上就是UGUI优化，不过Fairygui做了一些改进，将UGUI中很多需要手动操作的部分自动化了，所以相比而言更加抽象，也更简单了。

简而言之，如果有两个元素，他们之间的可视部分没有重叠，并且使用了同一个材质，并且他们的缩放，旋转，倾斜以及透明度都相同，那么在绝大多数情况下，都可以认为这两个元素是可以合批的。那么，在Untiy中，我们要如何判断一个UI界面的合批情况呢，又如何判断刚刚做的优化操作是否有作用呢？

这里，我们就要用到了Unity中提供的一些工具。

开启项目，点击右上角的Stats，就会弹出这样的弹窗，注意左侧中间的Batches，它就代表了当前这个页面的合批次数，越少越好，越多界面就会越卡。

除此之外，我们还要一个能够查看合批详细信息的串口，FrameDebug工具。通过Windows->Analysis->Frame Debugger打开。

进入之后，点击Enable，你就能知道这个界面有哪些元素是合批的了，

这种标志意味着着出现合批了，其他情况可以视作没有合批。我们要做的就是让合批的情况尽量多。

列表的优化

列表优化是相对而言基础的，针对列表的优化，我们要注意以下几点：

• 列表项的组件中，元素的大小最好不要超过组件的大小，如果超过了，那么列表项之间的空隙就要留大，防止列表项之间相互覆盖无法合批。同理，列表项之间的间距不要小于0。
• 列表项组件，最好不要设置溢出处理为 隐藏,而是
  
  溢出隐藏就相当于设置了遮罩，套用UGUI中优化方法，遮罩之间是很难合批的。所以最好要减少这里遮罩出现的情况。
• 如果一个列表中，元素的数量是有限且较少的，比如说0~4个，那么就可以设置该列表的溢出处理为可见，注意,亲测，如果在列表项中再嵌套一个列表，最好设置溢出处理为可见，否则该子列表就无法和其他列表项中的子列表合批。应用场景：某个活动，先分几个列表项用于表示几个活动奖励挡位，其中再添加一个展示奖励的列表。

注意材质

上面讲到，两个元素要合批，必须材质相同，下面就是几点材质相关的细节：

• 包的分类，两个图片只有使用同一个图集的时候才有可能合批，Fairgui基本是按功能分包，注意要将常用的模块单独分包，尽量让诸如道具Icon之类的图片集中在同一个图集中。
• 基础属性：透明度，旋转，倾斜。注意，需要合批的元素前面三个属性必须相同，不过如果是重复出现的元素，最好是默认透明度，不旋转，以及不倾斜，不然就要使用一些特殊手段，这里在后面会说，比较麻烦。
• 有时候我们会在FrameDebugger中看到一些元素，明明没有合批，但是不显示不合批的原因，那么我猜跟上面的几个属性有较大关联。如果想要看看具体的材质，直接在Hierarchy中找到对应的元素，直接看材质。

主动出击

• 我们需要注意一点，Fairgui并不是一个只有程序员操作的软件，美术甚至策划都会深度参与。他们在初期操作的时候基本上不会考虑复杂度以及后期优化的问题。所以往往会有一些比较隐藏的问题，很难找到。
• 动效就是其中之一，Fairgui中动效可以改变一种属性，叫做Alpha,为0表示透明，为1表示完全不透明。重点来了，Alpha=0时，Unity仍然认为这个组件是可见的，于是，这个组件就在你看不见的情况下和其他组件重叠，导致你完全无法合批… 解决办法就是，给设置Alpha的组件增加Visible动效设置，如果一个组件Alpha=0,那么就干脆将它设置不可见。
• Unity的Hierarchy是个好帮手，你可以在Stage->GRoot下浏览你的UI界面，和Fairgui编辑器中组件对比，查看哪些组件明明没有显示，但是在Unity属性面板中是可见的，这往往就是不合批的凶手。另外提一嘴，在Fairygui中，这个不可见标识表示真正的不显示
  
  而下面这个
  
  仅仅表示在Fairygui中不显示。

创建列表，强行优化

如果上面的方法你都行不通，那你有可能遇到了这种问题，在一个界面中，有多个重复的复杂组件，每个组件内部有可以和其他组件内部相合批的元素，但是被打断了，Unity可能渲染了第一个组件中的图片1，然后渲染第二个组件中的文字，然后才渲染第二个组件中的图片。明明是两个材质相同的元素，却不能合批，该怎么办呢？

方法就是把这个图片单独抽出来，要么直接和复杂组件放在同一个父节点下，要么在上方再创建一个列表，单独显示这个图片，这样就等于手动调整了渲染顺序，Unity渲染该列表时，畅通无阻，直接合批。
具体的操作方法可以参考Fairygui优化指南

在某些情况下，我们可以只调整Fairygui编辑器中元素的顺序就解决这个问题，比如说，我们看见FrameDebugger中一堆图片合批，中间参杂着文本，这些文本可能就是被放在了图片中间，那么我们调整一下Fairgui中元素的顺序，将文本集中放在上边，可合批的图片集中放在下面一起，被打断的合批问题有可能就解决了。

结语

Fairgui还有一些优化的技巧和经验，那么第一期就先到这里，如果后面工作积攒了一些有用的方法，我会继续分享，希望这篇文章对你有所帮助，谢谢。