《Unity Shader 入门精要》从Bulit-in 到URP （HLSL）Chapter13.3-基于深度纹理的雾效（屏幕后措置）

ghgh456

前言：

已经进入“高级篇”啦，但愿大师多多撑持，多多存眷，这将对我发生非常愉悦的正反馈~

“《Unity Shader 入门精要》从Bulit-in 到URP”是一个辅佐Unity Shader学习者以冯乐乐女神《Unity Shader 入门精要》为基础学习用HLSL语言编写URP着色器的案例教学系列。

作者自学能力有限，抛砖引玉，如有建议和问题请各位大佬和同仁交流斧正。

如安在URP中实现后措置参见：

Bulit-in版：

1. // Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)'
3. Shader ”Unity Shaders Book/Chapter 13/Fog With Depth Texture” {
4.         Properties {
5.                 _MainTex (”Base (RGB)”, 2D) = ”white” {}
6.                 _FogDensity (”Fog Density”, Float) = 1.0
7.                 _FogColor (”Fog Color”, Color) = (1, 1, 1, 1)
8.                 _FogStart (”Fog Start”, Float) = 0.0
9.                 _FogEnd (”Fog End”, Float) = 1.0
10.         }
11.         SubShader {
12.                 CGINCLUDE
13.                
14.                 #include ”UnityCG.cginc”
15.                
16.                 float4x4 _FrustumCornersRay;
17.                
18.                 sampler2D _MainTex;
19.                 half4 _MainTex_TexelSize;
20.                 sampler2D _CameraDepthTexture;
21.                 half _FogDensity;
22.                 fixed4 _FogColor;
23.                 float _FogStart;
24.                 float _FogEnd;
25.                
26.                 struct v2f {
27.                         float4 pos : SV_POSITION;
28.                         half2 uv : TEXCOORD0;
29.                         half2 uv_depth : TEXCOORD1;
30.                         float4 interpolatedRay : TEXCOORD2;
31.                 };
32.                
33.                 v2f vert(appdata_img v) {
34.                         v2f o;
35.                         o.pos = UnityObjectToClipPos(v.vertex);
36.                        
37.                         o.uv = v.texcoord;
38.                         o.uv_depth = v.texcoord;
39.                        
40.                         #if UNITY_UV_STARTS_AT_TOP
41.                         if (_MainTex_TexelSize.y < 0)
42.                                 o.uv_depth.y = 1 - o.uv_depth.y;
43.                         #endif
44.                        
45.                         int index = 0;
46.                         if (v.texcoord.x < 0.5 && v.texcoord.y < 0.5) {
47.                                 index = 0;
48.                         } else if (v.texcoord.x > 0.5 && v.texcoord.y < 0.5) {
49.                                 index = 1;
50.                         } else if (v.texcoord.x > 0.5 && v.texcoord.y > 0.5) {
51.                                 index = 2;
52.                         } else {
53.                                 index = 3;
54.                         }
56.                         #if UNITY_UV_STARTS_AT_TOP
57.                         if (_MainTex_TexelSize.y < 0)
58.                                 index = 3 - index;
59.                         #endif
60.                        
61.                         o.interpolatedRay = _FrustumCornersRay[index];
62.                                           
63.                         return o;
64.                 }
65.                
66.                 fixed4 frag(v2f i) : SV_Target {
67.                         float linearDepth = LinearEyeDepth(SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, i.uv_depth));
68.                         float3 worldPos = _WorldSpaceCameraPos + linearDepth * i.interpolatedRay.xyz;
69.                                                
70.                         float fogDensity = (_FogEnd - worldPos.y) / (_FogEnd - _FogStart);
71.                         fogDensity = saturate(fogDensity * _FogDensity);
72.                        
73.                         fixed4 finalColor = tex2D(_MainTex, i.uv);
74.                         finalColor.rgb = lerp(finalColor.rgb, _FogColor.rgb, fogDensity);
75.                        
76.                         return finalColor;
77.                 }
78.                
79.                 ENDCG
80.                
81.                 Pass {
82.                         ZTest Always Cull Off ZWrite Off
83.                                     
84.                         CGPROGRAM  
85.                        
86.                         #pragma vertex vert  
87.                         #pragma fragment frag  
88.                           
89.                         ENDCG  
90.                 }
91.         }
92.         FallBack Off
93. }

复制代码

URP版：

Unity项目源码：

1. Shader ”Unlit/Chapter13-FogWithDepthTexture”
2. {
3.     Properties {
4.                 _MainTex (”Base (RGB)”, 2D) = ”white” {}
5.                 _FogDensity (”Fog Density”, Float) = 1.0
6.                 _FogColor (”Fog Color”, Color) = (1, 1, 1, 1)
7.                 _FogStart (”Fog Start”, Float) = 0.0
8.                 _FogEnd (”Fog End”, Float) = 1.0
9.         }
10.     SubShader
11.     {
12.         Tags { ”RenderPipeline” = ”UniversalPipeline” }
13.         
14.         HLSLINCLUDE
15.         #include ”Packages/com.unity.render-pipelines.universal/ShaderLibrary/Core.hlsl”
16.                 #include ”Packages/com.unity.render-pipelines.universal/ShaderLibrary/Lighting.hlsl”
18.         CBUFFER_START(UnityPerMaterial)
19.             float4x4 _FrustumCornersRay;
20.                
21.             half4 _MainTex_TexelSize;
22.             half _FogDensity;
23.             half4 _FogColor;
24.             float _FogStart;
25.             float _FogEnd;
26.         CBUFFER_END
28.         TEXTURE2D(_MainTex);       SAMPLER(sampler_MainTex);
29.         TEXTURE2D(_CameraDepthTexture);       SAMPLER(sampler_CameraDepthTexture);
30.         //如果在URP Asset设置下勾选 depth texture选项系统会自动生成一张以_CameraDepthTexture为名的深度图，抽时间会写一篇相关文章并把链接补充到本篇中。
32.         struct appdata{
33.             float4 vertex : POSITION;
34.             float2 texcoord : TEXCOORD0;
35.         };
37.         struct v2f {
38.                         float4 pos : SV_POSITION;
39.                         half2 uv : TEXCOORD0;
40.                         half2 uv_depth : TEXCOORD1;
41.                         float4 interpolatedRay : TEXCOORD2;
42.         };
43.         v2f vert(appdata v) {
44.                         v2f o;
45.                        
46.                         o.pos = TransformObjectToHClip(v.vertex);
47.                        
48.                         o.uv = v.texcoord;
49.             o.uv_depth = v.texcoord;
50.             #if UNITY_UV_STARTS_AT_TOP
51.                         if (_MainTex_TexelSize.y < 0)
52.                                 o.uv_depth.y = 1 - o.uv_depth.y;
53.                         #endif
55.             int index = 0;
56.                         if (v.texcoord.x < 0.5 && v.texcoord.y < 0.5) {
57.                                 index = 0;
58.                         } else if (v.texcoord.x > 0.5 && v.texcoord.y < 0.5) {
59.                                 index = 1;
60.                         } else if (v.texcoord.x > 0.5 && v.texcoord.y > 0.5) {
61.                                 index = 2;
62.                         } else {
63.                                 index = 3;
64.                         }
66.                         #if UNITY_UV_STARTS_AT_TOP
67.                         if (_MainTex_TexelSize.y < 0)
68.                                 index = 3 - index;
69.                         #endif
70.                        
71.                         o.interpolatedRay = _FrustumCornersRay[index];
72.             //尽管我们这里使用了很多判断语句，但由于屏幕后措置所用的模型是一个四边形网格，只包含4个顶点，因此这些操作不会对性能造成很大影响。
73.                                          
74.                         return o;
75.                 }
77.         half4 frag(v2f i) : SV_Target {
78.                         float linearDepth = LinearEyeDepth(SAMPLE_DEPTH_TEXTURE(_CameraDepthTexture, sampler_CameraDepthTexture,i.uv_depth), _ZBufferParams);
79.             //使用LinearEyeDepth得到视角空间下的线性深度值
80.                         float3 worldPos = _WorldSpaceCameraPos + linearDepth * i.interpolatedRay.xyz;
81.                                                
82.                         float fogDensity = (_FogEnd - worldPos.y) / (_FogEnd - _FogStart);
83.                         fogDensity = saturate(fogDensity * _FogDensity);
84.                        
85.                         half4 finalColor = SAMPLE_TEXTURE2D(_MainTex, sampler_MainTex, i.uv);
86.                         finalColor.rgb = lerp(finalColor.rgb, _FogColor.rgb, fogDensity);
87.                        
88.                         return finalColor;
89.                 }
90.                
91.                 ENDHLSL
92.                
93.                 Pass {
94.                         ZTest Always Cull Off ZWrite Off
95.                                     
96.                         HLSLPROGRAM  
97.                        
98.                         #pragma vertex vert  
99.                         #pragma fragment frag  
100.                           
101.                         ENDHLSL  
102.                 }
103.         }
104.         FallBack ”Packages/com.unity.render-pipelines.universal/FallbackError”
105. }

复制代码

URP后措置脚本

因为和上面提供的（Post-processing : RenderFeature + VolumeComponent）模板有些许差异，因此在此提供对应源码。

1. using System;
2. using UnityEngine;
3. using UnityEngine.Rendering;
4. using UnityEngine.Rendering.Universal;
6. public class FogWithDepthTexture : ScriptableRendererFeature
7. {
8.     [Serializable, VolumeComponentMenu(”Ding Post-processing/13.3 FogWithDepthTexture”)]
9.     public class CustomVolumeComponent : DingVolumeComponentBase
10.     {
11.         public ClampedFloatParameter FogDensity = new ClampedFloatParameter(1.0f, 0, 3.0f);
12.         public MinFloatParameter FogStart = new MinFloatParameter(0f, 0f);
13.         public MinFloatParameter FogEnd = new MinFloatParameter(2.0f, 0f);
15.         public ColorParameter FogColor = new ColorParameter(Color.white, false, false, true);
16.    
17.         public override bool IsActive() => isRender.value;
18.         public override bool IsTileCompatible() => false;
20.     }
22.     class CustomRenderPass : ScriptableRenderPass
23.     {
24.         
25.         public Material material;
26.         private Matrix4x4 frustumCorners;
27.         //RT的滤波模式
28.         public FilterMode filterMode {get; set;}
29.         //当前衬着阶段的colorRT
30.         //RenderTargetIdentifier、RenderTargetHandle都可以理解为RT，Identifier为camera提供的需要被应用的texture，Handle为被shader措置衬着过的RT
31.         private RenderTargetIdentifier source {get; set;}
32.         //private RenderTargetHandle destination {get; set;}
33.         //辅助RT
34.         private RenderTargetHandle tempTexture;
35.         string m_ProfilerTag;
36.         //Profiling上显示
37.         public CustomVolumeComponent volume;
38.         ProfilingSampler m_ProfilingSampler = new ProfilingSampler(”URPDing”);
40.         public CustomRenderPass(RenderPassEvent renderPassEvent, Shader shader, CustomVolumeComponent volume, string tag){
41.             //确定在哪个阶段插入衬着
42.             this.renderPassEvent = renderPassEvent;
43.             this.volume = volume;
44.             if(shader == null){return;}
45.             this.material = CoreUtils.CreateEngineMaterial(shader);
46.             m_ProfilerTag = tag;
47.             //初始化辅助RT的名字
48.             tempTexture.Init(”_TempRTexture”);
49.         }
51.         public void Setup(RenderTargetIdentifier source){
52.             this.source = source;
53.             //this.destination = destination;
54.         }
55.         
56.         
57.         public override void Execute(ScriptableRenderContext context, ref RenderingData renderingData)
58.         {
59.             if (!volume.IsActive()) {
60.                 return;
61.             }
62.             CommandBuffer cmd = CommandBufferPool.Get(”m_ProfilerTag”);
63.             //using 方式可以实此刻FrameDebug上查看衬着过程
64.             using(new ProfilingScope(cmd, m_ProfilingSampler)){
65.                 Camera camera = renderingData.cameraData.camera;
66.                 //获取摄像机
67.                 Transform cameraTransform = camera.transform;
69.                 float fov = camera.fieldOfView;
70.                 float near = camera.nearClipPlane;
71.                 float far = camera.farClipPlane;
72.                 float aspect = camera.aspect;
74.                 float halfHeight = near * Mathf.Tan(fov * 0.5f * Mathf.Deg2Rad);
75.                 Vector3 toRight = cameraTransform.right * halfHeight * aspect;
76.                 Vector3 toTop = cameraTransform.up * halfHeight;
77.                 Vector3 topLeft = cameraTransform.forward * near + toTop - toRight;
78.                 float scale = topLeft.magnitude / near;
79.                 topLeft.Normalize();
80.                 topLeft *= scale;
81.                 Vector3 topRight = cameraTransform.forward * near + toRight + toTop;
82.                 topRight.Normalize();
83.                 topRight *= scale;
84.                 Vector3 bottomLeft = cameraTransform.forward * near - toTop - toRight;
85.                 bottomLeft.Normalize();
86.                 bottomLeft *= scale;
87.                 Vector3 bottomRight = cameraTransform.forward * near + toRight - toTop;
88.                 bottomRight.Normalize();
89.                 bottomRight *= scale;
91.                 frustumCorners.SetRow(0, bottomLeft);
92.                 frustumCorners.SetRow(1, bottomRight);
93.                 frustumCorners.SetRow(2, topRight);
94.                 frustumCorners.SetRow(3, topLeft);
96.                 material.SetMatrix(”_FrustumCornersRay”, frustumCorners);
97.                 material.SetMatrix(”_ViewProjectionInverseMatrix”, (camera.projectionMatrix * camera.worldToCameraMatrix).inverse);
99.                 material.SetFloat(”_FogDensity”, volume.FogDensity.value);
100.                 material.SetFloat(”_FogStart”, volume.FogStart.value);
101.                 material.SetFloat(”_FogEnd”, volume.FogEnd.value);
103.                 material.SetColor(”_FogColor”, volume.FogColor.value);
104.                 //创建一张RT
105.                 RenderTextureDescriptor cameraTextureDesc = renderingData.cameraData.cameraTargetDescriptor;
106.                 cameraTextureDesc.depthBufferBits = 0;
107.                 cameraTextureDesc.msaaSamples = 1;
108.                 //打消抗锯齿措置,抗锯齿会影响unity自动在DX与OpenGL间的坐标转换
109.                 cmd.GetTemporaryRT(tempTexture.id, cameraTextureDesc, filterMode);
110.                
111.                 //将当前帧的colorRT用着色器（shader in material）衬着后输出到之前创建的贴图（辅助RT）上
112.                 Blit(cmd, source, tempTexture.Identifier(), material, 0);
113.                     //将措置后的辅助RT从头衬着到当前帧的colorRT上
114.                 Blit(cmd, tempTexture.Identifier(), source);
116.             }
117.             //执行衬着
118.             context.ExecuteCommandBuffer(cmd);
119.             //释放回收
120.             CommandBufferPool.Release(cmd);
121.         }
124.         public override void FrameCleanup(CommandBuffer cmd){
125.             base.FrameCleanup(cmd);
126.             cmd.ReleaseTemporaryRT(tempTexture.id);
127.         }
128.     }
130.     [System.Serializable]
131.     public class Settings{
132.         public RenderPassEvent Event = RenderPassEvent.AfterRenderingTransparents;
133.         public Shader shader;
134.     }
136.     public Settings settings = new Settings();
137.     CustomVolumeComponent volume;
138.     CustomRenderPass m_ScriptablePass;
140.    
142.     /// <inheritdoc/>
143.     //feature被创建时调用
144.     public override void Create()
145.     {
146.         var stack = VolumeManager.instance.stack;
147.         volume = stack.GetComponent<CustomVolumeComponent>();
148.         if (volume == null) {
149.             CoreUtils.Destroy(m_ScriptablePass.material);
150.             return;
151.         }
152.         m_ScriptablePass = new CustomRenderPass(settings.Event, settings.shader, volume, name);
153.     }
155.     //每一帧城市调用
156.     public override void AddRenderPasses(ScriptableRenderer renderer, ref RenderingData renderingData)
157.     {
158.         var src = renderer.cameraColorTarget;
159.         //var dest = RenderTargetHandle.CameraTarget;
161.         if(settings.shader == null){
162.             Debug.LogWarningFormat(”shader丢掉”,GetType().Name);
163.             return;
164.         }
166.         //将当前衬着的colorRT传到Pass中
168.         m_ScriptablePass.Setup(src);
170.         //将Pass添加到衬着队列中
171.         renderer.EnqueuePass(m_ScriptablePass);
172.     }
174.     protected override void Dispose(bool disposing)
175.     {
176.         base.Dispose(disposing);
177.    
178.     }
179. }

复制代码

效果图：

因为我在sense中使用的是图片，图片上没有深度分歧，所以无法在图片上不雅察看到深度分歧的雾效区别，图片以外区域可以感到感染到稍微明显的深度雾效。


如有收获，请留下“存眷”和“附和”~