Unity Shader 径向模糊与径向 UV 变形速度感 · 冲击波效果完全指南

Section 01效果目标与使用场景径向模糊Radial Blur是一种以屏幕或世界空间某点为中心 沿中心→当前像素方向做多步偏移采样并加权混合的后处理技术。 它能制造出镜头快速推进、子弹时间、冲击波爆炸等极具视觉冲击力的效果。典型应用场景技能释放— 大招激活瞬间的速度推进感爆炸 / 核弹— 环形冲击波 UV 扭曲飞行 / 超速— 持续径向模糊配合速度参数受击反馈— 短暂的径向击打震荡传送门 / 瞬移— 进入时镜头拉扯感Section 02核心原理径向 UV 偏移理解径向模糊的关键在于理解采样方向的构造。 对于屏幕上的任意像素P(u,v) 其模糊方向就是从中心 C指向 P 的向量。核心数学dir normalize(uv − center)sampleUVi uv dir × strength × (i / numSamples)color Σ tex2D(sampleUVi) / numSamplesstrength 控制最大偏移量numSamples 控制质量i 从 0 到 numSamples−1与高斯模糊的本质区别高斯模糊各方向均匀采样产生无方向的柔化 径向模糊的采样点全部沿中心→像素方向排列因此产生具有方向感的运动拖影。径向 UV 变形 vs 径向模糊严格来说径向 UV 变形指仅移动一次采样位置单步 用于创造空间扭曲、哈哈镜、折射感等 径向模糊是在变形基础上做多步累加将拖影混合进来。 两者使用同一套偏移公式差异在于采样次数与混合方式。技术采样次数视觉效果主要用途径向 UV 变形1空间扭曲、镜头畸变冲击波轮廓、传送门径向模糊低质量4–8轻微运动拖影移动提示、受击径向模糊高质量16–32平滑速度线技能释放、超速混合变体8–16 mask局部扭曲模糊爆炸冲击波复合Section 03URP 后处理管线配置在 URP 中实现屏幕后处理有多种方式。 Unity 2022 提供的Full Screen Pass Renderer Feature是最推荐的方案—— 无需手写 C# Blit 逻辑直接将 Material 挂上即可。1创建 URP Renderer Feature在 Project 中创建Universal Renderer Data→ 点击Add Renderer Feature→ 选择Full Screen Pass Renderer Feature。将其注入到After Rendering Post Processing事件。2创建 Shader 与 Material新建Shader Graph或.shader文件使用_BlitTexture作为源纹理输入。创建对应 Material填入后处理参数。3挂载 Material 到 Feature将 Material 拖入 Full Screen Pass 的Pass Material字段设置Pass Index为 0。Feature 会在每帧渲染后自动将屏幕 Blit 一次。4通过脚本动态控制强度使用material.SetFloat(_Strength, value)在游戏逻辑中动态调整模糊强度配合 DOTween 或 Coroutine 做淡入淡出。⚠️注意 URP 版本差异Full Screen Pass Renderer Feature 在 URP 14Unity 2022.2中正式可用。 旧版 URP 需要自定义ScriptableRendererFeature 手写 Blit Pass。 建议升级到 Unity 2022.3 LTS 或更新版本。可选自定义 Renderer Feature — C#若使用旧版 URP 或需要更精细控制以下是最小 Renderer Feature 实现using UnityEngine; using UnityEngine.Rendering; using UnityEngine.Rendering.Universal; public class RadialBlurFeature : ScriptableRendererFeature { public Material blurMaterial; public RenderPassEvent renderPassEvent RenderPassEvent.AfterRenderingPostProcessing; private RadialBlurPass pass; public override void Create() { pass new RadialBlurPass(blurMaterial, renderPassEvent); } public override void AddRenderPasses(ScriptableRenderer renderer, ref RenderingData renderingData) { if (blurMaterial ! null) renderer.EnqueuePass(pass); } } // ── 内嵌 Pass ────────────────────────────────── public class RadialBlurPass : ScriptableRenderPass { private Material mat; private RTHandle tempRT; public RadialBlurPass(Material m, RenderPassEvent evt) { mat m; renderPassEvent evt; } public override void Execute(ScriptableRenderContext context, ref RenderingData renderingData) { var cmd CommandBufferPool.Get(RadialBlur); // Blit 当前帧到自身使用 mat 处理 Blitter.BlitCameraTexture(cmd, colorTarget, colorTarget, mat, 0); context.ExecuteCommandBuffer(cmd); CommandBufferPool.Release(cmd); } }Section 04核心 Shader 完整实现以下是完整的径向模糊 HLSL Shader。 代码逐行拆解关键行高亮显示。 核心逻辑位于frag函数第 ①②③ 步。阅读重点黄色高亮行是径向模糊的核心逻辑——方向计算、步进偏移与颜色累加。 其余为 URP 模板代码可直接复用。Shader PostProcess/RadialBlur { Properties { // 模糊中心默认屏幕中心 (0.5, 0.5) _Center (Center, Vector) (0.5, 0.5, 0, 0) // 单步偏移强度范围 0.001~0.05 _Strength (Strength, Range(0, 0.1)) 0.01 // 采样步数值越高越平滑 _Samples (Samples, Range(2, 32)) 8 } SubShader { // URP 全屏后处理标准标签 Tags { RenderPipeline UniversalPipeline } ZWrite Off ZTest Always Cull Off Pass { HLSLPROGRAM #pragma vertex Vert #pragma fragment Frag // URP 核心库包含 Blitter、_BlitTexture 等宏 #include Packages/com.unity.render-pipelines.universal/ShaderLibrary/Core.hlsl #include Packages/com.unity.render-pipelines.core/Runtime/Utilities/Blit.hlsl // ① 属性在 HLSL 侧的声明 CBUFFER_START(UnityPerMaterial) float2 _Center; float _Strength; int _Samples; CBUFFER_END // Vert直接使用 URP Blitter 提供的顶点着色器 Varyings Vert(Attributes input) { return Vert(input); // Blit.hlsl 中已定义 } // ── 核心 Fragment Shader ───────────────────── half4 Frag(Varyings input) : SV_Target { // 获取当前像素 UV float2 uv input.texcoord; // ② 计算从中心到当前像素的方向向量归一化 float2 dir normalize(uv - _Center 1e-5); // ③ 多步偏移采样累加颜色 half4 color 0; int numSamples clamp(_Samples, 2, 32); UNITY_UNROLL // 展开循环避免 GPU 分支惩罚 for (int i 0; i numSamples; i) { // 当前步的偏移量线性插值从0到strength float t (float)i / (float)(numSamples - 1); float2 sampleUV uv dir * _Strength * t; // 钳制到 [0,1]避免边缘采样越界 sampleUV clamp(sampleUV, 0.001, 0.999); // 采样屏幕纹理并累加 color SAMPLE_TEXTURE2D(_BlitTexture, sampler_BlitTexture, sampleUV); } // ④ 求平均得到最终像素颜色 color / (float)numSamples; return color; } ENDHLSL } } }逐段解析① Properties 属性声明_Strength控制每步偏移量值越大模糊范围越广。 典型范围0.005 ~ 0.04超过 0.05 会产生明显采样失真。_Samples整型控制循环次数。 建议在 C# 端以KeywordEnum区分高中低档 避免运行时浮点转整型的分支开销。② 方向向量 dir 的构造float2 dir normalize(uv - _Center)这是整个算法最关键的一行。uv是当前像素的屏幕 UV0~1_Center默认 (0.5, 0.5)。subtract 得到从中心到像素的向量normalize 归一化使步距均匀。为什么要 normalize不归一化时靠近中心的像素偏移量极小几乎不模糊 靠近屏幕边缘的像素偏移量极大过度模糊 产生中心清晰、边缘拖影失控的不均匀效果。 normalize 后所有方向的步长相同模糊强度仅由_Strength控制。③ 采样循环与混合循环numSamples次每次将 UV 沿dir方向 步进_Strength × (i / numSamples) 累加颜色后除以步数。 这是一个等距线性采样策略—— 采样点均匀分布在当前位置到当前位置 dir × strength的线段上。Section 05参数调优与性能权衡径向模糊的性能开销主要来自纹理采样次数。 每个像素执行 N 次SAMPLE_TEXTURE2D 全屏 1080p 下总采样数 1920 × 1080 × N。 理解这一点才能在视觉质量与帧率之间做出正确的权衡。采样步数 vs 视觉质量步数 (N)1080p 总采样视觉效果移动端适用推荐场景4~830 万条带感明显适用轻微受击、闪光8~1665 万基本平滑推荐普通技能、传送16~3330 万平滑流畅谨慎大招、速度感主视效32~6660 万电影级质量不适用PC/主机过场动画半分辨率优化对移动端或低端机可先将屏幕降采样到 1/2 分辨率再做径向模糊 最后 Upscale 合并回来。 性能降低至原来的 1/4肉眼难以察觉质量差异。 URP 中通过RenderTextureDescriptor指定 width/2, height/2 创建 RT。Strength 参数指南_Strength 值视觉感受适用效果0.003 ~ 0.008微弱拖影常态速度感、移动提示0.010 ~ 0.020明显速度线冲刺、技能前摇0.025 ~ 0.040强烈冲击大招释放、爆炸冲击波 0.050严重失真仅特殊艺术风格避免常见问题⚠️边缘采样越界当像素靠近屏幕边缘sampleUV 可能超出 [0,1] 范围导致采样拉扯到对边。 解决方案在采样前sampleUV clamp(sampleUV, 0.001, 0.999)或使用CLAMP纹理寻址模式URP 默认已启用。⚠️中心点 UV 奇点当 uv 恰好等于 center 时normalize(float2(0,0))会产生 NaN。 在 normalize 前加 epsilon 保护float2 dir normalize(uv - _Center 1e-5) 或用length(uv - _Center) 0.001做条件分支。Section 06进阶变体冲击波 vs 速度感变体 A冲击波环形 UV 扭曲纯径向模糊覆盖整个屏幕。 真实爆炸冲击波是一个向外扩张的环形—— 仅在环形边界处扭曲 UV内部与外部保持清晰。 通过给 Strength 乘以一个环形 Mask实现// 冲击波参数 float _WaveRadius; // 当前波前半径0→1随时间扩大 float _WaveWidth; // 波前宽度控制扭曲带宽 float _WaveStrength; // 扭曲强度 half4 FragShockwave(Varyings input) : SV_Target { float2 uv input.texcoord; float2 offset uv - _Center; // 当前像素到中心的距离考虑屏幕宽高比 float dist length(offset * float2(_ScreenParams.x / _ScreenParams.y, 1.0)); // 环形 Mask仅在 [waveRadius - width/2, waveRadius width/2] 内有效 float ring smoothstep(_WaveRadius - _WaveWidth, _WaveRadius, dist) * smoothstep(_WaveRadius _WaveWidth, _WaveRadius, dist); // 将 Strength 乘以环形 Mask仅波前区域产生扭曲 float2 dir normalize(offset 1e-5); float2 warpUV uv dir * ring * _WaveStrength; return SAMPLE_TEXTURE2D(_BlitTexture, sampler_BlitTexture, warpUV); }变体 B速度感带径向衰减速度感效果通常需要中心清晰 边缘模糊。 将 Strength 乘以一个从中心向外线性增大的权重 中心区域几乎不模糊边缘拖影最强half4 FragSpeedBlur(Varyings input) : SV_Target { float2 uv input.texcoord; float2 offset uv - _Center; // 到中心的距离范围 0中心→ ~0.7角落 float dist length(offset); // 径向衰减边缘全强度中心强度为 0 // pow(dist * 2, 1.5) 使衰减更陡峭中心更清晰 float falloff saturate(pow(dist * 2.0, 1.5)); float effectiveStrength _Strength * falloff; float2 dir normalize(offset 1e-5); half4 color 0; int numSamples 8; for (int i 0; i numSamples; i) { float t (float)i / (float)(numSamples - 1); // 使用 effectiveStrength含衰减代替原始 _Strength float2 sampleUV clamp(uv dir * effectiveStrength * t, 0.001, 0.999); color SAMPLE_TEXTURE2D(_BlitTexture, sampler_BlitTexture, sampleUV); } return color / (float)numSamples; }变体 C脉冲控制配合 C# 动画曲线实际游戏中不会持续保持高强度模糊而是在技能激活时做一次瞬间峰值 快速衰减。 以下 C# 脚本展示如何用 AnimationCurve 精确控制时序using System.Collections; using UnityEngine; public class RadialBlurController : MonoBehaviour { [SerializeField] private Material blurMaterial; // 在 Inspector 中可视化编辑强度随时间的变化曲线 [SerializeField] private AnimationCurve strengthCurve AnimationCurve.EaseInOut(0, 0, 1, 0); [SerializeField] private float peakStrength 0.03f; [SerializeField] private float duration 0.6f; private static readonly int StrengthID Shader.PropertyToID(_Strength); private static readonly int CenterID Shader.PropertyToID(_Center); /// summary在指定屏幕位置触发一次冲击波脉冲/summary public void Trigger(Vector2 screenCenter) { if (blurMaterial null) return; blurMaterial.SetVector(CenterID, new Vector4(screenCenter.x, screenCenter.y, 0, 0)); StartCoroutine(BlurRoutine()); } private IEnumerator BlurRoutine() { float elapsed 0f; while (elapsed duration) { elapsed Time.deltaTime; float t elapsed / duration; // 从曲线采样强度乘以峰值 float strength strengthCurve.Evaluate(t) * peakStrength; blurMaterial.SetFloat(StrengthID, strength); yield return null; // 等待下一帧 } // 结束后重置为 0关闭效果 blurMaterial.SetFloat(StrengthID, 0f); } }