Unity Shader 颜色混合

╰半夏微凉° 2023-10-04 11:27 46阅读 0赞

混合模式  
可简单理解为 指上下层图片相互有重叠时如何取色的一种称呼

在编写shader时我们可以在SubShader或Pass中用Blend与BlendOp指明该对象与下一层色彩如何进行颜色混合

常用的混合模式通过Blend实现 如下所示

SubShader
    	{
        
    		Tags {
         "Queue"="Transparent"}
    		//Blend SrcAlpha OneMinusSrcAlpha  //正常透明混合
    		//BlendOp Min Blend One One //变暗
    		//BlendOp Max Blend One One //变亮
    		//Blend DstColor Zero //正片叠底 (Multiply)相乘 
    		Blend OneMinusDstColor One   //滤色 //柔和相加(soft Additive) 
    		//Blend DstColor SrcColor //两倍相乘 (2X Multiply) 
    		//Blend One One //线性减淡
    		Pass
    		{
        
    			CGPROGRAM
    			#pragma vertex vert
    			#pragma fragment frag
    			ENDCG
    		}
    	}

还可以用代码实现混合

左图是底图A，右图是要混合的图B  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70]

Unity实现与Ps效果对比图  
（左 Unity实现 右 Ps对比）  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 1]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 2]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 3]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 4]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 5]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 6]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 7]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 8]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 9]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 10]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 11]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 12]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 13]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 14]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 15]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 16]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 17]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 18]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 19]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 20]

//混合模式.
    Shader "Unlit/BlendMod2"
    {
        
    	Properties
    	{
        
    		_MainTex ("Texture", 2D) = "white" {
        }
    		_BlendTex ("Texture", 2D) = "white" {
        }
    	}
    	CGINCLUDE
    	#include "UnityCG.cginc"
    	struct appdata
    	{
        
    		float4 vertex : POSITION;
    		float2 uv : TEXCOORD0;
    	};
    	struct v2f
    	{
        
    		float2 uv : TEXCOORD0;
    		UNITY_FOG_COORDS(1)
    		float4 vertex : SV_POSITION;
    	};
    	sampler2D _MainTex;
    	float4 _MainTex_ST;
    	sampler2D _BlendTex;
    	v2f vert (appdata v)
    	{
        
    		v2f o;
    		o.vertex = UnityObjectToClipPos(v.vertex);
    		o.uv = TRANSFORM_TEX(v.uv, _MainTex);
    		UNITY_TRANSFER_FOG(o,o.vertex);
    		return o;
    	}
    	fixed4 frag (v2f i) : SV_Target
    	{
        
    		
    		fixed4 A = tex2D(_MainTex, i.uv);	//A为底图rgba 四维向量
    		fixed4 B = tex2D(_BlendTex,i.uv);	//B为混合图rgba 四维向量
    		
    		//--------只更改这的代码------------
    		fixed4 C =A*(1-B.a)+B*(B.a);	//正常透明度混合
    		//---------------------------------
    
    		// fixed4 C =A*(1-B.a)+B*(B.a);	//正常透明度混合
    
    		// fixed4 C =min(A,B);	//变暗
    
    		// fixed4 C =max(A,B);	//变亮
    
    		// fixed4 C =A*B ;	//正片叠底
    
    
    		// fixed4 C=1-((1-A)*(1-B));//滤色 A+B-A*B
    
    		// fixed4 C =A-((1-A)*(1-B))/B; //颜色加深
    
    		// fixed4 C= A+(A*B)/(1-B); //颜色减淡
    
    		// fixed4 C=A+B-1;//线性加深
    
    		// fixed4 C=A+B; //线性减淡
    		
    		// fixed4 ifFlag= step(A,fixed4(0.5,0.5,0.5,0.5));
    		// fixed4 C=ifFlag*A*B*2+(1-ifFlag)*(1-(1-A)*(1-B)*2);//叠加
    		
    		// fixed4 ifFlag= step(B,fixed4(0.5,0.5,0.5,0.5));
    		// fixed4 C=ifFlag*A*B*2+(1-ifFlag)*(1-(1-A)*(1-B)*2); //强光
    
    		// fixed4 ifFlag= step(B,fixed4(0.5,0.5,0.5,0.5));
    		// fixed4 C=ifFlag*(A*B*2+A*A*(1-B*2))+(1-ifFlag)*(A*(1-B)*2+sqrt(A)*(2*B-1)); //柔光
    		
    		// fixed4 ifFlag= step(B,fixed4(0.5,0.5,0.5,0.5));
    		// fixed4 C=ifFlag*(A-(1-A)*(1-2*B)/(2*B))+(1-ifFlag)*(A+A*(2*B-1)/(2*(1-B))); //亮光
    
    		// fixed4 ifFlag= step(B,fixed4(0.5,0.5,0.5,0.5));	//不知道为什么很多资料亮光效果都写两个min 实际效果还原应该是是一个min一个max
    		// fixed4 C=ifFlag*(min(A,2*B))+(1-ifFlag)*(max(A,( B*2-1))); //点光  
    		
    		// fixed4 C=A+2*B-1; //线性光
    
    		// fixed4 ifFlag= step(A+B,fixed4(1,1,1,1));
    		// fixed4 C=ifFlag*(fixed4(0,0,0,0))+(1-ifFlag)*(fixed4(1,1,1,1)); //实色混合
    
    		// fixed4 C=A+B-A*B*2; //排除
    
    		// fixed4 C=abs(A-B); //差值
    
    		// fixed4 ifFlag= step(B.r+B.g+B.b,A.r+A.g+A.b);
    		// fixed4 C=ifFlag*(B)+(1-ifFlag)*(A); //深色
    
    		// fixed4 ifFlag= step(B.r+B.g+B.b,A.r+A.g+A.b);
    		// fixed4 C=ifFlag*(A)+(1-ifFlag)*(B); //浅色
    
    		// fixed4 C=A-B; //减去
    
    		// fixed4 C=A/B; //划分
    
    		return C;
    	}
    	
    	ENDCG
    	SubShader
    	{
        
    		Tags {
         "Queue"="Transparent" }
    		
    		Pass
    		{
        
    			CGPROGRAM
    			#pragma vertex vert
    			#pragma fragment frag
    			// make fog work
    			#pragma multi_compile_fog
    			ENDCG
    		}
    	}
    }

项目源代码：https://github.com/QinZhuo/ShaderLab  
作者：琴卓  
https://www.bilibili.com/read/cv1874791/  
出处： bilibili

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20210421120527790.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20210421120824628.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210421120838356.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20210421120850920.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 4]: https://img-blog.csdnimg.cn/20210421120900930.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 5]: https://img-blog.csdnimg.cn/20210421120911501.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 6]: https://img-blog.csdnimg.cn/20210421120918686.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 7]: https://img-blog.csdnimg.cn/2021042112092850.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 8]: https://img-blog.csdnimg.cn/20210421121005890.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 9]: https://img-blog.csdnimg.cn/20210421121016116.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 10]: https://img-blog.csdnimg.cn/20210421121024233.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 11]: https://img-blog.csdnimg.cn/20210421121033813.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 12]: https://img-blog.csdnimg.cn/20210421121051379.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 13]: https://img-blog.csdnimg.cn/20210421121102162.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 14]: https://img-blog.csdnimg.cn/20210421121113262.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 15]: https://img-blog.csdnimg.cn/2021042112112534.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 16]: https://img-blog.csdnimg.cn/20210421121134862.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 17]: https://img-blog.csdnimg.cn/20210421121142915.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 18]: https://img-blog.csdnimg.cn/20210421121151194.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 19]: https://img-blog.csdnimg.cn/20210421121159261.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc_size_16_color_FFFFFF_t_70 20]: https://img-blog.csdnimg.cn/20210421121207959.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3RoaW5idWc=,size_16,color_FFFFFF,t_70