Unity，原始图像上的菲涅尔着色器答案

【问题标题】：Unity, fresnel shader on raw imageUnity，原始图像上的菲涅尔着色器
【发布时间】：2019-09-18 12:54:43
【问题描述】：

您好，我正在尝试将下图中的效果存档（就像发光但仅在原始图像之上）不幸的是我不知道怎么做，从资产商店尝试了一些着色器和资产，但到目前为止没有人工作过，我对着色器也不太了解。

原始图像是一个 ui 元素，并呈现由相机捕获的渲染纹理。

我在这里完全迷失了，任何形式的帮助都将不胜感激，如何产生这种效果？

【问题讨论】：

这不只是标准的边缘高光吗？也许修改为 alpha 边缘高光？

标签： user-interface unity3d shader

【解决方案1】：

菲涅耳着色器使用表面法线和视图向量之间的差异来检测哪些像素面向观察者，哪些不是。 UI 平面将始终面向用户，因此没有运气。

使用着色器解决这个问题可以通过两种方式完成 - 您可以烘焙外部边缘的想象“曲率”的法线贴图 (example)，或者创建有符号距离场 (example)，或者一些类似的方法将距离映射到边缘。法线贴图可能会允许最复杂的效果，我相信一些菲涅尔着色器也可以使用它。但是，它确实需要您制作形状模型并从中烘焙法线。

另一方面，可以使用脚本从图像生成带符号距离场，因此如果您有很多图像，这可能是最快的方法。在着色器中实时获取边缘距离不会真正起作用，因为您必须对大量相邻像素进行采样，这可能会使着色器慢 10-20 倍，具体取决于您需要边缘的厚度。

如果您不需要图像那么动态，那么也许只是在 Photoshop 中创建一个内部发光的黑色/白色纹理并使用附加着色器覆盖它会更适合您。如果你不知道怎么写着色器，那上面的两种方法可能有点高。

【讨论】：

如果精灵的轮廓来自 alpha 通道（而不是只是四边形的边框），那么您也可以尝试即时计算这些轮廓，对较低的 mips 进行采样等。它可能看起来不太好，但是基于 sdf 的解决方案也不会有那么好的“高斯模糊”方面，它实际上看起来就像 Photoshop 中的“精确”内发光模式。
对较低的 mip 级别进行采样并不是一个坏主意，也许将其与附近样本之间的平均值/高斯模糊相结合可能会起作用。