1.背景

这几天玩了一个美术表现不错的游戏，忍不住想扒点模型资源和效果。

直接用UnityStudio解包拿到fbx。
但是一起解压出来的三张贴图，一张普通贴图，一张法线，还有一张就难住我了。

这个绿色的是什么用处的，在群里问了一圈小伙伴也表示不知道？

没有什么头绪，那就只好用GPU分析软件来调试。

上一次用GPU分析软件还是2年前了，用的是Mali的MGD，需要搭配Root的手机。
现在手上只有一台自用红米Note8，没有Root，于是本次使用群大佬推荐的RenderDoc。
本文转自https://huutu.blog.csdn.net/article/details/111659729

RenderDoc之前我只在PC上用过，没想到对Android支持也如此完善，有多完善，往下看就知道。

2.目标

这次分析，主要解决3个疑问：
1.美人鱼的三张纹理中，绿色的那张是什么用途？
本文转自https://huutu.blog.csdn.net/article/details/111659729
2.游戏中bloom的方式

3.冰冻特效如何制作

3.RenderDoc调试分析基础

官网：https://renderdoc.org/

GameDevTools已经集成，搜索 RenderDoc即可下载运行。
GameDevTools是一套游戏开发常用工具集，输入关键词即可找到想要的工具。
目前托管在Github：https://github.com/ThisisGame/GameDevTools

安装后打开，界面如下：本文转自https://huutu.blog.csdn.net/article/details/111659729

3.1 连接Android手机(无需root)

手机开启调试模式，打开AndroidStudio看logcat是否正常输出Log，确认连接OK。

点击RenderDoc左下角，切换到手机进行连接。
本文转自https://huutu.blog.csdn.net/article/details/111659729
选择手机之后，会通过adb，往手机上安装一个RenderDocCmd的插件app，然后启动。

RenderDocCmd hook了Android的 gles渲染接口，然后将数据回传到PC端的RenderDoc。

上图表示正在启动手机上的RenderDocCmd。

上图表示手机上的RenderDocCmd已经启动成功，可以开始调试了。

同时，你的手机上应该是这样的：

3.2 调试目标游戏

本文转自https://huutu.blog.csdn.net/article/details/111659729
按上图选择目标游戏启动Activity。

选择好之后，手机会断开连接。
重新选择手机连接。

点击Launch按钮，开始调试目标游戏。
一般都会收到下图错误。

这是因为，目标游戏是打的Release模式APK，而不是Debug模式的。

那怎么办呢？
不要急，RenderDoc为我们提供了一键重新打包服务。

来一番骚操作。

首先，选择另一个游戏，然后Launch，应该也是上面的错误。
然后再选择目标游戏。

这样来回选择，直到选择目标游戏的时候，出现下图的提示。

本文转自https://huutu.blog.csdn.net/article/details/111659729

点击黄色区域，就会自动对选中的游戏进行重新打debug包了。

重新打包完成之后，再次点击 Launch，这次一定成功，目标游戏在手机上自动运行起来了。

RenderDoc界面也发生了变化。

点击箭头所指按钮，即可截取当前帧所有渲染事件。

截取的这一帧数据，显示在列表区域中。

此时截取的这一帧数据，仍然保存在手机上，一旦手机断开，就不可用。
所以最好立即保存到电脑磁盘中。 对封面图片右键，选择
save，然后找个地方存起来。

双击封面图片，打开详细Drawcall列表。

左侧列表中，就是每一次Drawcall。
中间的大图默认就是当前Drawcall后的效果。
右边的小图是输入输出。本文转自https://huutu.blog.csdn.net/article/details/111659729

和Unity的FrameDebuger类似，其实所有的GPU分析工具都差不多。

4.RenderDoc分析具体场景

下面使用RenderDoc来分析开始提到的3个问题。

4.1 美人鱼的三张纹理中，绿色的那张是什么用途？

在RenderDoc中开始调试目标游戏，玩一会儿游戏，等到出现美人鱼的时候，截取一帧数据进行分析。
在左侧渲染事件窗口，鼠标单击，找到渲染美人鱼模型的地方。

当前界面示意如上图。
右侧Inputs纹理列表，表示当前提交的纹理资源，以及shader变量名字。
从变量名字，就可以看出这个纹理的作用。

绿色的纹理，传递到shader的MetallicGlossMap变量，说明这是一张金属光泽的贴图。

其他贴图名称及作用
BumpMap 凹凸贴图(用来呈现衣服褶皱之类的凹凸效果
AlphaMask 不透明度贴图(可以让你的服装呈现半透明状态)
MetallicGlossMap 金属反光度贴图(影响质感跟光泽度显示的一张贴图)

这个名称很熟悉，在Unity Standard Shader里，就有。
那么不管目标游戏是不是用Unity Standard Shader，我这里就先用了。

将绿色贴图，拖到 Metallic里。
效果如下:

4.2 游戏中bloom的方式

Bloom 俗称全屏泛光，就是物体周围有一层光晕的效果，其实就是近视眼不带眼睛看灯的感觉。
本文转自https://huutu.blog.csdn.net/article/details/111659729
简单介绍Bloom就是，先普通渲染一次，然后渲染亮度高的物体一次并进行若干次高斯模糊，然后将两次渲染结果混合。

对目标游戏截取一帧进行分析。

步骤1：将普通渲染结果输出到Texture，将其作为输入，计算出较亮部分，输出到Texture。

具体是怎么实现的呢，切换到渲染流水线选项卡 Pipeline State。

后期特效都是在FS中完成，所以这里查看fs shader代码即可。
按图中，第4步，点击Edit查看fs shader代码。
继续按照上面步骤1的方式，对左侧列表渲染事件进行查看。
总结Bloom步骤如下：

最终效果

4.3 冰冻特效如何制作

步骤和上面一样，在游戏中出现冰冻效果时，截取一帧。
找到冰冻效果最开始的EID 1684，按顺序分析。

值得注意的是，这里输出到FBO 尺寸比我的手机尺寸小，这是游戏自动降低画质了。

总结步骤如下：本文转自https://huutu.blog.csdn.net/article/details/111659729

如果要还原效果，就参考Pipeline中给的Shader，在Unity里重写一遍就好。

5.总结

掌握一点OpenGL基础之后，就可以尝试去分析其他游戏的渲染流程，扶着鹰酱过河。RenderDoc又给我们提供了极大的便利，调试其他游戏更加方便，实乃学习必备神器。

renderdoc可以用来捕获帧渲染情况，排查一些GPU渲染、资源规格等问题。

下面讲述一些该软件连接真机调试使用。

一、下载安装renderdoc

软件的下载地址：https://renderdoc.org/可直接点击下载即可。该软件是开源免费的，不用破解。

下载后直接安装即可使用。

二、打开使用renderdoc

打开界面后，默认的界面布局如下图所示，（这里我已经设置了黑色主题，可以忽略这点），renderdo中主要的窗口有Texture Viewer（纹理查看器）、Event Browser（事件浏览器）、API Inspector（API检查器）、Timeline Bar（时间轴）、Pipeline State（管道状态）、Mesh Viewer（网格查看器），后续会对这几个主要窗口功能进行介绍。

renderdoc可以启动电脑上的EXE应用程序以及移动机器上的app。启动EXE文件就比较简单，

在launch Application窗口下，填入Executable Path参数，点击如下图的按钮打开window文件窗口，然后选择需要启动的exe应用程序，最后点击Launch按钮即可启动程序。

下面讲一下如何启动Android端的app，目前renderdoc应该是不支持iOS的。

renderdoc连接Android设备调试的步骤：

注意:测试的目标apk要是开启debug模式的包才能连接

（1）、使用USB连接上Android移动手机；

（2）、Android机器上设置为开发者模式，并开启允许USB调试

（3）、在renderdoc界面的左下角下面点击Replay Context：Local，会弹出一个列表，一个是你连接上的Android机器，local是本地电脑的。我们这里选择Android机器选项。

选择后，右边会有一行文本提示:Remote server ready，说明远程连接已经成功。

同时你的手机上还会显示安装一个renderdoc的调试程序，点击允许安装即可。安装后，手机上会打开运行一个绿色的renderdoc的主界面，说明已经成功了，退出即可。

（4）、连接成功后，将手机上的apk包加入到Executable Path中。然后点击Launch启动app即可。（在弹出的窗口中，显示了手机上所有已经安装的包列表，如果你觉得包很多，找起来不方便，可以在【3】这个地方输入你的debug包名进行搜索能快速找到目标程序。）

（5）、启动成功后，界面会变成如下图所示，并且手机上会启动目标app。此时手机上可以正常跑你的app功能了。

（6）、抓帧操作，点击capture frame immediately后，下面的列表中会出现一幅图片，双击图片就可以加载到刚刚抓取的这一帧GPU渲染的所有内容了。

容易遇到的问题：

（1）在点击Launch启动时，容易出现如下的报错。

排查步骤：

先根据提示打开diagnostic log窗口查看一下报错的原因；点击【window】——【Diagnostic Log】

在log窗口中，我们看到了有红色的报错，

这时可以尝试重新连接或者重启renderdoc看看。我这边重启renderdoc并重新连接就可以了。

renderdoc连接unity调试的步骤

1、在unity中启动后，在game窗口中右击选择Load Renderdoc

2、 启动游戏，在game窗口下右边的小人头按钮。点击后，会启动renderdoc软件（前提是要按照了renderdoc）。

3、启动后，会发现renderdoc里面有个localhost的连接窗口，说明连接unity成功了。测试正常跑游戏，跑到目标测试界面后，点击renderdoc里面的Capture Frame Immediately进行抓帧。

4、抓帧后，会在Captures collected下显示该界面的图片，鼠标点击该图片进行数据加载，加载完后的界面图下所示：

二、Renderdoc布局

renderdoc的布局是可以自定义的，可以根据我们自己的使用习惯来自行排版，这里我就不多少，这里我介绍几个重要的窗口。

Texture Viewer（纹理查看器）：纹理查看器可以查看所有输入、输出的纹理，包括pvrtc, 纹理分片和表面。

纹理查看器列表，在文理查看器中，列出了所有捕获了的纹理。

选中点击某一个纹理，在中间的展示中显示该纹理的资源图片。

在图片中右击后，会在pixel context里面显示该部分的局部像素内容。

寻找要 debug 的 pixel 和 drawCall。可以通过线选择要debug的pixel，然后通过pixel history快速定位到要debug的drawCall

在renderdoc中查看某一帧的纹理名字，操作如下动图所示。左边定位是那一帧，右边显示该帧的纹理渲染情况，最右边的input窗口下会显示这一阵所有包含的所有纹理列表，并且有显示纹理的名字，这对于我们查看定位纹理提供了帮助。

Pipeline State窗口

pipeline窗口可以查看管道渲染状态，在窗口中有一条链状顺序图，其中我们常用到的有VS、PS两个，分别表示定点着色器和像素着色器。如下动图，在定位某一个drawcall后，来到pipeline窗口中，选择VS查看定点着色数据情况，窗口里面列出所有该drawcall下的shader文件，贴图资源（如果没有显示的话就点一下【show Unused Items】按钮显示出来），如果想查看shader的话，可以点击view或者edit按钮查看shader的代码内容。

在PS像素着色其中，可以看到某一帧所加载的纹理列表，列表有有纹理的名字，纹理的类型，纹理的长宽尺寸，format（纹理压缩格式）。通过长宽可以粗略计算纹理的在内存的大小范围，公式是：（长*宽）/(1024*1024)/(32/8)，之所以说是粗略，是因为考虑到纹理有些会使用到纹理压缩，如果使用了压缩，那么实际的大小肯定会小于这个估算的结果的。

点击Resource下的资源后面的链接图标按钮，会切到Parameter Inspecter窗口，在Parameter下会显示该纹理资源的属性信息，其中有名字以及该在内存中的大小。可以使用这种方式准确查看纹理的大小情况。

Mesh View：查看模型网格、顶点信息

这个功能主要查看当前帧先模型的网格、顶点信息可以查看模型上每个顶点的位置和进行空间转化后的顶点位置信息。

结语：

renderdoc的工具能够查看某一帧的渲染情况，包括纹理情况、网格情况、渲染时间、一帧的渲染过程等内容。

通过renderdoc，可以查看到场景具体的纹理、shader等内容，这对于问题的排查定位很有帮助，其中纹理可以在着色器里面查看具体的名字和在属性窗口中查看纹理的具体大小，shader可以查看到具体的代码内容且可以进行编辑。

同时renderdoc可以查看每一帧的drawcall调用情况。当然，renderdoc的功能远不止这些，不过鉴于笔者的水平问题，就先展开讲述这么多，后续等笔者学习到更加深入的内容再做补充。