そろそろShaderをやるパート93 -URP編- 半透明同士の重なりをきれいに表示する

そろそろShaderをやります

そろそろShaderをやります。そろそろShaderをやりたいからです。
パート100までダラダラ頑張ります。10年かかってもいいのでやります。
100記事分くらい学べば私レベルの初心者でもまあまあ理解できるかなと思っています。

という感じでやってます。

※初心者がメモレベルで記録するので
　技術記事としてはお力になれないかもしれません。

下準備

下記参考
そろそろShaderをやるパート1　Unite 2017の動画を見る(基礎知識～フラグメントシェーダーで色を変える)

URP対応のためにUnityHubからプロジェクトテンプレート選択画面でURPを選択しました。

バージョン

Unity 2022.3.6f1
Universal RP 14.0.8

デモ

半透明のShaderを立体的なオブジェクトに反映すると左の画像のように重なった部分が二重で表示されるような状態になります。今回は右の状態をURPで実現する方法を調査しました。

Shaderサンプル

Shader "Custom/Rim"
{
    Properties
    {
        _TintColor("Tint Color", Color) = (0,0.5,1,1)
        _RimColor("Rim Color", Color) = (0,1,1,1)
        _RimPower("Rim Power", Range(0,1)) = 0.4
    }

    Category
    {
        Tags
        {
            "Queue" = "Transparent"
            "RenderType" = "Transparent"
            "RenderPipeline" = "UniversalPipeline"
        }
        Blend SrcAlpha OneMinusSrcAlpha

        SubShader
        {
            Pass
            {
                Tags
                {
                    "LightMode" = "UniversalForward"
                }
                
                ColorMask 0
            }

            Pass
            {
                HLSLPROGRAM
                #pragma vertex vert
                #pragma fragment frag

                //Core機能をまとめたhlslを参照可能にする。いろんな便利関数や事前定義された値が利用可能となる。
                #include "Packages/com.unity.render-pipelines.universal/ShaderLibrary/Core.hlsl"


                float4 _TintColor;
                float4 _RimColor;
                float _RimPower;

                struct appdata_t
                {
                    float4 vertex : POSITION;
                    float3 normal : NORMAL;
                };

                struct v2f
                {
                    float4 vertex : SV_POSITION;
                    float3 world_pos : TEXCOORD0;
                    float3 normalDir : TEXCOORD1;
                };

                v2f vert(appdata_t v)
                {
                    v2f o;

                    o.vertex = TransformObjectToHClip(v.vertex);
                    o.world_pos = mul(unity_ObjectToWorld, v.vertex).xyz;
                    o.normalDir = TransformObjectToWorldNormal(v.normal);
                    return o;
                }

                float4 frag(v2f i) : SV_Target
                {
                    //カメラのベクトルを計算
                    float3 viewDirection = normalize(_WorldSpaceCameraPos.xyz - i.world_pos.xyz);
                    //法線とカメラのベクトルの内積を計算し、補間値を算出
                    half rim = 1.0 - saturate(dot(viewDirection, i.normalDir));
                    //補間値で塗分け
                    float4 col = lerp(_TintColor, _RimColor, rim * _RimPower);
                    return col;
                }
                ENDHLSL
            }
        }
    }
}

このShaderはリムライト表現をURPで実装したものです。

【参考リンク】：そろそろShaderをやるパート49　リムライト

マルチパス対応

1つめのパスで"LightMode" = "UniversalForward"をTagsに定義しています。
こうしないとマルチパスにならないようです。

【参考リンク】：Universal Render Pipeline(URP)乗り換えハマりポイントまとめ

原理

最初のパスで何も描画せず、深度値のみ書き込みます。深度値を書き込んだことで、半透明部分同士の描画順を解決するというアプローチです。

【参考リンク】：【Unity(Shader)】VR空間で違和感なく透過する手のシェーダー

ただ、BuiltIn RPのときは以下のように1つのパスで深度値書き込みのZWrite ONを記述するだけでよかったのですが、それだとなぜかうまくいきませんでした。

Pass
{    
    ZWrite ON
    ColorMask 0
}

そのかわりに、深度値の書き込みにRenderFeatureのRenderObjectsを利用するとうまいくいきました。
以下が設定値です。BeforeRenderingTransparentsを指定することで半透明描画の前に深度値の書き込みが可能です。対象のオブジェクトにLayerを設定し、FiltersのLayerMaskで適切に指定することで描画順がうまく解決されるはずです。

※RenderObjectsを使わなくても実装できる方法がありそうな気がするので、ご存じの方コメントください

---

追記
以下のように2つめのパスに"LightMode" = "UniversalForward"を定義すればRenderObjectsを使わなくても実装できました。(教えてくださった方、感謝です)

Shader "Custom/Rim"
{
    Properties
    {
        _TintColor("Tint Color", Color) = (0,0.5,1,1)
        _RimColor("Rim Color", Color) = (0,1,1,1)
        _RimPower("Rim Power", Range(0,1)) = 0.4
    }

    Category
    {
        Tags
        {
            "Queue" = "Transparent"
            "RenderType" = "Transparent"
            "RenderPipeline" = "UniversalPipeline"
        }
        Blend SrcAlpha OneMinusSrcAlpha

        SubShader
        {
            Pass
            {
-               Tags
-               {
-                   "LightMode" = "UniversalForward"
-               }
                ZWrite On
                ColorMask 0
            }

            Pass
            {
+               Tags
+               {
+                   "LightMode" = "UniversalForward"
+               }

                HLSLPROGRAM
                #pragma vertex vert
                #pragma fragment frag

                //Core機能をまとめたhlslを参照可能にする。いろんな便利関数や事前定義された値が利用可能となる。
                #include "Packages/com.unity.render-pipelines.universal/ShaderLibrary/Core.hlsl"


                float4 _TintColor;
                float4 _RimColor;
                float _RimPower;

                struct appdata_t
                {
                    float4 vertex : POSITION;
                    float3 normal : NORMAL;
                };

                struct v2f
                {
                    float4 vertex : SV_POSITION;
                    float3 world_pos : TEXCOORD0;
                    float3 normalDir : TEXCOORD1;
                };

                v2f vert(appdata_t v)
                {
                    v2f o;

                    o.vertex = TransformObjectToHClip(v.vertex);
                    o.world_pos = mul(unity_ObjectToWorld, v.vertex).xyz;
                    o.normalDir = TransformObjectToWorldNormal(v.normal);
                    return o;
                }

                float4 frag(v2f i) : SV_Target
                {
                    //カメラのベクトルを計算
                    float3 viewDirection = normalize(_WorldSpaceCameraPos.xyz - i.world_pos.xyz);
                    //法線とカメラのベクトルの内積を計算し、補間値を算出
                    half rim = 1.0 - saturate(dot(viewDirection, i.normalDir));
                    //補間値で塗分け
                    float4 col = lerp(_TintColor, _RimColor, rim * _RimPower);
                    return col;
                }
                ENDHLSL
            }
        }
    }
}