Unityの3D空間上に存在するZwriteをOffにしたSpriteとTransparentの描画順を正したい

Question

前提

Unityで3D空間に設置したSpriteが、Transparentと重なった時に描画順が崩れます（Transparentが必ず前面に来る）。

以前質問したもの（Unity3Dで描画順を設定できるSpriteをSkyboxより手前に表示したい）と同じで、キャラクターとして表示しているSpriteのため、同じマテリアルを持つオブジェクトを複数重ねて配置しています。
そのため、パーツ毎に描画順を設定する必要があります。

同じシェーダーに関する質問なので、コピペみたいな内容になってしまいますがお許しください。

実現したいこと

• 3D空間に配置されたSpriteが
• 他オブジェクトの影や光の影響を受け
• 同一のシェーダーを持った他Spriteとの表示順を設定でき
• Transparentと干渉しない

という状況を作りたいです。

発生している問題

ZwriteをOffにすることでOrder in Layerから表示順を設定していましたが、Transparentのオブジェクトを配置した際に題目の問題が発生しました。

該当のソースコード

Spriteのシェーダーは以下です。

Shader "Custom/Character"
{
    Properties{
    _Cutoff("Cutoff", Range(0,1)) = 0.5
    _Color("Color", Color) = (1,1,1,1)
    _MainTex("Albedo (RGB)", 2D) = "white" {}
    _Glossiness("Smoothness", Range(0,1)) = 0.5
    _Metallic("Metallic", Range(0,1)) = 0.0
    }

    SubShader{
        Tags { "Queue" = "AlphaTest" "RenderType" = "TransparentCutout" }
        LOD 200
        Cull Off
        ZWrite Off

        CGPROGRAM
        #pragma surface surf Standard alphatest:_Cutoff addshadow fullforwardshadows
        #pragma target 3.0

        sampler2D _MainTex;

        struct Input
        {
            float2 uv_MainTex;
        };

        half _Glossiness;
        half _Metallic;
        fixed4 _Color;

        void surf(Input IN, inout SurfaceOutputStandard o)
        {
            fixed4 c = tex2D(_MainTex, IN.uv_MainTex) * _Color;
            o.Albedo = c.rgb;
            o.Metallic = _Metallic;
            o.Smoothness = _Glossiness;
            o.Alpha = c.a;
        }
        ENDCG
    }
    FallBack "Diffuse"
}

正確には裏面の陰影を表示するため、以下のコードも含まれています。

Cull Front

CGPROGRAM

#pragma surface surf Standard alphatest:_Cutoff　fullforwardshadows vertex:vert
#pragma target 3.0

sampler2D _MainTex;

struct Input
{
    float2 uv_MainTex;
};

void vert(inout appdata_full v)
{
    v.normal.xyz = v.normal * -1;
}

half _Glossiness;
half _Metallic;
fixed4 _Color;

void surf(Input IN, inout SurfaceOutputStandard o)
{
    fixed4 c = tex2D(_MainTex, IN.uv_MainTex) * _Color;
    o.Albedo = c.rgb;
    o.Metallic = _Metallic;
    o.Smoothness = _Glossiness;
    o.Alpha = c.a;
}
ENDCG

Transparent側はUnityChanShaderのToonColor_DoubleShadeWithFeather_Transparentですが、他のTransparent系シェーダーでも同様の問題が発生しました。

ユニティちゃんトゥーンシェーダー2.0

試したこと

ZwriteをOnにすることで回避できますが、表示順が距離依存になってしまうので、この方法だと正確な描写は難しいと判断しました。

Skyboxと干渉した時のように、カメラを複数配置することで解決を試みましたが無理でした。

Problem with ZWrite and sorting objects - Unity Forum

上記のページも参考にしましたが、シェーダーの知識が足りず、解決には至りませんでした。

SpriteのZwriteをOnにしたものでも一応実装はできているので、よほど難解だと判明した場合に諦める準備はできました。

補足情報（FW/ツールのバージョンなど）

Unity 2021.2.8f1

Answer 1

おっしゃる通りですね...ZWrite Offに設定したのでスプライトのデプスは書き込まれず、Transparentオブジェクトを描画する時点ではスプライトが存在しないのと同じになってしまい、容赦なく上書きされてしまうようです。

ちょっと作戦を変更しました。まず以前の回答で申し上げた二段カメラはなしにして、元の単一カメラに戻します。Clear Flagsも元通りメインカメラがスカイボックスを描画するようにします。

この時点では下図のように元通りスカイボックスによる上書きが発生するはずです。また、スプライトの背後に半透明のシリンダーを置きましたが、これもスプライトの上に描画されてしまいました。

そこで、スプライトキャラクターのルート（今回の実験では「Sprite Man」オブジェクト）に下記のようなスクリプトをアタッチします。

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.Rendering;

public class ZWriter : MonoBehaviour
{
	[SerializeField] private Material zWriterMaterial;
	private readonly List<ZWriterHelper> helpers = new List<ZWriterHelper>();

	private void OnEnable()
	{
		// Enable時に、子オブジェクトのスプライトに後述のZWriterHelperをアタッチする
		var spriteRenderers = this.GetComponentsInChildren<SpriteRenderer>(true);
		foreach (var spriteRenderer in spriteRenderers!)
		{
			var helper = spriteRenderer!.GetComponent<ZWriterHelper>();
			if (helper == null)
			{
				helper = spriteRenderer.gameObject.AddComponent<ZWriterHelper>();
			}

			this.helpers!.Add(helper);
		}
	}

	private void OnDisable()
	{
		// Disable時にZWriterHelperは削除する
		foreach (var helper in this.helpers!)
		{
			if (helper != null)
			{
				Destroy(helper);
			}
		}
	}

	[DisallowMultipleComponent]
	[RequireComponent(typeof(SpriteRenderer))]
	private class ZWriterHelper : MonoBehaviour
	{
		private readonly Dictionary<Camera, CommandBuffer> commandBuffers = new Dictionary<Camera, CommandBuffer>();
		private new SpriteRenderer renderer;
		private ZWriter zWriter;

		private void OnEnable()
		{
			this.zWriter = this.GetComponentInParent<ZWriter>();
			if (this.zWriter == null)
			{
				this.enabled = false;
				return;
			}

			this.renderer = this.GetComponent<SpriteRenderer>();
		}

		private void OnDisable()
		{
			this.RemoveCommandBuffers();
		}

		private void OnWillRenderObject()
		{
			if ((this.zWriter == null) || !this.zWriter.enabled || (this.zWriter.zWriterMaterial == null))
			{
				this.RemoveCommandBuffers();
				return;
			}

			var currentCamera = Camera.current;
			if (currentCamera == null)
			{
				return;
			}

			if (this.commandBuffers!.ContainsKey(currentCamera))
			{
				return;
			}

			// スカイボックスレンダリング前にスプライトをzWriterMaterialを使って描画するよう
			// カメラにCommandBufferを仕込む
			var commandBuffer = new CommandBuffer
			{
				name = $"Write {this.name} Depth"
			};
			commandBuffer.DrawRenderer(this.renderer, this.zWriter.zWriterMaterial);
			currentCamera.AddCommandBuffer(CameraEvent.BeforeSkybox, commandBuffer);
			this.commandBuffers.Add(currentCamera, commandBuffer);
		}

		private void RemoveCommandBuffers()
		{
			foreach (var (targetCamera, commandBuffer) in this.commandBuffers!)
			{
				if (targetCamera != null)
				{
					targetCamera.RemoveCommandBuffer(CameraEvent.BeforeSkybox, commandBuffer);
				}

				commandBuffer?.Dispose();
			}

			this.commandBuffers.Clear();
		}
	}
}

また、下記のようにスプライトのシェーダーと同様のアルファカットオフを行いつつ、ZWrite Onかつカラーバッファには書き込みを行わないシェーダーを用意します。

Shader "Custom/ZWriter"
{
	Properties{
		_Cutoff("Cutoff", Range(0,1)) = 0.5
		_Color("Color", Color) = (1,1,1,1)
		_MainTex("Albedo (RGB)", 2D) = "white" {}
	}

	SubShader{
		Tags { "Queue" = "AlphaTest" "RenderType" = "TransparentCutout" }
		LOD 200
		Cull Off
		ZWrite On
		ColorMask 0

		Pass
		{
			CGPROGRAM
			#pragma vertex vert
			#pragma fragment frag
			#include "UnityCG.cginc"

			struct appdata
			{
				float4 vertex : POSITION;
				float2 uv : TEXCOORD0;
				float4 color : COLOR;
			};

			struct v2f
			{
				float4 vertex : SV_POSITION;
				float2 uv : TEXCOORD0;
				float4 color : TEXCOORD1;
			};

			sampler2D _MainTex;
			float4 _MainTex_ST;
			fixed4 _Color;
			float _Cutoff;

			v2f vert(appdata v)
			{
				v2f o;
				o.vertex = UnityObjectToClipPos(v.vertex);
				o.uv = TRANSFORM_TEX(v.uv, _MainTex);
				o.color = _Color * v.color;
				return o;
			}

			fixed4 frag(v2f i) : SV_Target
			{
				clip(tex2D(_MainTex, i.uv).a * i.color.a - _Cutoff);
				return 0;
			}
			ENDCG
		}
	}
	FallBack "Diffuse"
}

これを使ったマテリアルを作り、ZWriterのzWriterMaterialにセットしておきます。

この状態で実行すれば、スカイボックスによる上書きもTransparentオブジェクトによる上書きも発生しなくなるかと思います。つまり、スプライトの各部位の前後関係を正しくするにはデプスを書き込んではならず、スカイボックスやTransparentによる上書きを防ぐにはデプスが必要であるのなら、スプライトのレンダリング時にはデプスを書き込まず、スカイボックスを描画する前にあらためてデプスを書き込んでやればいいんじゃないかと思ったわけです。

ただし、ゲームビューではスプライトのレンダリングがスカイボックスよりも前なので意図通りになるのですが、シーンビューではスプライトよりもスカイボックスが先にレンダリングされるため、スプライトのシェーダーをZWrite Onにしたときと同様に各部位の重なりが不確定になってちらつきが発生する弱点があります...

Comments

[bh_evan]

2度に渡り解答していただき頭が上がりません。本当にありがとうございます。
お陰で完全に理想通りの実装ができました。

C#から書き込む方法もあるのですね。
勉強になりました。