【Unity】画像のシルエットシェーダー

Unity シェーダー

概要

Unityで画像をColor値の色に塗りつぶすシェーダーを作成しました。
こちらを用いると画像の形状に従って、色を設定することでシルエットのような表示が可能になります。

スクリプト

Shader "OMSB/ImageSilhouette"
{
    Properties
    {
        [PerRendererData] _MainTex ("Main Tex", 2D) = "white" {}
    }

    SubShader
    {
        Tags
        { 
            "Queue" = "Transparent" 
            "IgnoreProjector" = "True" 
            "RenderType" = "Transparent" 
            "PreviewType" = "Plane"
            "CanUseSpriteAtlas" = "True"
        }

        Cull Off
        Lighting Off
        ZWrite Off
        Blend One OneMinusSrcAlpha

        Pass
        {
        CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "UnityCG.cginc"
            
            struct appdata_t 
            {
                float4 vertex   : POSITION;
                float4 color    : COLOR;
                float2 texcoord : TEXCOORD0;
            };

            struct v2f 
            {
                float4 vertex   : SV_POSITION;
                fixed4 color    : COLOR;
                half2 texcoord  : TEXCOORD0;
            };
            
            sampler2D _MainTex;

            v2f vert(appdata_t v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.texcoord = v.texcoord;
                o.color = v.color;
                return o;
            }

            fixed4 frag(v2f i) : SV_Target 
            {
                fixed4 tex = tex2D(_MainTex, i.texcoord);
                fixed4 m = i.color;
                m.rgb *= tex.a;
                m.a = tex.a;
                return m;
            }
    
        ENDCG
        }
    }
}

使い方

1.マテリアルを作成し、Shaderに「OMSB」>「ImageSilhouette」を設定
2.作成したマテリアルを「Image」などのComponentの「Material」に設定
3.Color値を設定したい色に変更

以上で画像の形状に従って指定色で表示されます。

コメント

タイトルとURLをコピーしました