Text Outline

Author: Serge Billault

Description

Text outlining with independantly selectable interior and exterior. The pixel being rendered sample its surrounding according to outline _Thickness (in pixels) and deduce the outline alpha from the distance with the nearest outline inducing texture texel.

Preview

Code ( UI_TextOutline.shader )

Shader "Unlit/UITextOutline"
{
    Properties
    {
        /*                 */                 _MainTex     ( " Texture",       2D                 ) = "white" {}
        /*[PerRendererData]*/                 _OutlineColor( " Outline Color", Color              ) = ( 0.0, 0.0, 0.0, 1.0 )
        /*[PerRendererData]*/                 _Thickness   ( " Thickness",     Range( 1.0, 16.0 ) ) = 2.1
        /*[PerRendererData]*/[MaterialToggle] _Exterior    ( " Exterior", Float ) = 1.0
        /*[PerRendererData]*/[MaterialToggle] _Interior    ( " Interior", Float ) = 0.0
    }
 
    SubShader
    {
        Tags 
        { 
            "Queue"      = "Transparent"
            "RenderType" = "Opaque"
        }
 
        LOD 100
 
        Blend SrcAlpha OneMinusSrcAlpha
 
        Pass
        {
            CGPROGRAM
 
                //********************************************************************************************
                //
                //********************************************************************************************
 
                #pragma vertex   vert
                #pragma fragment frag
 
                #include "UnityCG.cginc"
 
                //********************************************************************************************
                //
                //********************************************************************************************
 
                struct appdata
                {
                    float4 vertex : POSITION;
                    float2 uv     : TEXCOORD0;
                    float4 color  : COLOR;
                };
 
                struct v2f
                {
                    float4 vertex : SV_POSITION;
                    float2 uv     : TEXCOORD0;
                    float4 color  : COLOR;
                };
 
                static const fixed alpha_threshold = 0.25f;
 
                //********************************************************************************************
                //
                //********************************************************************************************
 
                sampler2D _MainTex;
                fixed4    _MainTex_TexelSize;
                fixed4    _MainTex_ST;
                fixed4    _OutlineColor;
                fixed     _Thickness;
                fixed     _Exterior;
                fixed     _Interior;
 
                //********************************************************************************************
                //
                //********************************************************************************************
 
                fixed GetOutineAlpha( v2f i, fixed a, bool exterior )
                {
                    bool valid_context = exterior ? ( a < alpha_threshold ) : ( a > alpha_threshold );
                    if ( valid_context )
                    {
                        fixed  texel_w = _MainTex_TexelSize.x;
                        fixed  texel_h = _MainTex_TexelSize.y;
                        fixed  min_dst = 1.0e38f;
                        fixed  dst;
                        fixed2 uv;
                        fixed4 sampling;
 
                        for( int x = -_Thickness; x <= _Thickness; ++x )
                        {
                            for( int y = -_Thickness; y <= _Thickness; ++y )
                            {
                                uv.x     = i.uv.x + ( x * texel_w );
                                uv.y     = i.uv.y + ( y * texel_h );
                                sampling = tex2Dlod( _MainTex, fixed4( uv.x, uv.y, 0, 0 ) );
 
 
                                bool outline = exterior ? ( sampling.a >= alpha_threshold ) : ( sampling.a <= alpha_threshold );
                                if ( outline )
                                {
                                    dst = ( x * x ) + ( y * y );
                                    if( min_dst > dst ) min_dst = dst;
                                }
                            }
                        }
 
                        if( min_dst < 1.0e38f )
                        {
                            fixed  alpha = 1.0f - ( clamp( ( min_dst ) / ( _Thickness * _Thickness ), 0.0f, 1.0f ) );
                            return alpha;
                        }
                    }
 
                    return -1.0f;
                }
 
                //********************************************************************************************
                //
                //********************************************************************************************
 
                v2f vert( appdata v )
                {
                    v2f o;
 
                    o.vertex = UnityObjectToClipPos( v.vertex );
                    o.uv     = TRANSFORM_TEX( v.uv, _MainTex );
                    o.color  = v.color;
                    return o;
                }
 
                //********************************************************************************************
                //
                //********************************************************************************************
 
                fixed4 frag( v2f i ) : SV_Target
                {
                    fixed4 output = tex2D( _MainTex, i.uv );
 
                          output = fixed4( i.color.r, i.color.g, i.color.b, output.a );
 
                    if( _Exterior > 0.0f )
                    {
                        fixed outline_alpha = GetOutineAlpha( i, output.a, true  );
                        if( outline_alpha > 0.0f ) return fixed4( _OutlineColor.r, _OutlineColor.g, _OutlineColor.b, _OutlineColor.a * outline_alpha * i.color.a );
                    }
 
                    if( _Interior > 0.0f )
                    {
                        fixed outline_alpha = GetOutineAlpha( i, output.a, false );
                        if( outline_alpha > 0.0f )
                        {
                            fixed4 material_color = fixed4( i.color.r, i.color.g, i.color.b, 1.0f );
                            fixed4 result         = lerp( material_color, _OutlineColor, outline_alpha );
                            return fixed4( result.r, result.g, result.b, result.a * i.color.a );
                        }
                    }
 
                    return output;
                }
 
            ENDCG
        }
    }
}

License

Well, it's one of my first shaders, so... . Planet free.