【Unity Shader】用shader控制背景的傾斜漸變
阿新 • • 發佈:2019-01-28
07/19更新,修復了之前的問題
07/14更新,這個效果有點不對,因為是按比例取的顏色,所以可以看到右下角明顯偏亮。。。待修改。。。
需要用到一個背景圖是斜著漸變的,且需要不斷地變化背景顏色,所以不適合美術為每一種顏色背景切圖,用shader來控制是最好的
效果圖:
材質Inspector:
圖片效果由三個引數確定,兩個顏色分別表示兩邊的顏色,weights用來計算插值時候的權重
Shader "Custom/Fade"
{
Properties
{
[KeywordEnum(X, Y)] _FadeWith ("Fade With", Float) = 0
_Color1 ("Color1", Color) = (1.0,1.0,1.0,1.0)
_Color2 ("Color2", Color) = (0.0,0.0,0.0,1.0)
[PowerSlider(1)] _Weights ("Weights", Range (0.0, 2.0)) = 1.0
}
SubShader
{
Pass
{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float2 uv : TEXCOORD0;
float4 vertex : SV_POSITION;
};
fixed4 _Color1;
fixed4 _Color2;
float _Weights;
//計算給定point點到經過linePoint的直線line的距離
float getPointLineDist(float2 pt, float2 linePoint, float2 ln)
{
float dist;
float2 point2point = pt - linePoint;
dist = length(dot(pt, ln) * ln/length(ln) - point2point);
return dist;
}
v2f vert (appdata v)
{
v2f o;
o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
o.uv = v.uv;
return o;
}
//注意,uv的最大值是(1, 1)
fixed4 frag (v2f i) : SV_Target
{
fixed4 col;
float2 pt; //point
float2 linePoint = float2(1,1);
float2 ln = float2(-1, 1); //line
pt = float2(i.uv.x, i.uv.y * 1);
float pointLineDist = getPointLineDist(pt, linePoint, ln);
float maxLineDist = getPointLineDist(float2(0, 0), linePoint, ln);
float lp = pointLineDist / maxLineDist * _Weights;
col = lerp(_Color1, _Color2, lp);
return col;
}
ENDCG
}
}
}
擴充套件:可以再設一個引數來對顏色進行blend,只要乘一下最後return的col就行了。