UnityShader3實(shí)現(xiàn)2D描邊效果
本文實(shí)例為大家分享了UnityShader3實(shí)現(xiàn)2D描邊效果的具體代碼,供大家參考,具體內(nèi)容如下
1.
Shader "Custom/Edge" { Properties { _MainTex ("Texture", 2D) = "white" {} _OffsetUV ("OffsetUV", Range(0, 1)) = 0.1 _EdgeColor ("EdgeColor", Color) = (1, 0, 0, 1) _AlphaTreshold ("Treshold", Range(0, 1)) = 0.5 } SubShader { Tags { "Queue" = "Transparent" } Blend SrcAlpha OneMinusSrcAlpha Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" struct appdata { float4 vertex : POSITION; fixed2 uv : TEXCOORD0; }; struct v2f { float4 vertex : SV_POSITION; fixed2 uv[5] : TEXCOORD0; }; sampler2D _MainTex; float4 _MainTex_ST; fixed _OffsetUV; fixed4 _EdgeColor; fixed _AlphaTreshold; v2f vert (appdata v) { v2f o; o.vertex = mul(UNITY_MATRIX_MVP, v.vertex); o.uv[0] = v.uv; o.uv[1] = v.uv + fixed2(0, _OffsetUV); //up o.uv[2] = v.uv + fixed2(-_OffsetUV, 0); //left o.uv[3] = v.uv + fixed2(0, -_OffsetUV); //bottom o.uv[4] = v.uv + fixed2(_OffsetUV, 0); //right return o; } fixed4 frag (v2f i) : SV_Target { fixed4 original = tex2D(_MainTex, i.uv[0]); fixed alpha = original.a; fixed p1 = tex2D(_MainTex, i.uv[1]).a; fixed p2 = tex2D(_MainTex, i.uv[2]).a; fixed p3 = tex2D(_MainTex, i.uv[3]).a; fixed p4 = tex2D(_MainTex, i.uv[4]).a; alpha = p1 + p2 + p3 + p4 + alpha; alpha /= 5; if (alpha < _AlphaTreshold) original.rgb = _EdgeColor.rgb; return original; } ENDCG } } }
2.
Shader "Custom/Edge" { Properties { _Edge ("Edge", Range(0, 0.2)) = 0.043 _EdgeColor ("EdgeColor", Color) = (1, 1, 1, 1) _MainTex ("MainTex", 2D) = "white" {} } SubShader { Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" fixed _Edge; fixed4 _EdgeColor; sampler2D _MainTex; struct appdata { float4 vertex : POSITION; fixed2 uv : TEXCOORD0; }; struct v2f { float4 vertex : SV_POSITION; float4 objVertex : TEXCOORD0; fixed2 uv : TEXCOORD1; }; v2f vert (appdata v) { v2f o; o.vertex = mul(UNITY_MATRIX_MVP, v.vertex); o.objVertex = v.vertex; o.uv = v.uv; return o; } fixed4 frag (v2f i) : SV_Target { fixed x = i.uv.x; fixed y = i.uv.y; if((x < _Edge) || (abs(1 - x) < _Edge) || (y < _Edge) || (abs(1 - y) < _Edge)) { return _EdgeColor * abs(cos(_Time.y)); } else { fixed4 color = tex2D(_MainTex, i.uv); return color; } //return i.objVertex; //return fixed4(i.uv, 0, 1); } ENDCG } } }
3.如下圖,左邊是一個Image,右邊是一個Plane。
// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)' Shader "Custom/Edge" { Properties { _Edge ("Edge", Range(0, 0.2)) = 0.043 _EdgeColor ("EdgeColor", Color) = (1, 1, 1, 1) _FlowColor ("FlowColor", Color) = (1, 1, 1, 1) _FlowSpeed ("FlowSpeed", Range(0, 10)) = 3 _MainTex ("MainTex", 2D) = "white" {} } SubShader { Tags { "Queue"="Transparent" "RenderType"="Transparent" "IgnoreProjector"="True" } Pass { ZWrite Off Blend SrcAlpha OneMinusSrcAlpha CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" fixed _Edge; fixed4 _EdgeColor; fixed4 _FlowColor; float _FlowSpeed; sampler2D _MainTex; struct appdata { float4 vertex : POSITION; fixed2 uv : TEXCOORD0; }; struct v2f { float4 vertex : SV_POSITION; fixed2 uv : TEXCOORD1; }; v2f vert (appdata v) { v2f o; o.vertex = UnityObjectToClipPos(v.vertex); o.uv = v.uv; return o; } fixed4 frag (v2f i) : SV_Target { fixed x = i.uv.x; fixed y = i.uv.y; if((x < _Edge) || (abs(1 - x) < _Edge) || (y < _Edge) || (abs(1 - y) < _Edge)) { //點(diǎn)旋轉(zhuǎn)公式: //假設(shè)對圖片上任意點(diǎn)(x,y),繞一個坐標(biāo)點(diǎn)(rx0,ry0)逆時針旋轉(zhuǎn)a角度后的新的坐標(biāo)設(shè)為(x0,y0),有公式: //x0 = (x - rx0) * cos(a) - (y - ry0) * sin(a) + rx0 ; //y0 = (x - rx0) * sin(a) + (y - ry0) * cos(a) + ry0 ; float a = _Time.y * _FlowSpeed; float2 rotUV; x -= 0.5; y -= 0.5; rotUV.x = x * cos(a) - y * sin(a) + 0.5; rotUV.y = x * sin(a) + y * cos(a) + 0.5; fixed temp = saturate(rotUV.x - 0.5);//-0.5作用是調(diào)整流動顏色的比例 return _EdgeColor * (1 - temp) + _FlowColor * temp; } else { //fixed4 color = tex2D(_MainTex, i.uv); return fixed4(1, 1, 1, 0); } } ENDCG } } }
4.通過觀察上面的效果圖,會發(fā)現(xiàn)右邊的Plane出現(xiàn)了鋸齒。而解決鋸齒一般的方法就是做模糊處理,模糊處理一般又有貼圖處理和代碼處理之分,這里使用的是貼圖處理。貼圖處理需要提供一張邊界模糊的貼圖。
如上圖,左下是內(nèi)邊反鋸齒的圖,右上是未經(jīng)處理的圖。
// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)' Shader "Custom/Edge2" { Properties { _Edge ("Edge", Range(0, 0.2)) = 0.043 _EdgeColor ("EdgeColor", Color) = (1, 1, 1, 1) _FlowColor ("FlowColor", Color) = (1, 1, 1, 1) _FlowSpeed ("FlowSpeed", Range(0, 10)) = 3 _MainTex ("MainTex", 2D) = "white" {} } SubShader { Tags { "Queue"="Transparent" "RenderType"="Transparent" "IgnoreProjector"="True" } Pass { ZWrite Off Blend SrcAlpha OneMinusSrcAlpha CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" fixed _Edge; fixed4 _EdgeColor; fixed4 _FlowColor; float _FlowSpeed; sampler2D _MainTex; struct appdata { float4 vertex : POSITION; fixed2 uv : TEXCOORD0; }; struct v2f { float4 vertex : SV_POSITION; fixed2 uv : TEXCOORD1; }; v2f vert (appdata v) { v2f o; o.vertex = UnityObjectToClipPos(v.vertex); o.uv = v.uv; return o; } fixed4 frag (v2f i) : SV_Target { fixed4 color = tex2D(_MainTex, i.uv); float alpha = color.a; fixed x = i.uv.x; fixed y = i.uv.y; float a = _Time.y * _FlowSpeed; float2 rotUV; x -= 0.5; y -= 0.5; rotUV.x = x * cos(a) - y * sin(a) + 0.5; rotUV.y = x * sin(a) + y * cos(a) + 0.5; fixed temp = saturate(rotUV.x - 0.5);//-0.5作用是調(diào)整流動顏色的比例 fixed4 finalColor = _EdgeColor * (1 - temp) + _FlowColor * temp; finalColor.a = alpha; return finalColor; } ENDCG } } }
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持我們。
上一篇:Unity3D UGUI實(shí)現(xiàn)縮放循環(huán)拖動卡牌展示效果
欄 目:C#教程
下一篇:Unity3D實(shí)現(xiàn)虛擬按鈕控制人物移動效果
本文標(biāo)題:UnityShader3實(shí)現(xiàn)2D描邊效果
本文地址:http://mengdiqiu.com.cn/a1/C_jiaocheng/4896.html
您可能感興趣的文章
- 01-10C#實(shí)現(xiàn)txt定位指定行完整實(shí)例
- 01-10WinForm實(shí)現(xiàn)仿視頻 器左下角滾動新聞效果的方法
- 01-10C#實(shí)現(xiàn)清空回收站的方法
- 01-10C#實(shí)現(xiàn)讀取注冊表監(jiān)控當(dāng)前操作系統(tǒng)已安裝軟件變化的方法
- 01-10C#實(shí)現(xiàn)多線程下載文件的方法
- 01-10C#實(shí)現(xiàn)Winform中打開網(wǎng)頁頁面的方法
- 01-10C#實(shí)現(xiàn)遠(yuǎn)程關(guān)閉計算機(jī)或重啟計算機(jī)的方法
- 01-10C#自定義簽名章實(shí)現(xiàn)方法
- 01-10C#文件斷點(diǎn)續(xù)傳實(shí)現(xiàn)方法
- 01-10winform實(shí)現(xiàn)創(chuàng)建最前端窗體的方法


閱讀排行
本欄相關(guān)
- 01-10C#通過反射獲取當(dāng)前工程中所有窗體并
- 01-10關(guān)于ASP網(wǎng)頁無法打開的解決方案
- 01-10WinForm限制窗體不能移到屏幕外的方法
- 01-10WinForm繪制圓角的方法
- 01-10C#實(shí)現(xiàn)txt定位指定行完整實(shí)例
- 01-10WinForm實(shí)現(xiàn)仿視頻 器左下角滾動新
- 01-10C#停止線程的方法
- 01-10C#實(shí)現(xiàn)清空回收站的方法
- 01-10C#通過重寫Panel改變邊框顏色與寬度的
- 01-10C#實(shí)現(xiàn)讀取注冊表監(jiān)控當(dāng)前操作系統(tǒng)已
隨機(jī)閱讀
- 01-10SublimeText編譯C開發(fā)環(huán)境設(shè)置
- 01-11ajax實(shí)現(xiàn)頁面的局部加載
- 01-10delphi制作wav文件的方法
- 04-02jquery與jsp,用jquery
- 01-11Mac OSX 打開原生自帶讀寫NTFS功能(圖文
- 08-05織夢dedecms什么時候用欄目交叉功能?
- 01-10使用C語言求解撲克牌的順子及n個骰子
- 08-05dedecms(織夢)副欄目數(shù)量限制代碼修改
- 08-05DEDE織夢data目錄下的sessions文件夾有什
- 01-10C#中split用法實(shí)例總結(jié)