Unite 2016｜Unity 5.x编辑器新功能Frame Debugger

Unity 5.0发布到现在已经有一年多的时间，带来了实时GI、PBR等等新特性，相信大家已经耳熟能详。今天我们Unity官方的技术总监张黎明，将为大家介绍几个不太容易被关注的新功能，但他们可以为大家的游戏研发带来很多的便利之处。

首先来看一下Frame Debugger，它是伴随5.0版本一起发布的新功能。从它的名字可以看出来，这是一个帧调试器，也就是用来调试图形渲染管线的。
如果对图形渲染比较熟悉的工程师应该都知道，过去我们一般会采用第三方的GPU调试工具来调试渲染错误，比如微软的Visual Studio Graphics Debugger, Nvidia的Nsight，AMD的PerfStudio，Intel的GPA等等。这些工具都提供了强大的功能，但是他们也存在一些缺陷，比如独立于Unity Editor使用不便，不能支持所有的开发平台等等。Frame Debugger的出现正是解决了这些不便之处。 下面我们具体来看一下怎么使用Frame Debugger。首先从Editor的Window窗口内选择Frame Debugger菜单，打开Frame Debugger窗口，如下： 

点击Frame Debugger窗口内的Enable按钮，编辑器就会立刻捕捉当前渲染的一帧，并将所有的Draw Call和渲染事件显示到窗口左边的树状结构里面。拖动Frame Debugger窗口最上边滚动条的滑块可以指定当前渲染到哪一个Draw Call，你也可以点击左边树状视图中的任意选项来指定执行到哪一个状态。窗口右边是当前Draw Call的状态信息。

下面我们通过三个案例来展示如何通过Frame Debugger分析Unity的渲染流程。 第一个Demo是分析了UGUI的渲染流程。我们知道UGUI里面可以通过Canvas来管理那些UI元素以合并到一个Draw Call，在同一个Canvas内的UI元素会被优先合并到一个Draw Call里面。通过调整UI元素和Canvas的层级结构之后观察Frame Debugger内的渲染流程可以看到不同的渲染过程。 首先我们把所有UI元素放在Hierarchy窗口的相同层级下，如图所示：这时候启动Frame Debugger，逐个Draw Call查看渲染流程发现，所有三个文本元素都会被合并到一个Draw Call，两个按钮的背景图案也会合并到一个Draw Call。截图是文本元素渲染前后的截图。

如果把5个UI元素分组，其中三个放到一个Canvas，另外两个放到另外一个Canvas，渲染结果会发生变化，修改后的层级窗口截图如下：

经过修改之后会发现三个文本组件已经不在一个Draw Call内完成，而是分配到两个Canvas的渲染队列中执行。首先绘制了左边Button按钮的Text组件，然后右边的两个Text组件是在一个Draw Call内完成的。

第二个Demo分析了使用最简单场景的Forward Rendering执行流程，可以看到动态阴影的渲染过程。

首先是清空当前屏幕，然后渲染一张深度贴图，以备后面的Image Effect等功能使用。

然后渲染Shadow Map, 并在Shadow Map渲染完成之后在屏幕空间内计算出阴影的图案。之后是渲染当前场景，并采样刚生成的阴影图得到完整的光照效果。

Shadow Map：

屏幕空间的阴影图：

场景光照+阴影结果：

最后是渲染天空盒。把天空盒放在最后渲染可以减少GPU的像素填充，提高渲染效率。

 

第三个Demo通过开启Deferred Rendering来观察延迟渲染的执行流程。我们可以看到Unity引擎首先渲染场景信息到GBuffer，GBuffer的信息可以从Frame Debugger窗口的右半部查看。

这里可以看到使用了4个Render Target及深度缓冲区，其中包含光滑度信息、高光信息、Diffuse颜色和法线颜色等。4个Render Target的截图如下：

Diffuse颜色：

高光颜色及粗糙度：

法线颜色：

自发光颜色等：

深度缓冲区：

以上是Deferred Rendering下渲染的GBuffer数据，我们也可以按照以上步骤查看所需的其他信息。

延展阅读

Unite 2016｜社区 团结 分享 感谢与你相逢

详解Unity Profiler内存分析问题

我们稍后会放出Unite上的讲座视频，请关注Unity官方中文社区（forum.china.unity3d.com）。

点击“阅读原文”访问Unity官方社区，下载文中示例工程！