【Unity】URPでシェーダー実装した際に発生した不具合と対処方法まとめ

Unity
マイケル
マイケル
みなさんこんにちは!
マイケルです!!
エレキベア
エレキベア
こんにちクマ〜〜〜
マイケル
マイケル
今回は最近リリースした「怪盗チョコレート」を開発する中で発生した、
シェーダー描画周りの不具合と対処内容について紹介しようと思います!

怪盗チョコレート – 3Dチョコ集めアクション –
MOLEGORO 無料
チョコを集めて育成する3D怪盗ゲーム



エレキベア
エレキベア
確かURPを使用したらいろいろ対処しないといけないことがあったのクマね
マイケル
マイケル
うん、今回は下記のバージョンを使用していて、URP環境でシェーダー実装した際の不具合対処の内容になるよ!
バージョンや環境によって差異がある可能性もあるから、その辺りはご注意ください!
[使用したバージョン]

Unity2021.3.1f1 (URP)
マイケル
マイケル
また、スクリプトについてもGitHubにて公開しています!
シェーダー周りはShaderフォルダ内に格納してありますので、こちらもよければ一緒にご参照ください!

GitHub – masarito617 / unity-chocolate-thief-scripts

エレキベア
エレキベア
同じような不具合が発生した場合にはぜひ参考いただきたいクマ〜〜〜

スポンサーリンク

発生した不具合と対処内容

マイケル
マイケル
それでは早速本題に入っていきますが、発生した不具合は
・マルチパス描画されない
・ShaderGraphで作成した際、SpriteUnlitが透過しない
・一部端末でSpriteが描画されない
の3点になります。

マルチパス描画されない

マイケル
マイケル
一点目の「マルチパス描画されない」件に関しては、下記のトゥーンシェーダー実装時に発生しました。
ScreenShot 2023 02 12 10 19 43
マイケル
マイケル
こちらは輪郭線部分とそれ以外でパスを分けて実装していたのですが、
ビルトインで作成したものをそのまま持ってきた場合に、一つ目のパスしか描画されないという状態になりました。
ScreenShot 2023 02 12 21 45 45↑一つ目のパスしか描画されていない
エレキベア
エレキベア
これは輪郭線部分(背面)しか描画されていないということクマね・・・
対処:UniversalForwardを指定する
マイケル
マイケル
こちらの対処については下記記事を参考にさせていただきました!
片方のパスに「”LightMode” = “UniversalForward”」を指定することで無事マルチパス描画されるようになりました。

参考:
Unity URP環境でMultiPassのシェーダーを描く

・・・略・・・
        // 背面
        Pass
        {
            Tags{ "LightMode" = "UniversalForward"} // URPでマルチパス描画するのに必要
            Cull Front
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
・・・略・・・
↑「UniversalForward」を指定
マイケル
マイケル
このようにURPではレンダリングの仕組みが変わっていることがあるため、ビルトインで作ったシェーダーを移行する際には注意しましょう!
他に指定できるタグの種類としては下記のようなものがあるようです。

URP ShaderLab Pass tags | Universal RP | 10.1.0

エレキベア
エレキベア
どちらのパスもデフォルトの「SRPDefaultUnlit」になっていたから
描画されてなかったわけクマね

ShaderGraphで作成した際、SpriteUnlitが透過しない

マイケル
マイケル
次に発生したのは「ShaderGraphで作成した際、SpriteUnlitが透過しない」という問題です。
こちらは下記記事を参考にShaderGraphで集中線エフェクトを実装した際に発生しました。

参考:
集中線エフェクト【uGUI】|Unity ShaderGraph CookBook vol.1【ShaderGraph 入門】

06 comic line↑集中線シェーダー
ScreenShot 2023 02 12 21 58 54↑ShaderGraphで実装した
マイケル
マイケル
URPでOnRenderImageが使用できない関係もあり今回はuGUIのSpriteにマテリアルを設定したのですが、下記のようにGameViewで透過せず真っ黒になるという事象が発生しました。
ScreenShot 2023 02 12 22 00 03↑SceneViewでは問題なさそうだが…
ScreenShot 2023 02 12 22 00 16↑GameViewで透過していない
エレキベア
エレキベア
むむむ・・・何故クマ・・・
対処:コードを生成して不要パスを削除
マイケル
マイケル
こちらの件について調査したところ、下記のUnity Forumにて類似の事象がありました。
どうやらUnity2021で発生している不具合のようで、2022年2月現在まだ解決はしていないようです。

Bug – Shader Graph UI Image Shader does not work – Unity Forum

エレキベア
エレキベア
おおぅ・・・・Unity起因クマか・・・
マイケル
マイケル
こちらはUnityForum内で記載されている暫定的な解決案を参考に、
1. View Generated Shader からシェーダーコードを出力する
2. 出力されたコード内の不要なパスを削除する

といった手順を踏むことで正常に描画されるようになりました!
ScreenShot 2023 02 12 21 59 13↑コードを生成する
・・・略・・・
            // このパスと...
            Pass
            {
                Name "SceneSelectionPass"
                Tags
                {
                    "LightMode" = "SceneSelectionPass"
                }
・・・略・・・
            // このパスを丸ごと削除!!
            Pass
            {
                Name "ScenePickingPass"
                Tags
                {
                    "LightMode" = "Picking"
                }
・・・略・・・
↑Unity2021で追加されたパス「SceneSelectionPass」「ScenePickingPass」を丸ごと削除
エレキベア
エレキベア
追加されたパスが悪さしていたクマね
強行手段クマ・・・

一部端末(iPad?)でSpriteが描画されない

マイケル
マイケル
最後に発生したのは「一部端末(iPad?)でSpriteが描画されない」という不具合です。
こちらは先ほどの集中線エフェクトに加え、下記の背景シェーダーでも発生しました。
07 border↑背景ボーダーシェーダー

参考:
そろそろShaderをやるパート12 線を描画してスクロールさせる

エレキベア
エレキベア
また面倒くさそうな不具合クマ・・・
マイケル
マイケル
こちらがOSバージョン起因なのか機種起因なのかまでは特定できていないのですが、
少なくとも自分の手持ちのiPhoneXでは発生せず、iPadでのみ不具合が発生するといった状態でした。
IMG 0038↑iPadだけ何故か描画されない
エレキベア
エレキベア
おおぅ・・・・
マイケル
マイケル
開発終盤で発生したので、これは正直焦りましたね〜〜
対処:ZTest Alwaysを指定する
マイケル
マイケル
こちらは新規作成したURPシェーダーの内容と差異がないかを比較してみて、
最終的には「ZTest Always」を指定することで解決することができました。
// タイトル画面の背景シェーダー
Shader "Hidden/TitleScrollShader"
{
Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
        _Color1("Color 1",Color) = (0,0,0,1)
        _Color2("Color 2",Color) = (1,1,1,1)
    }
    SubShader
    {
        // bugfix: これ付けないとiPadで表示されなかった
        Cull Off ZWrite Off ZTest Always
        Tags
        {
            "RenderType"="Opaque"
        }
・・・略・・・
↑背景シェーダーの修正
・・・略・・・
            Pass
            {
                Name "Sprite Unlit"
                Tags
                {
                    "LightMode" = "Universal2D"
                }
                // Render State
                Cull Off
                Blend SrcAlpha OneMinusSrcAlpha, One OneMinusSrcAlpha
                ZTest Always // bugfix: AlwaysにしないとiPadで表示されなかった
                ZWrite Off
・・・略・・・
↑集中線エフェクトの修正
エレキベア
エレキベア
これは中々気づきにくいクマね〜〜〜
マイケル
マイケル
正直詳細な原因までは調べきれていないのですが、何らかの原因でZTestに合格できずに描画されていなかったかと思われますね・・・。
機種やOSバージョンによってもこの辺りの差異があるのでしょうか・・?
エレキベア
エレキベア
なんにせよSpriteが場合にはZTest周りの指定を疑ってみてもいいかもしれないクマね

おわりに

マイケル
マイケル
というわけで今回はURPでシェーダー実装した際の不具合対処でした!
どうだったかな??
エレキベア
エレキベア
やっぱりいざ描画周りをいじろうとするといろいろ起きるクマね〜〜
何にせよ今回は解決してよかったクマ
マイケル
マイケル
開発に時間が限られてたから、ハマってたらやばかったかもね!
こればっかりは経験が物を言いそうなので地道にやっていこう!
エレキベア
エレキベア
まあいい勉強にはなったクマ
マイケル
マイケル
それでは今日はこの辺で!
アデューーー!!
エレキベア
エレキベア
クマ〜〜〜〜〜〜

【Unity】URPでシェーダー実装した際に発生した不具合と対処方法まとめ 〜完〜

コメント