【Unity Shader】实现UGUI下图片的倒影效果

效果如下

 

原理：

        倒影区域也用图片本体，做个镜像翻转（RectTransform中的scale的Y设为-1），然后shader对图片进行处理，达到一个透明度Y方向上渐变的效果。

实现：

        因为是UGUI上使用，推荐直接在内置的UI-Default.shader中进行修改（官网可以下载）。

要达到Y方向上的透明度渐变，可以使用UV坐标中的v作为变化因子，通过一个衰减曲线达到效果，我这里采用的指数函数（Pow），关键代码其实就下面这一句，如下：

color.a *= pow(1 - IN.texcoord.y, _Pow);

_Pow就是调节范围变化：

 

而整体透明度调整可以直接修改RawImage中的Color的Alpha即可（这里就直接修改的顶点颜色）。

完整代码：

Shader "Unlit/UIShadow"
{
    Properties
    {
        [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
        [HideInInspector]_Color ("Tint