圓角計算 Shader

圓角的計算

　　在Shader中，我們使用UV坐標來計算需要顯示的部分和不需要顯示的部分，使用透明來處理顯示與不顯示。UV坐標如下圖1，我們將坐標平移到圖2位置，面片的UV坐標原點在面片中心，UV坐標范圍是[0,1]。

　　    

 

　　我們現在用計算圓的半徑的方式來計算，在如圖所示的區域（綠色線區分）1,2,3,4內產生圓角：

　　b

　　　　1. 在1區域內，加入區域的左下角是原點（0,0），長度是0.1，R = length(x,y)，R大於0.1那么透明，小於等於0.1不透明，（4個區域內同理）；

　　　　2. 在5,6,7,8區域內，不透明；

 

Shader 程序：

　　

Shader "JQM/Test02"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
    }
    SubShader
    {

        Pass
        {
            Tags {"Queue" = "Transparent"}       
            ZWrite Off       
            Blend SrcAlpha OneMinusSrcAlpha    

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

            sampler2D _MainTex;
            float4 _MainTex_ST;

            struct VertexOutPut
            {
                float4 pos : SV_POSITION;
                float2 uv : TEXCOORD0;
            };
            
            VertexOutPut vert (appdata_full v)
            {
                VertexOutPut o;
                o.pos = mul (UNITY_MATRIX_MVP, v.vertex);    
                o.uv = v.texcoord.xy;  

                return o;
            }
            
            fixed4 frag (VertexOutPut i) : COLOR
            {//圓角
                float2 uv = i.uv.xy - float2(0.5,0.5);//移動UV坐標中心    
                float rx = fmod(uv.x, 0.4);//圓角所在區域，也就是圓角半徑為0.1
                float ry = fmod(uv.y, 0.4);//
                float mx = step(0.4, abs(uv.x));//大於0.4的部分， step(a，x):x<a取0，否則返回1
　　　　　　　　　 float my = step(0.4, abs(uv.y));// 
　　　　　　　　　float alpha = 1 - mx*my*step(0.1, length(half2(rx,ry)));//在[0,0.4]范圍，mx*my始終為0，最終值始終為1；在（0.4,0.5]范圍，所在的圓角區域，mx*my使用為1，大小由圓角半徑決定；在剩下的其他區域，mx*my也是為0，最終值為；

　　　　　　　　　return float4(1,1,1,alpha);// 
　　　　　　　　} 
　　　　　　ENDCG } } }

 

CG函數

　　fmod(x,y)

　　　　：返回 x/y 的余數。如果 y 為 0，結果不可預料。

　　step(a,x)

　　　　：如果 x<a，返回 0；否則，返回 1。