logo标签列表

Unity3D - 精灵裁剪的着色器

unity-game-engineshadersprite2d-games
5

我正在尝试创建一个可以用于在游戏中裁剪2D精灵的着色器，我在另一个问题中找到了这个着色器。

Shader "Sprites/ClipArea"
{
Properties
{
    _MainTex ("Base (RGB), Alpha (A)", 2D) = "white" {}
    _Length ("Length", Range(0.0, 1.0)) = 1.0
    _Width ("Width", Range(0.0, 1.0)) = 0.5
 }

SubShader
{
    LOD 200

    Tags
    {
        "Queue" = "Transparent"
        "IgnoreProjector" = "True"
        "RenderType" = "Transparent"
    }

    Pass
    {
        Cull Off
        Lighting Off
        ZWrite Off
        Offset -1, -1
        Fog { Mode Off }
        ColorMask RGB
        Blend SrcAlpha OneMinusSrcAlpha

        CGPROGRAM
        #pragma vertex vert
        #pragma fragment frag

        #include "UnityCG.cginc"

        sampler2D _MainTex;
        float4 _MainTex_ST;
        float _Length;
        float _Width;

        struct appdata_t
        {
            float4 vertex : POSITION;
            float2 texcoord : TEXCOORD0;
        };

        struct v2f
        {
            float4 vertex : POSITION;
            float2 texcoord : TEXCOORD0;
        };

        v2f vert (appdata_t v)
        {
            v2f o;
            o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
            o.texcoord = v.texcoord;
            return o;
        }

        half4 frag (v2f IN) : COLOR
        {
            if ((IN.texcoord.x<0) || (IN.texcoord.x>_Width) || (IN.texcoord.y<0) || (IN.texcoord.y>_Length))

            {
                half4 colorTransparent = half4(0,0,0,0) ;
                return  colorTransparent ;
            }
            return tex2D(_MainTex, IN.texcoord);
        }
        ENDCG
    }
}
}

这段代码在单个精灵上运行得非常完美，但我正在使用Unity Sprite编辑器分割的精灵表。

着色器中的_Width变量覆盖了整个精灵表，而不是我正在处理的精灵。我试图找到一种方法在着色器中获取当前精灵矩形，但没有找到任何内容。

3个回答
6
嗯，在拼命调试三天之后，我终于找到了一个解决方法。 在进一步了解着色器的工作原理和它们在流水线中的角色后，我意识到精灵矩形信息很可能不会在着色器中可用，原因很简单，除了我的着色器以外，几乎所有着色器（除了我的）的功能都不需要此信息。因为着色器的工作是取一个顶点，通过顶点函数修改其位置（如果需要），然后通过片段函数确定其像素颜色，它不关心整个精灵，它只需要使用纹理坐标从纹理中查找特定顶点的像素颜色。 我相信对于从事着色器工作的人来说，这是微不足道的信息，但我花了一些时间才意识到它（这是我第一次编写的着色器）。 所以，为了解决问题，我不得不使用着色器属性来传递当前着色器正在处理的精灵在精灵表中的MinX和MaxX，所以现在着色器看起来像这样：
Shader "Sprites/ClipArea"
{
    Properties
    {
        _MainTex ("Base (RGB), Alpha (A)", 2D) = "white" {}
        _Fill ("Fill", Range(0.0, 1.0)) = 1.0
        _MinX ("MinX", Float) = 0
        _MaxX ("MaxX", Float) = 1
     }

    SubShader
    {
        LOD 200

        Tags
        {
            "Queue" = "Transparent"
            "IgnoreProjector" = "True"
            "RenderType" = "Transparent"
        }

        Pass
        {
            Cull Off 
            Lighting Off
            ZWrite Off
            Offset -1, -1
            Fog { Mode Off }
            ColorMask RGB
            Blend SrcAlpha OneMinusSrcAlpha

            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            sampler2D _MainTex;
            float4 _MainTex_ST;
            float _MinX;
            float _MaxX;
            float _Fill;

            struct appdata_t
            {
                float4 vertex : POSITION;
                float2 texcoord : TEXCOORD0; 
            };

            struct v2f
            {
                float4 vertex : POSITION;
                float2 texcoord : TEXCOORD0;
            };

            v2f vert (appdata_t v)
            {
                v2f o;
                o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
                o.texcoord = v.texcoord;
                return o;
            }

            half4 frag (v2f IN) : COLOR 
            {
            if ((IN.texcoord.x<_MinX)|| (IN.texcoord.x>(_MinX+_Fill*(_MaxX-_MinX))))
                {
                    half4 colorTransparent = half4(0,0,0,0) ;
                    return  colorTransparent ;
                }
                return tex2D(_MainTex, IN.texcoord);
            }
            ENDCG
        }
    }
}

要使用此着色器，您需要创建一个使用它的材质，然后在SpriteRenderer中使用该材质，您可以从检查器更改Fill amount、MinX和MaxX，或者从代码中调用spriteRenderer.material.setFloat（属性，值）。
接下来，我遇到了另一个有关动画精灵的问题，我必须在每一帧上更新MinX和MaxX，但当我在Update函数中这样做时，动画开始闪烁，这是因为更新是在精灵呈现之后调用的，所以我必须使用Main Camera OnPreRender事件来更新材质属性。
也许有更好的方法来实现所有这些，但这是我能想到的最好的方法，我希望这将使试图实现相同效果的人受益。
同样的事情对我不起作用，我现在使用这个着色器后得到了白色材质。我只有简单的精灵而不是精灵表。 - Siddharth
好的解决方案。它也适用于其他情况，比如您只想从某些区域剪切图像。我想添加到愿望清单的一项是从任一侧剪辑。您可以使用minX（增加minX而不是减少填充）来实现这一点，所以这也很好。 - Eli
2
我已经改进了Khaled-AbuA-lkheir着色器，添加了基础精灵颜色：
Shader "Sprites/ClipArea"
{
    Properties
    {
        _MainTex ("Base (RGB), Alpha (A)", 2D) = "white" {}
        _Fill ("Fill", Range(0.0, 1.0)) = 1.0
        _MinX ("MinX", Float) = 0
        _MaxX ("MaxX", Float) = 1
     }

    SubShader
    {
        LOD 200

        Tags
        {
            "Queue" = "Transparent"
            "IgnoreProjector" = "True"
            "RenderType" = "Transparent"
        }

        Pass
        {
            Cull Off 
            Lighting Off
            ZWrite Off
            Offset -1, -1
            Fog { Mode Off }
            ColorMask RGB
            Blend SrcAlpha OneMinusSrcAlpha

            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            sampler2D _MainTex;
            float4 _MainTex_ST;
            float _MinX;
            float _MaxX;
            float _Fill;

            struct appdata_t
            {
                float4 vertex : POSITION;
                float2 texcoord : TEXCOORD0; 
                fixed4 color : COLOR;
            };

            struct v2f
            {
                float4 vertex : POSITION;
                float2 texcoord : TEXCOORD0;
                fixed4 color : COLOR;
            };

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

            half4 frag (v2f IN) : COLOR 
            {
                if ((IN.texcoord.x<_MinX)|| (IN.texcoord.x>(_MinX+_Fill*(_MaxX-_MinX))))
                {
                    half4 colorTransparent = half4(0,0,0,0) ;
                    return  colorTransparent ;
                }
                else
                {
                    return tex2D(_MainTex, IN.texcoord)*IN.color;
                }
            }
            ENDCG
        }
    }
}
0
我重新激活这个帖子，因为我认为它可能有用： 我添加了设置_MinX大于_MaxX的可能性。 这样，您就可以进行“从右到左”的剪辑，而不是“从左到右”。
Shader "Sprites/ClipArea"
{
Properties
{
    _MainTex("Base (RGB), Alpha (A)", 2D) = "white" {}
    _Fill("Fill", Range(0.0, 1.0)) = 1.0
    _MinX("MinX", Float) = 0
    _MaxX("MaxX", Float) = 1
}

    SubShader
    {
        LOD 200

        Tags
        {
            "Queue" = "Transparent"
            "IgnoreProjector" = "True"
            "RenderType" = "Transparent"
        }

        Pass
        {
            Cull Off
            Lighting Off
            ZWrite Off
            Offset -1, -1
            Fog { Mode Off }
            ColorMask RGB
            Blend SrcAlpha OneMinusSrcAlpha

            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            sampler2D _MainTex;
            float4 _MainTex_ST;
            float _MinX;
            float _MaxX;
            float _Fill;

            struct appdata_t
            {
                float4 vertex : POSITION;
                float2 texcoord : TEXCOORD0;
                fixed4 color : COLOR;
            };

            struct v2f
            {
                float4 vertex : POSITION;
                float2 texcoord : TEXCOORD0;
                fixed4 color : COLOR;
            };

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

            half4 frag(v2f IN) : COLOR
            {
                if (_MinX < _MaxX && ((IN.texcoord.x < _MinX) || (IN.texcoord.x > (_MinX + _Fill * (_MaxX - _MinX)))) ||
                    _MinX > _MaxX && ((IN.texcoord.x > _MinX) || (IN.texcoord.x < (_MinX + _Fill * (_MaxX - _MinX)))))
                {
                    return half4(0, 0, 0, 0);
                }
                else
                {
                    return tex2D(_MainTex, IN.texcoord) * IN.color;
                }
            }
            ENDCG
        }
    }
}
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接