おもちゃラボ

Unityで遊びを作っていきます

【Unity】3D Textの前後関係を正しく表示する

Unityの3D Textは、uGUIと違い空間上に配置できるテキストになります。ただ、この3D Text、他のオブジェクトの裏面に回っても最前面に表示されてしまいます。

f:id:nn_hokuson:20210909210615g:plain
そこで、3D Textの前後関係を正しく表示する方法を紹介したいと思います。

流れは次の通りです。

シェーダでデプスをみて描画する

3D Textが別オブジェクトの裏面に回った時に前後関係を正しく表示するため、ちゃんと
デプスチェックをするシェーダを作成します。プロジェクトウィンドウで右クリック→Create→Standard Surface Shaderを選択して、Font3D.shaderという名前で保存して下さい。

次にFont3Dシェーダに次のプログラムを入力して下さい。

Shader "Custom/Font3D"
{
   	Properties {
		_MainTex ("Font Texture", 2D) = "white" {}
		_Color ("Text Color", Color) = (1,1,1,1)
	}
 
	SubShader {
		Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" }
		Lighting Off Cull Off ZWrite On Fog { Mode Off }
		Blend SrcAlpha OneMinusSrcAlpha
		Pass {
			Color [_Color]
			SetTexture [_MainTex] {
				combine primary, texture * primary
			}
		}
	}
}

このプログラムではZWrite Onとすることで、カメラからみたときの3D Textのデプスを考慮して描画を行います。これにより前後関係の正しい描画ができるようになります。

また、Cull offとして3D Textを裏面から見たときにも描画されるようにしてます。ここは状況に応じてオンオフして下さい。

マテリアルを作成する

次に、いま作ったFont3Dシェーダを選択した状態で右クリックして、Create→Materialを選択します。これによりFont3Dシェーダがセットされたマテリアルが作成されます。

f:id:nn_hokuson:20210909204749p:plain:w220

作成したマテリアルにフォントテクスチャをセットします。使用したいフォントの「▶」をクリックして展開し、その中にあるFont Textureを作成したマテリアルのFont Textureの欄にドラッグ&ドロップしてください。

f:id:nn_hokuson:20210909212502p:plain:w500

3D Textにマテリアルをアタッチ

最後に、作成したマテリアルを3D Textのオブジェクトにドラッグ&ドロップしてアタッチします。

f:id:nn_hokuson:20210909212730p:plain:w450

フォントの色を変えたい場合はマテリアルのカラーから変更できます。カメラを動かしてみて3D Textの前後関係が正しく表示されるか試してみてください!
f:id:nn_hokuson:20210909211022g:plain

nn-hokuson.hatenablog.com
こちらも合わせてどうぞ