關於 RenderTexture 半透明粒子特效無法顯示以及後續各類神奇問題的終極解決方案（大概）

前言

RenderTexture 真是令人又愛又恨，實際用到項目中是問題是一波接着一波地來啊！

以下是在 Unity 中與它鏖戰數月的經驗……都在這裏了！收下吧！！這是我最後的總結了！！！

RenderTexture 通常用來將 3D 模型轉爲 2D圖片，從而在UI中使用，一般會用來做人物、裝備、物品預覽界面。

 

問題一、震驚！粒子特效在 RenderTexture 中無法顯示！

這裏首先我們想用 RenderTexture 顯示個球，這裏 RenderTexture 相機背景色設透明，場景主相機背景灰色：

然後在球邊上加個簡陋的粒子特效：

發現 RenderTexture 裏的粒子特效根本不顯示！還是隻有個球！

什麼？！ 大名鼎鼎，如雷貫耳的 RenderTexture 竟然連如此簡陋的粒子特效都顯示不了？真是天大的笑話！

發現粒子其實是隻在球體範圍內顯示，我們把球的顏色換成黑色，粒子多一點，可以看得更清楚：

RenderTexture 相機背景色設爲透明後，似乎就把模型周圍的所有像素剔除了，這該如何是好？

解決方案： 這一切都是 ColorMask 的錯！

我們將官方 Particle Add/Blend Shader 進行改造，將 ColorMask RGB 改爲 ColorMask RGBA 即可。以下是改後的 Shader，想用可自取：

Shader "Custom/Additive For RT"
   {
    Properties {
        _TintColor ("Tint Color", Color) = (0.5,0.5,0.5,0.5)
        _MainTex ("Particle Texture", 2D) = "white" {}
    }

    Category {
        Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "PreviewType"="Plane" }
        Blend SrcAlpha One
        ColorMask RGBA
        Cull Off Lighting Off ZWrite Off

        SubShader {
            Pass {

                CGPROGRAM
                #pragma vertex vert
                #pragma fragment frag
                #pragma target 2.0

                #include "UnityCG.cginc"

                sampler2D _MainTex;
                fixed4 _TintColor;

                struct appdata_t {
                    float4 vertex : POSITION;
                    fixed4 color : COLOR;
                    float2 texcoord : TEXCOORD0;
                    UNITY_VERTEX_INPUT_INSTANCE_ID
                };

                struct v2f {
                    float4 vertex : SV_POSITION;
                    fixed4 color : COLOR;
                    float2 texcoord : TEXCOORD0;
                    UNITY_VERTEX_OUTPUT_STEREO
                };

                float4 _MainTex_ST;

                v2f vert (appdata_t v)
                {
                    v2f o;
                    UNITY_SETUP_INSTANCE_ID(v);
                    UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(o);
                    o.vertex = UnityObjectToClipPos(v.vertex);
                    o.color = v.color;
                    o.texcoord = TRANSFORM_TEX(v.texcoord,_MainTex);
                    return o;
                }

                fixed4 frag (v2f i) : SV_Target
                {
                    fixed4 col = 2.0f * i.color * _TintColor * tex2D(_MainTex, i.texcoord);
                    col.a = saturate(col.a); // alpha should not have double-brightness applied to it, but we can't fix that legacy behaior without breaking everyone's effects, so instead clamp the output to get sensible HDR behavior (case 967476)

                    return col;
                }
                ENDCG
            }
        }
    }
}

然後粒子便出現在了 RenderTexture 中……

 

問題二、可怕！半透明物體在 RenderTexture 中顏色竟然不正確！

之前 RenderTexture 中的粒子似乎帶有黑暗的氣息！顏色和原來的有區別，難道是我的錯覺？

突然想做個實驗，觀察其他半透明物體是否變色……就再加一個半透明的黃色方塊吧：

（左：相機直接照射的畫面       右：轉爲RenderTexture的畫面）

這……這不對吧！！！！

一個好的 RenderTexture 應該老老實實還原原本相機的畫面纔是吧！你怎麼能這樣呢？！！

解決方案：這一切都是預乘的錯！

預乘不瞭解的可自行百度，下面說解決步驟：

1、RenderTexture 相機背景色設爲黑色，透明度爲0。

2、將官方 UI Image Shader進行改造，Blend 方式改爲 Blend One OneMinusSrcAlpha。以下是改後Shader，想用可自取：

Shader "Custom/MyRenderTexture"
{
    Properties
    {
        [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
        _Color ("Tint", Color) = (1,1,1,1)
        _Alpha("Alpha", Range(1,5))=1
        _StencilComp ("Stencil Comparison", Float) = 8
        _Stencil ("Stencil ID", Float) = 0
        _StencilOp ("Stencil Operation", Float) = 0
        _StencilWriteMask ("Stencil Write Mask", Float) = 255
        _StencilReadMask ("Stencil Read Mask", Float) = 255

        _ColorMask ("Color Mask", Float) = 15

        [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ("Use Alpha Clip", Float) = 0
    }

    SubShader
    {
        Tags
        {
            "Queue"="Transparent"
            "IgnoreProjector"="True"
            "RenderType"="Transparent"
            "PreviewType"="Plane"
            "CanUseSpriteAtlas"="True"
        }

        Stencil
        {
            Ref [_Stencil]
            Comp [_StencilComp]
            Pass [_StencilOp]
            ReadMask [_StencilReadMask]
            WriteMask [_StencilWriteMask]
        }

        Pass
        {

        Cull Off
        Lighting Off
        ZWrite Off
        ZTest [unity_GUIZTestMode]
        Blend One OneMinusSrcAlpha
        ColorMask [_ColorMask]

        CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #pragma target 2.0

            #include "UnityCG.cginc"
            #include "UnityUI.cginc"

            #pragma multi_compile __ UNITY_UI_CLIP_RECT
            #pragma multi_compile __ UNITY_UI_ALPHACLIP

            struct appdata_t
            {
                float4 vertex   : POSITION;
                float4 color    : COLOR;
                float2 texcoord : TEXCOORD0;
                UNITY_VERTEX_INPUT_INSTANCE_ID
            };

            struct v2f
            {
                float4 vertex   : SV_POSITION;
                fixed4 color    : COLOR;
                float2 texcoord  : TEXCOORD0;
                float4 worldPosition : TEXCOORD1;
                UNITY_VERTEX_OUTPUT_STEREO
            };

            sampler2D _MainTex;
            fixed4 _Color;
            fixed4 _TextureSampleAdd;
            float4 _ClipRect;
            float4 _MainTex_ST;
            half _Alpha;

            v2f vert(appdata_t v)
            {
                v2f OUT;
                UNITY_SETUP_INSTANCE_ID(v);
                UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT);
                OUT.worldPosition = v.vertex;
                OUT.vertex = UnityObjectToClipPos(OUT.worldPosition);

                OUT.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);

                OUT.color = v.color * _Color;
                return OUT;
            }

            fixed4 frag(v2f IN) : SV_Target
            {
                half4 color = (tex2D(_MainTex, IN.texcoord) + _TextureSampleAdd) * IN.color;

                #ifdef UNITY_UI_CLIP_RECT
                color.a *= UnityGet2DClipping(IN.worldPosition.xy, _ClipRect);
                #endif

                #ifdef UNITY_UI_ALPHACLIP
                clip (color.a - 0.001);
                #endif

                return color;
            }
        ENDCG
        }
    }
}

最後的結果……還原度似乎好了許多！不過好像有點……亮？

好像確實亮了點……不過很不幸的是，目前沒有其他好的辦法了，若您有更好的辦法請在屏幕下方留言！

 

問題三、悲哀！RenderTexture 圖像居然有黑邊！

再次回到起點，讓我們來仔細觀察一下：

爲什麼會有黑邊！該如何解決？！

解決方案：這一切都是相機背景色的錯！

不信你可以試試換個粉色背景色：

解決的話有兩種辦法：

1、照搬問題二的解決辦法即可：

2、提高 RenderTexture 的分辨率，分辨率最好和 UI Image 的長寬一致：

 

問題四、恐怖！Canvas Group 調整 Alpha 值後 RenderTexture 圖像突然過曝！

有時候我們會用 Canvas Group 來做 UI 漸變特效，通常是調整 Alpha值：

對，就是上面這玩意兒，然後你會發現，此時你的 RenderTexture Image 會變成這樣：

這究竟是怎麼回事啊啊啊！爲什麼變成這麼亮了？曝光過度了嗎？！我只是想讓它好好的變透明然後消失而已！怎麼會有這麼多問題啊！！RenderTexture 到底是誰發明的啊啊啊？？！

冷靜……冷靜……

解決方案：這一切都是 IN.color 的錯！

我們將官方的 UI Shader 再次改造一下，將 * IN.color 改爲 * IN.color.a，我們只要透明度，其他東西別來搗亂！

以下是改後的 Shader，想要可自取：

Shader "Custom/MyRenderTexturePlus"
{
    Properties
    {
        [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
        _Color ("Tint", Color) = (1,1,1,1)
        _Alpha("Alpha", Range(1,5))=1
        _StencilComp ("Stencil Comparison", Float) = 8
        _Stencil ("Stencil ID", Float) = 0
        _StencilOp ("Stencil Operation", Float) = 0
        _StencilWriteMask ("Stencil Write Mask", Float) = 255
        _StencilReadMask ("Stencil Read Mask", Float) = 255

        _ColorMask ("Color Mask", Float) = 15

        [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ("Use Alpha Clip", Float) = 0
    }

    SubShader
    {
        Tags
        {
            "Queue"="Transparent"
            "IgnoreProjector"="True"
            "RenderType"="Transparent"
            "PreviewType"="Plane"
            "CanUseSpriteAtlas"="True"
        }

        Stencil
        {
            Ref [_Stencil]
            Comp [_StencilComp]
            Pass [_StencilOp]
            ReadMask [_StencilReadMask]
            WriteMask [_StencilWriteMask]
        }

        Pass
        {

        Cull Off
        Lighting Off
        ZWrite Off
        ZTest [unity_GUIZTestMode]
        Blend One OneMinusSrcAlpha
        ColorMask [_ColorMask]

        CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #pragma target 2.0

            #include "UnityCG.cginc"
            #include "UnityUI.cginc"

            #pragma multi_compile __ UNITY_UI_CLIP_RECT
            #pragma multi_compile __ UNITY_UI_ALPHACLIP

            struct appdata_t
            {
                float4 vertex   : POSITION;
                float4 color    : COLOR;
                float2 texcoord : TEXCOORD0;
                UNITY_VERTEX_INPUT_INSTANCE_ID
            };

            struct v2f
            {
                float4 vertex   : SV_POSITION;
                fixed4 color    : COLOR;
                float2 texcoord  : TEXCOORD0;
                float4 worldPosition : TEXCOORD1;
                UNITY_VERTEX_OUTPUT_STEREO
            };

            sampler2D _MainTex;
            fixed4 _Color;
            fixed4 _TextureSampleAdd;
            float4 _ClipRect;
            float4 _MainTex_ST;
            half _Alpha;

            v2f vert(appdata_t v)
            {
                v2f OUT;
                UNITY_SETUP_INSTANCE_ID(v);
                UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT);
                OUT.worldPosition = v.vertex;
                OUT.vertex = UnityObjectToClipPos(OUT.worldPosition);

                OUT.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);

                OUT.color = v.color * _Color;
                return OUT;
            }

            fixed4 frag(v2f IN) : SV_Target
            {
                half4 color = (tex2D(_MainTex, IN.texcoord) + _TextureSampleAdd) * IN.color.a;

                #ifdef UNITY_UI_CLIP_RECT
                color.a *= UnityGet2DClipping(IN.worldPosition.xy, _ClipRect);
                #endif

                #ifdef UNITY_UI_ALPHACLIP
                clip (color.a - 0.001);
                #endif
            
                return color;
            }
        ENDCG
        }
    }
}

這纔是 Alpha = 0.2 的樣子嘛！

 

問題五、拒絕！新的風暴還沒出現！

暫時到這了，以後有碰見新問題還會繼續寫……

 

參考文章：

無數篇，記不清了……