【着色器实现Distorted Outline外描边轮廓扭曲效果_Shader效果第二篇】

简介: 【着色器实现Distorted Outline外描边轮廓扭曲效果_Shader效果第二篇】

效果如图:


属性栏如图


完整代码

Shader "Distorted Outline"
{
    Properties
    {
        _MainTex ("Main Texture", 2D) = "white" {}
    _Color("Main Color", Color) = (1,1,1,1)
    _Alpha("General Alpha",  Range(0,1)) = 1
        
    _OutlineColor("Outline Base Color", Color) = (1,1,1,1)
    _OutlineAlpha("Outline Base Alpha",  Range(0,1)) = 1
    _OutlineGlow("Outline Base Glow", Range(1,100)) = 1.5
    _OutlineWidth("Outline Base Width", Range(0,0.2)) = 0.004
    _OutlinePixelWidth("Outline Base Pixel Width", Int) = 1
    
    [Space]
    _OutlineTex("Outline Texture", 2D) = "white" {}
    _OutlineTexXSpeed("Texture scroll speed X", Range(-50,50)) = 10
    _OutlineTexYSpeed("Texture scroll speed Y", Range(-50,50)) = 0

        [Space]
    _OutlineDistortTex("Outline Distortion Texture", 2D) = "white" {}
    _OutlineDistortAmount("Outline Distortion Amount", Range(0,2)) = 0.5
    _OutlineDistortTexXSpeed("Distortion scroll speed X", Range(-50,50)) = 5
    _OutlineDistortTexYSpeed("Distortion scroll speed Y", Range(-50,50)) = 5
    }

    SubShader
    {
        Tags {"Queue" = "Transparent" "RenderType"="Opaque" "IgnoreProjector" = "True" }        
        Blend SrcAlpha OneMinusSrcAlpha
        ZWrite Off
        Cull Off

        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
        half4 color : COLOR;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
        half2 uvOutTex : TEXCOORD1;
        half2 uvOutDistTex : TEXCOORD2;
        half4 color : COLOR;
            };

            sampler2D _MainTex;
            half4 _MainTex_ST, _MainTex_TexelSize, _Color;
      half _Alpha;
            float _RandomSeed;

      half4 _OutlineColor;
      half _OutlineAlpha, _OutlineGlow, _OutlineWidth;
      int _OutlinePixelWidth;

      sampler2D _OutlineTex;
      half4 _OutlineTex_ST;
      half _OutlineTexXSpeed, _OutlineTexYSpeed;

      sampler2D _OutlineDistortTex;
      half4 _OutlineDistortTex_ST;
      half _OutlineDistortTexXSpeed, _OutlineDistortTexYSpeed, _OutlineDistortAmount;

            v2f vert (appdata v)
            {
                v2f o;
        o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
        o.uvOutTex = TRANSFORM_TEX(v.uv, _OutlineTex);
        o.uvOutDistTex = TRANSFORM_TEX(v.uv, _OutlineDistortTex);
        o.color = v.color;
                return o;
            }

            half4 frag (v2f i) : SV_Target
            {
        float2 uvRect = i.uv;
        half2 center = half2(0.5, 0.5);

        half2 destUv = half2(_OutlinePixelWidth * _MainTex_TexelSize.x, _OutlinePixelWidth * _MainTex_TexelSize.y);

        i.uvOutDistTex.x += ((_Time + _RandomSeed) * _OutlineDistortTexXSpeed) % 1;
        i.uvOutDistTex.y += ((_Time + _RandomSeed) * _OutlineDistortTexYSpeed) % 1;

        half outDistortAmnt = (tex2D(_OutlineDistortTex, i.uvOutDistTex).r - 0.5) * 0.2 * _OutlineDistortAmount;
        destUv.x += outDistortAmnt;
        destUv.y += outDistortAmnt;

        half spriteLeft = tex2D(_MainTex, i.uv + half2(destUv.x, 0)).a;
        half spriteRight = tex2D(_MainTex, i.uv - half2(destUv.x, 0)).a;
        half spriteBottom = tex2D(_MainTex, i.uv + half2(0, destUv.y)).a;
        half spriteTop = tex2D(_MainTex, i.uv - half2(0, destUv.y)).a;
        half result = spriteLeft + spriteRight + spriteBottom + spriteTop;

        half spriteTopLeft = tex2D(_MainTex, i.uv + half2(destUv.x, destUv.y)).a;
        half spriteTopRight = tex2D(_MainTex, i.uv + half2(-destUv.x, destUv.y)).a;
        half spriteBotLeft = tex2D(_MainTex, i.uv + half2(destUv.x, -destUv.y)).a;
        half spriteBotRight = tex2D(_MainTex, i.uv + half2(-destUv.x, -destUv.y)).a;
        result = result + spriteTopLeft + spriteTopRight + spriteBotLeft + spriteBotRight;
          
        result = step(0.05, saturate(result));

        i.uvOutTex.x += ((_Time + _RandomSeed) * _OutlineTexXSpeed) % 1;
        i.uvOutTex.y += ((_Time + _RandomSeed) * _OutlineTexYSpeed) % 1;

        half4 tempOutColor = tex2D(_OutlineTex, i.uvOutTex);
        tempOutColor *= _OutlineColor;
        _OutlineColor = tempOutColor;

        half4 col = tex2D(_MainTex, i.uv) * i.color;

        half originalAlpha = col.a;

        result *= (1 - originalAlpha) * _OutlineAlpha;


        half4 outline = _OutlineColor;
        outline.rgb *= _OutlineGlow;
        outline.a = result;

        col = lerp(col, outline, result);

        col.a *= _Alpha;
        col *= _Color;
                return col;

            }
            ENDCG
        }
    }
  Fallback "Sprites/Default"
}
相关文章
|
8月前
|
图形学
浅谈Unity之ShaderGraph-等高线和高程渐变设色
ShaderGraph实现等高线和高程渐变设色
|
15天前
【着色器实现Shadow投影效果_Shader效果第八篇】
【着色器实现Shadow投影效果_Shader效果第八篇】
|
15天前
【着色器实现RoundWave圆形波纹效果_Shader效果第六篇】
【着色器实现RoundWave圆形波纹效果_Shader效果第六篇】
|
15天前
【着色器实现Pixelate马赛克效果_Shader效果第七篇】
【着色器实现Pixelate马赛克效果_Shader效果第七篇】
|
15天前
【ShaderToy中图形效果转译到UnityShaderlab案例分享,实现圆形图像变异_Animation】
【ShaderToy中图形效果转译到UnityShaderlab案例分享,实现圆形图像变异_Animation】
|
15天前
|
图形学
【Unity Shader 描边效果_案例分享】
【Unity Shader 描边效果_案例分享】
|
15天前
【着色器实现FishEye鱼眼画面膨胀效果_Shader效果第十六篇】
【着色器实现FishEye鱼眼画面膨胀效果_Shader效果第十六篇】
|
9月前
|
存储 编译器 图形学
使用Unity在材质球上实现绘画:详细解释每一行Shader代码!
使用Unity在材质球上实现绘画:详细解释每一行Shader代码!
106 0
|
11月前
【Three.js入门】纹理及其常用属性、透明纹理、环境遮挡贴图与强度
【Three.js入门】纹理及其常用属性、透明纹理、环境遮挡贴图与强度
302 0
SwiftUI—使用渐变提高视觉的冲击力:绘制线性渐变
SwiftUI—使用渐变提高视觉的冲击力:绘制线性渐变
198 0
SwiftUI—使用渐变提高视觉的冲击力:绘制线性渐变