2
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

ShaderGraphで作成したシェーダの透明度がUIに反映されない件

Last updated at Posted at 2022-10-25

現象

Shader Graphで作成したシェーダをUIに適用すると、本来アルファで抜ける部分が真っ黒になってしまいます。
左がマテリアル未指定で正常に描画されているスプライト、
右がシェーダを適用して、抜き部分が黒くなってしまったスプライトです。

このような最小限の内容でも確認できます。

理由と対策

CanvasのRender ModeがOverlayになっていると透明度が反映されなくなります。
Screen Space - Camera で描画カメラを指定することで期待通りの結果が得られるようになります。

原因

Shader Graphが生成するシェーダコードにはuGUIが必要とする機能の一部が含まれていません。出力させるオプションも存在しません。
半透明の問題ばかりではなく、実はマスクも機能しません。
こちらはShader Graphが生成したシェーダコードに自前でステンシルの指定を書き加える必要があります。

つまり、Shader Graphは本来uGUI未対応です。
2022年10月現在、これは残念ながらUnityの仕様ということのようです。

ユーザーからの改善投票は続いていますので、どこかで対応されることを祈りましょう。
それまではUI用に別途カメラを設けることをお勧めします。

2
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?