TextMeshPro を常に最前面に表示させる
TextMeshPro の埋め込み問題
テキストを表示させるのによく利用される TextMeshPro ですが, オブジェクトと被ると埋め込まれて見えなくなる問題が発生します.
要件によっては常に最前面に表示させたい場合があります.
Distance Field Overlay
この問題の解決方法としては TextMeshPro 標準アセットに搭載されている TextMeshPro/Distance Field Overlay
または
TextMeshPro/Mobile/Distance Field Overlay
を利用することで解決できます.
TextMeshPro に標準で割り当てられている Shader は Distance Field の Queue は Transparent ですが, Distance Field Overlay はその名の通り,Queue が Overlay になっているためです.
LiberationSans SDF フォントアセットを複製し,複製物のマテリアルの Shader を
TextMeshPro/Mobile/Distance Field Overlay
に変更して比較してみます.
上が Distance Field
を用いた場合で,下が Distance Field Overlay
を用いたテキストです.
描画順が調整され,埋め込み問題が解決されました.
Mobile
Mobile がついているものとついていない Distance Field Overlay があります(Overlay に限らずですが). Shader の中身を見てみると,Mobile 側では以下のコメントがあります.
// Simplified SDF shader: // - No Shading Option (bevel / bump / env map) // - No Glow Option // - Softness is applied on both side of the outline // 簡易版のSDFシェーダ。 // Bevel / Bump / EnvMap の Option 設定なし // Glow の Option 設定なし // Softness を Outline の両側で適用
Inspector で表示されるプロパティの数で比較するとわかりやすいと思います. Shader のプロパティをデフォルトのままの適用であれば Mobile でよいかもしれません. Shader の中身が気になった方は各々読んでいただければと思います.
注意点としては,Overlay の Queue は 4000 なので,4001 以上のオブジェクトに対しては埋め込みが発生します.
上記の例は Cube の Material の Custom Render Queue が 4001 になったサンプルです.
参考文献
SDF Shaders の一つとして公式ドキュメントに紹介されています.
SDF とは Signed Distance Field (符号付距離場) の略です.Unreal Engine 側で分かりやすい解説があったので紹介します. docs.unrealengine.com