zoukankan      html  css  js  c++  java
  • Unity3D 2D Sprite描边效果Shader,可手动调整效果适配

      最近两个月学了很多Shader的知识,现在也算入点门了。现在网上有很多2D描边的Shader,说实话大多数很差劲。有些多余的条件判断影响效率,提供的参数也不够适配所有图片。因为美术喜欢在图片上面加一些效果,再加上切图的时候背景图的透明部分不够多,或者透明通道透明不彻底等等问题,2D图片描边效果通常都不尽如人意。这种情况一般是要从美术那边用ps做调整,如果需要描边切图周围需要留出一点区域,我这个Shader提供了两个参数可以调整效果,检测范围和描边粗细,根据图片的不同,参数肯定要做些调整才能达到最想要的效果,Shader基于Unity自带SpriteDefault修改,直接赋给Sprite就行了。大家也可以适当做些修改。

      3D描边已经完成了法线膨胀的方法,接下来我会重点学习屏幕特效的方法然后写博客。以后还会有各种效果的Shader博客。

      

    Shader "Sprites/SpriteOutline"
    {
        Properties
        {
            [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
            _Color ("Tint", Color) = (1,1,1,1)
            [MaterialToggle] PixelSnap ("Pixel snap", Float) = 0
            _OutlineColor("OutlineColor",Color) = (1,1,1,1)
            _CheckRange("CheckRange",Range(0,1)) = 0
            _LineWidth("LineWidth",Float) = 0.39
            _CheckAccuracy("CheckAccuracy",Range(0.1,0.99)) = 0.9
        }
    
        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
                #pragma target 2.0
                #pragma multi_compile _ PIXELSNAP_ON
                #pragma multi_compile _ ETC1_EXTERNAL_ALPHA
                #include "UnityCG.cginc"
                sampler2D _MainTex;
                float4 _MainTex_TexelSize;
                sampler2D _AlphaTex;
                fixed4 _Color;
                fixed4 _OutlineColor;
                float _CheckRange;
                float _LineWidth;
                float _CheckAccuracy;
                struct appdata_t
                {
                    float4 vertex   : POSITION;
                    float4 color    : COLOR;
                    float2 texcoord : TEXCOORD0;
                };
    
                struct v2f
                {
                    float4 vertex   : SV_POSITION;
                    fixed4 color    : COLOR;
                    float2 texcoord  : TEXCOORD0;
                };//
                
                
    
                v2f vert(appdata_t IN)
                {
                    v2f OUT;
                    OUT.vertex = UnityObjectToClipPos(IN.vertex);
                    OUT.texcoord = IN.texcoord;
                    OUT.color = IN.color * _Color;
                    #ifdef PIXELSNAP_ON
                    OUT.vertex = UnityPixelSnap (OUT.vertex);
                    #endif
                    return OUT;
                }
    
                
    
                fixed4 SampleSpriteTexture (float2 uv)
                {
                    fixed4 color = tex2D (_MainTex, uv);
    
    #if ETC1_EXTERNAL_ALPHA//
                    // get the color from an external texture (usecase: Alpha support for ETC1 on android)
                    color.a = tex2D (_AlphaTex, uv).r;
    #endif //ETC1_EXTERNAL_ALPHA
    
                    return color;
                }
    
                fixed4 frag(v2f IN) : SV_Target
                {
                    fixed4 c = SampleSpriteTexture (IN.texcoord) * IN.color;
                    c.rgb *= c.a;
                    float isOut = step(abs(1/_LineWidth),c.a);
                    if(isOut != 0)
                    {
                        fixed4 pixelUp = tex2D(_MainTex, IN.texcoord + fixed2(0, _MainTex_TexelSize.y*_CheckRange));  
                        fixed4 pixelDown = tex2D(_MainTex, IN.texcoord - fixed2(0, _MainTex_TexelSize.y*_CheckRange));  
                        fixed4 pixelRight = tex2D(_MainTex, IN.texcoord + fixed2(_MainTex_TexelSize.x*_CheckRange, 0));  
                        fixed4 pixelLeft = tex2D(_MainTex, IN.texcoord - fixed2(_MainTex_TexelSize.x*_CheckRange, 0));  
                        float bOut = step((1-_CheckAccuracy),pixelUp.a*pixelDown.a*pixelRight.a*pixelLeft.a);
                        c = lerp(_OutlineColor,c,bOut);
                        return c;
                    }
                    return c;
                    
                }
            ENDCG
            }
        }
    }
  • 相关阅读:
    2.安卓体系结构
    1.Android的历史与安装
    Mysql免安装配置
    安装gulp
    搭建vue开发环境的步骤
    运行一个从GitHub上下载的vue项目的具体步骤
    网站源码,大量HTML5模板,视频源码,黑客技术资源
    bootstrap文件树
    jQuery unbind 某个function
    响应式设计的思考:媒体查询(media query)
  • 原文地址:https://www.cnblogs.com/StraussDu/p/7610704.html
Copyright © 2011-2022 走看看