【UE4】用UMG控件/HUD渲染3D模型
发表于2016-04-03
你可能知道用UMG控件不能直接渲染3D模型/蓝图/网格（因为UE4.7.4还在更新）。我会尽量详细地解释一下我是如何做到的。以下是我们努力要达到的目标：
最根本的是把3D模型转化为能在UMG控件中使用的2D图片。
听起来不错，但细节更精彩！下面是步骤：
1、创建场景捕捉蓝图
2、生成2D纹理
3、从纹理创建材质
4、在UMG控件中使用材质
你没有读完这篇文章的话，会觉得听起来像一项逆向工程。同时我也把代码发布在了GitHub:
· 准备工作/创建项目
· 这是一个带有UMG控件的UE4项目，UMG控件用来显示你的游戏（比如通常用在HUD中）
· 如果没有UE项目，你跟着这个简单的教程做完之后再回过头看这篇文章。
· 但如果你的项目正如我说的一样，你可以直接跳到场景捕捉创建章节
· 现在我们开始动手吧！
一、创建一个场景捕捉蓝图
开始创建一个蓝图，选择“角色（Actor）”作为父类，命名‘CaptureBlueprint’并打开。
捕获蓝图（ CaptureBlueprint）
我们从创建一个封闭的“房间（room）”开始。 用静态网格组件“Floor_400*400”创建房间。（网格是软件中默认的）。确保BP组件的根基是“房间”真正的地板。你也许在想“为什么我需要建一个盒子？！”。我知道这有些“出乎意料”，但相信我，这么做很有用！这是没有屋顶时候的样子：
既然我们有了“工作室”（我觉得这是一个很酷的名字，后文中都称房间为工作室），我们需要改变墙的颜色。我们将创建一个“蓝色屏幕”，对，特别像拍电影时他们用的那个。
因此，我们需要为这些墙创建材质。我叫它‘StudioMaterial’并进行编辑。从调色器中加入一个常矢量,然后把颜色换一下，避免跟3D模型中的颜色重复（再说一次，这是一个蓝色屏幕）。我选择亮青色，RGBA（0,1,1,0）。
设置颜色为材质的发光色。最后，设置材质的阴影模型为无光。这很重要，因为这个操作会使得我们的工作室不会受3D模型阴影及灯光的影响，只出现一种颜色（我们选择的颜色-青色）。
回到工作室，把我们刚刚创建的材质设为工作室墙的材质。你现在可以在工作室中加入你想在UMG控件中渲染的3D模型/网格了！我没有时间去找好玩的模型来渲染，所以我选择一个默认的网格（SM_MatPreviewMesh_02）。确保它在工作室中（至少是你想看到的部分需要在工作室中），如必要，可以放大工作室模型。
然后给蓝图加摄像机，试着把它放在模型前面来渲染，这样摄像机才能看到它。
最后，为摄像机添加场景捕捉2D组件。之后会用这个组件来把摄影机拍到的渲染成2D纹理。
我们工作室的最后一步，我们为蓝图增加光源。我在模型前插入光源并把光源值设为默认值。你也可以增加多个光源，调整值并放置于任意一个地方。如果你不想加光源，你的画面会非常暗（但也许是你想要的效果，我不清楚！）。
现在你可以放轻松了，我们已经完成了很难的部分。剩下的都很容易搞定啦，就像我的初恋女…（友）一样。不，当我没说哈哈。
二、生成2D纹理
现在我们需要用场景捕捉组件来保存捕捉到的东西。首先我们需要在项目中创建一个2D纹理渲染器，被称作“目标纹理渲染”。
编辑并根据需要调整“Size X”和“Size Y”的值。注意默认的是256*256。这些值会影响UMG渲染的效果。现在我选择最大值2048*2048。
现在回到我们说的“蓝图捕捉”，把它设置为场景捕捉组件中的目标纹理并保存。就这样，摄像机捕捉到的画面将被保存成2D纹理。
三、从纹理中创建材质
现在我们将通过移除蓝色背景（即你为工作室墙壁设置的颜色）把我们捕捉到的2D纹理变成我们在UMG中可以用到的材质。
首先，创建新的材质，命名为‘CapturedMaterial’，保存并编辑。设置混合模式为”半透明“，因为我们需要透明度（如果你想知道更多的话，请参考：维基中介绍了混合模式对于虚幻引擎的意义）然后设置阴影模式为“无灯光（Unlit）“,这样能确保HUD中任何动态的光都不会对它造成更改。
完成之后，记着勾选设置中的“Usage(用法)“面板中的”使用UI（Used with UI）“,如果不选的话，将不能在UMG控件中使用这个材质。
好了，在材质中加入纹理样本，并将这个纹理在设置面板中设置为你的“目标纹理渲染“。
关联纹理到材质的‘发光颜色’。
现在我们将工作室背景色调成透明，因此，在HUD中仅有模型可见。
在调色器中加入常矢量3并改变颜色为你所用的墙的颜色-记住我用的颜色RGBA为（0,1,1,0）。
然后加入必要的元素使得材质看起来像这样（‘0’,‘1’是简单的常量元素）：
别忘记设置If组件的常量B。如果你之后注意到渲染时，你的模型边界是青色的，那么调整常量B的值。（值越高，蓝色就会变得越透明，但值太大的话，你模型的一些部分会消失）。
这是使得背景色透明化的简单方法。我觉得这个方法直接有效。
保存。好了，我们的材质做完了。
四、在UMG控件中使用材质
既然我们在UMG中有可以使用的材质，那么…对，就让它派上用场吧！
在3D模型出现的地方编辑UMG控件并在模型出现的地方增加图片组件。如图所示。我简单地添加它到基本的画板中。
调整它的大小，我的是256*256。
然后，在笔刷下面的外观面板，设置“捕获材质“为图片。
编译并保存。
最后一步，我们需要添加捕获蓝图到我们的地图中，因为如果蓝图不显示的话，便捕捉不到任何东西。放置捕获蓝图以至于玩家压根感受不到它的存在（一般放置于外面或者地图的下面）
注意当你选择有摄像机的蓝图时，将出现小窗口来显示摄像机所看到的场景。
保存点击运行，然后好好欣赏：你的模型其实是在HUD中渲染。注意模型的边界有点青色是因为工作室墙的反光。如果你也出现了这个情况，你可以通过在捕获蓝图中添加光源来改善，或调整模型材质的光滑度。
好了，我们已经在UMG中渲染出了3D模型！目前它除了站在那儿没干别的，但毕竟它只是蓝图，你可以赋予它所有的动作和功能。我不知道为什么一个好的带有实际特效的比如变为红色时会有蒸汽3D模型不是一个好模型？如果你需要，整个项目可以在GitHub上找到，请放心使用。
五、总结
我必须承认这个方法比起真正完美的解决方案只是一个权变措施，我知道要想做到完美还需要更多的调整。但在UMG完善这个功能前，这个方法确实是可行的。
原文作者：Tolc
原文链接：https://engineunreal.wordpress.com/
加入GAD的核心用户QQ群：484290331，各类活动奖励任你拿，最新资讯任你读，众多教学任你免费学，如此好地方赶紧加入吧！另VR专属群：476511561，专业VR技术分享，专业导师指导为你答疑解惑，大型小型活动奖励等你拿，免费学习赚奖励的天地，欢迎你加入哟！