1. 项目概述为什么Shader是Unity开发者的分水岭如果你在Unity里做过一段时间开发可能有过这样的经历你费尽心思调好了模型、灯光和材质但总觉得画面“差了点意思”要么是塑料感太强要么是缺少那种能抓住眼球的动态效果。你打开Asset Store看到那些炫酷的粒子、流动的水面、风格化的渲染心里痒痒的但一看实现核心都是一个词——Shader。很多开发者包括曾经的我对Shader都抱有一种敬畏感觉得它高深莫测是图形程序员的专属领域。但事实上Shader并没有想象中那么遥不可及。它更像是一套规则一套告诉GPU“如何为屏幕上的每一个像素上色”的规则。掌握它你就从“场景的组装工”变成了“画面的创作者”。这个笔记系列源于我跟随唐老师教程系统学习Shader的实践与思考。它不是对教程的简单复述而是结合我作为一线开发者在项目中实际应用Shader时遇到的困惑、踩过的坑重新梳理出的学习路径和核心心法。我的目标很明确帮你绕开那些抽象的理论陷阱直接抓住Shader编程中那些“必须懂”且“马上能用”的概念让你能亲手写出改变游戏视觉风格的代码而不是永远在复制粘贴别人的Shader。无论是想实现一个简单的边缘光还是打造独特的卡通渲染理解这些基础概念都是你迈出的第一步。2. 核心概念拆解从“黑盒”到“可控管线”在深入代码之前我们必须把Shader放在Unity的渲染管线中来理解。你可以把渲染管线想象成一条食品加工流水线。模型数据网格、顶点是原材料经过一系列加工站顶点着色器、片元着色器等最终产出成品——屏幕上的像素。Shader就是你在关键加工站上编写的“加工手册”。2.1 渲染管线GPU的“工作流程图”Unity主要支持两种渲染管线内置渲染管线Built-in和通用渲染管线URP。对于入门而言我强烈建议从内置管线开始因为它更直接概念更纯粹能让你看清本质。URP和HDRP高清渲染管线是更现代、更模块化的封装它们在底层概念上是相通的但多了许多可配置的“开关”和“模块”。一开始就接触URP你可能会被它的Volume、Render Feature等高级概念绕晕反而忽略了Shader本身在做什么。在内置管线中一个最简单的Shader流程是这样的顶点着色器Vertex Shader这是流水线的第一个关键站。它的输入是模型的顶点数据位置、法线、UV坐标等。在这里你可以对顶点进行变换比如实现物体的摆动、波浪效果。它的核心输出是顶点在裁剪空间中的位置sv_position这决定了顶点最终在屏幕上的哪里。片元着色器Fragment Shader这是最核心、最常被我们修改的站。在早期也叫像素着色器Pixel Shader。它的任务是为光栅化后生成的每一个“片元”你可以近似理解为最终屏幕上的一个像素候选点计算颜色。所有关于材质颜色、纹理采样、光照计算、特效混合的逻辑几乎都在这里发生。理解这两个阶段的分工是至关重要的。顶点着色器处理“形状”和“位置”片元着色器处理“颜色”和“外观”。一个常见的性能优化原则就是能在顶点着色器算的就不要放到片元着色器。因为顶点数量通常远少于片元像素数量。2.2 ShaderLab与HLSL/CG规则书与加工手册Unity的Shader文件.shader使用一种名为ShaderLab的声明性语言来组织。你可以把它看作是整个流水线的“规则书”或“总装说明书”。它不负责具体的计算而是定义这个Shader叫什么Shader “Custom/MyShader”有哪些属性可以暴露给材质面板调节Properties块如何与渲染引擎交互SubShader,Pass块使用哪个顶点/片元着色器程序而真正的“加工手册”即具体的计算逻辑则是写在CGPROGRAM和ENDCG包裹的代码块中使用HLSLHigh-Level Shading Language或CGC for Graphics语言来编写。这两者在Unity中高度相似你可以把它们看作同一种语言。这些代码会被编译成GPU能直接执行的指令。一个最直观的例子你在材质球上拖拽的那个颜色拾取器对应的是ShaderLab的Properties里定义的_Color (“Main Color”, Color) (1,1,1,1)。而当你在片元着色器里使用这个颜色时你需要用HLSL声明一个与之匹配的变量float4 _Color;然后在计算最终颜色时使用它比如return _Color * tex2D(_MainTex, i.uv);。注意这里有一个新手极易混淆的点。ShaderLab中的属性名如_Color和HLSL代码中的变量名必须完全一致包括大小写Unity才会自动将它们绑定起来。如果HLSL里写的是_MainColor而Properties里是_Color那么你在材质面板调的颜色将永远传不进Shader结果就是你的修改无效画面不变。这是我早期调试Shader时最常犯的错误之一。2.3 坐标系空间变换三维世界的“翻译官”这是Shader入门路上最大的“拦路虎”之一但又是无法绕开的基石。模型从它自己的小天地模型空间最终被画到屏幕上屏幕空间中间经历了多次坐标变换。你需要清楚地知道你的数据当前在哪个空间以及如何转换到你需要的空间。模型空间Object Space顶点数据的原生状态相对于模型自身的原点。世界空间World Space所有物体在同一个场景坐标系下的位置。光照计算、物体交互通常需要在这个空间进行。观察空间View Space / Eye Space以摄像机为原点的坐标系。Z轴指向摄像机前方。裁剪空间Clip Space经过投影矩阵变换后的空间是一个中心在(0,0,0)边界在±1或[0,1]之间的立方体。在这个空间之外的部分会被“裁剪”掉。顶点着色器通常需要输出到这个空间。屏幕空间Screen Space最终的2D像素坐标。Unity提供了一系列内置的矩阵来帮助我们完成这些变换最常用的是UNITY_MATRIX_MVP(旧版)直接将顶点从模型空间变换到裁剪空间Model-View-Projection。unity_ObjectToWorld模型空间到世界空间的矩阵。unity_WorldToObject世界空间到模型空间的逆矩阵。UNITY_MATRIX_V世界空间到观察空间的矩阵。UNITY_MATRIX_P观察空间到裁剪空间的投影矩阵。在URP中这些矩阵的命名和获取方式有所变化但概念不变。理解这些矩阵你就能自由地在不同空间操作数据。例如要在世界空间计算光照你就需要在顶点着色器中将法线从模型空间变换到世界空间float3 worldNormal normalize(mul(unity_ObjectToWorld, float4(v.normal, 0.0)).xyz);。这里将法线的w分量设为0是因为法线是方向向量不应受平移变换影响。3. 第一个可实操的Shader从“Hello World”到可控颜色理论说再多不如动手写一个。我们来创建一个最简单的Shader它只做一件事用我们自定义的颜色渲染物体。3.1 创建与基础结构在Unity项目中右键 - Create - Shader - Unlit Shader。命名为SimpleColor.shader。打开它你会看到Unity生成的模板代码。我们从头开始理解每一部分。Shader Custom/SimpleColor { Properties { // 在材质面板上暴露一个名为“Main Color”的颜色属性默认白色 _Color (Main Color, Color) (1,1,1,1) } SubShader { Tags { RenderTypeOpaque } // 这是一个不透明物体着色器 LOD 100 // 细节级别暂时不用管 Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag // 确保雾效和光照不会影响我们因为是无光照Shader #pragma multi_compile_fog #include UnityCG.cginc // 声明与Properties块中同名的变量用于在CG代码中访问 float4 _Color; // 应用程序传入顶点着色器的数据结构 struct appdata { float4 vertex : POSITION; // 顶点位置模型空间 float2 uv : TEXCOORD0; // 第一套UV坐标 }; // 顶点着色器输出给片元着色器的数据结构 struct v2f { float2 uv : TEXCOORD0; UNITY_FOG_COORDS(1) // 雾效坐标宏 float4 vertex : SV_POSITION; // 裁剪空间位置必须 }; // 顶点着色器函数 v2f vert (appdata v) { v2f o; o.vertex UnityObjectToClipPos(v.vertex); // 核心变换模型空间-裁剪空间 o.uv v.uv; UNITY_TRANSFER_FOG(o,o.vertex); // 传递雾效数据 return o; } // 片元着色器函数 fixed4 frag (v2f i) : SV_Target { // 最简单的片元着色器直接返回我们定义的颜色 fixed4 col _Color; // 应用雾效如果启用 UNITY_APPLY_FOG(i.fogCoord, col); return col; } ENDCG } } }将这个Shader赋给一个材质球再将该材质球赋给一个3D物体如Cube。在材质面板上你应该能看到一个“Main Color”的拾色器。改变它物体的颜色就会随之改变。恭喜你写出了第一个真正意义上的可交互Shader3.2 关键代码行解读与避坑指南UnityObjectToClipPos(v.vertex)这是Unity提供的一个内置函数它等价于mul(UNITY_MATRIX_MVP, v.vertex)。它完成了从模型空间到裁剪空间的核心坐标变换。永远不要在顶点着色器中忘记对顶点位置进行这个变换否则物体将无法被正确渲染到屏幕上。: POSITION,: TEXCOORD0,: SV_POSITION这些是语义Semantics。它们告诉GPU每个变量数据的用途。POSITION表示这是顶点位置TEXCOORD0表示这是第一套纹理坐标SV_POSITION表示这是裁剪空间的位置System Value Position。语义必须正确匹配这是Shader能工作的基础。fixed4vsfloat4这是精度修饰符。fixed是低精度通常用于颜色范围0-1float是高精度。在移动平台或对性能要求苛刻的地方合理使用fixed可以提升性能。但在现代GPU上区别已不大通常用half中精度或float即可。入门阶段可以统一用float避免因精度问题导致诡异的效果。实操心得创建新Shader后如果材质球上的属性修改了但画面没反应请按以下顺序排查1. 检查Properties中的属性名和CG代码中的变量名是否完全一致。2. 检查Shader是否编译成功Console窗口有无错误。3. 检查材质球是否正确应用到了物体上。4. 检查摄像机是否能看到该物体。90%的问题出在第一步。4. 核心功能进阶纹理、光照与混合单一颜色显然不够。接下来我们为Shader添加纹理支持和基础光照这是让物体看起来有“质感”的关键。4.1 纹理采样让表面拥有细节纹理是覆盖在模型表面的图片。在Shader中我们通过UV坐标来访问纹理上的颜色。首先在Properties块添加纹理属性Properties { _Color (Main Color, Color) (1,1,1,1) _MainTex (Main Texture, 2D) white {} // 添加纹理属性默认白色 }在CG代码中声明对应的变量sampler2D _MainTex; float4 _MainTex_ST; // 非常重要这个变量包含了纹理的缩放(Scale)和平移(Translation)信息_MainTex_ST是一个固定命名规则的变量纹理名_STUnity会自动将材质面板上纹理的Tiling和Offset值填充进来。_MainTex_ST.xy是缩放_MainTex_ST.zw是偏移。修改顶点着色器正确传递并变换UVv2f vert (appdata v) { v2f o; o.vertex UnityObjectToClipPos(v.vertex); // 使用TRANSFORM_TEX宏应用纹理的缩放和偏移 o.uv TRANSFORM_TEX(v.uv, _MainTex); UNITY_TRANSFER_FOG(o,o.vertex); return o; }TRANSFORM_TEX是一个内置宏它等价于v.uv * _MainTex_ST.xy _MainTex_ST.zw。最后在片元着色器中进行纹理采样fixed4 frag (v2f i) : SV_Target { // 使用tex2D函数采样纹理参数是采样器和UV坐标 fixed4 texCol tex2D(_MainTex, i.uv); // 将纹理颜色与自定义颜色相乘常用于着色 fixed4 col texCol * _Color; UNITY_APPLY_FOG(i.fogCoord, col); return col; }现在你的物体应该能显示纹理了。在材质面板上你可以拖入一张图片作为_MainTex并通过Tiling和Offset调整其平铺和位置。4.2 基础漫反射光照引入明暗关系无光照Unlit的Shader看起来是平的。我们把它升级成一个最简单的漫反射Diffuse光照模型让它能对场景中的灯光产生反应。这里我们采用兰伯特Lambert光照模型其核心思想是表面法线与光线方向夹角的余弦值决定了光照强度。首先我们需要在顶点数据中获取法线。修改appdata结构struct appdata { float4 vertex : POSITION; float3 normal : NORMAL; // 添加法线 float2 uv : TEXCOORD0; };我们需要在顶点着色器中将法线从模型空间变换到世界空间并归一化。同时我们还需要计算世界空间下的顶点位置以便计算光线方向。v2f vert (appdata v) { v2f o; o.vertex UnityObjectToClipPos(v.vertex); o.uv TRANSFORM_TEX(v.uv, _MainTex); // 计算世界空间法线 float3 worldNormal UnityObjectToWorldNormal(v.normal); o.worldNormal worldNormal; // 计算世界空间顶点位置 float3 worldPos mul(unity_ObjectToWorld, v.vertex).xyz; o.worldPos worldPos; UNITY_TRANSFER_FOG(o,o.vertex); return o; }相应地需要修改v2f结构以传递这些数据struct v2f { float2 uv : TEXCOORD0; float3 worldNormal : TEXCOORD1; float3 worldPos : TEXCOORD2; UNITY_FOG_COORDS(3) float4 vertex : SV_POSITION; };现在在片元着色器中计算漫反射光照。我们假设场景中只有一个平行光Directional LightUnity内置变量_WorldSpaceLightPos0提供了它的方向对于平行光其w分量为0xyz是方向_LightColor0提供了它的颜色。fixed4 frag (v2f i) : SV_Target { // 采样纹理 fixed4 texCol tex2D(_MainTex, i.uv); // 归一化法线和光线方向世界空间 float3 normal normalize(i.worldNormal); float3 lightDir normalize(_WorldSpaceLightPos0.xyz); // 计算兰伯特漫反射系数max(0, dot(N, L)) float diff max(0, dot(normal, lightDir)); // 结合光照颜色和纹理颜色 fixed4 col texCol * _Color * diff * _LightColor0; // 添加环境光避免完全黑暗 fixed4 ambient UNITY_LIGHTMODEL_AMBIENT * texCol * _Color; col ambient; UNITY_APPLY_FOG(i.fogCoord, col); return col; }为了让这个Shader能接收光照我们需要修改它的Tags和添加光照模式。在Pass块内部CGPROGRAM之前添加Tags { LightModeForwardBase } // 告诉Unity这个Pass用于前向渲染的基础光照同时在#pragma指令中启用光照相关的变体#pragma multi_compile_fwdbase现在你的物体应该会对场景中的平行光产生反应有明暗变化了。这就是最基础的光照Shader。注意事项这里实现的是逐顶点光照Gouraud Shading因为光照计算是在顶点着色器传递出的插值数据基础上进行的。虽然我们在片元着色器计算diff但法线和光线方向是在顶点着色器计算后插值过来的。对于平滑模型效果尚可但对于低模或需要高光等精细效果时更精确的做法是进行逐像素光照Phong Shading即在片元着色器中重新归一化所有向量。我们的示例为了清晰做了简化。在实际项目中计算高光反射Specular时必须进行逐像素计算否则高光会显得破碎。4.3 透明与混合处理玻璃、火焰等效果默认情况下我们的Shader渲染的物体是不透明的Opaque。如果要实现透明效果如玻璃、水面、粒子需要改变渲染队列和混合模式。首先修改SubShader的Tags使用透明队列并禁用深度写入Tags { QueueTransparent // 在透明队列渲染 RenderTypeTransparent IgnoreProjectorTrue // 通常透明物体不受投影器影响 }在Pass块内设置混合模式。最常见的混合模式是Alpha混合用于模拟透明Blend SrcAlpha OneMinusSrcAlpha // 标准透明度混合 ZWrite Off // 关闭深度写入防止透明物体相互遮挡出错Blend SrcAlpha OneMinusSrcAlpha的含义是最终颜色 源颜色Shader输出 * 源Alpha 目标颜色帧缓冲区已有颜色 * (1 - 源Alpha)。这实现了基于Alpha通道的透明叠加。现在你的Shader就可以渲染透明物体了。确保你纹理或_Color的Alpha通道a分量小于1。你可以在片元着色器中直接控制输出颜色的Alpha值例如col.a 0.5;。常见问题透明物体的渲染顺序是一个经典难题。因为关闭了深度写入后渲染的透明物体会覆盖先渲染的而不管实际深度谁在前。这会导致错误的遮挡关系。解决方案通常是1. 确保透明物体按从后往前的顺序渲染Unity的Transparent队列大致如此但不完全可靠。2. 对于复杂透明物体有时需要分割成多个部分或使用更高级的渲染技术如深度剥离。对于入门项目尽量保持透明物体形状简单并理解这个限制。5. 实战问题排查与性能优化入门当你开始编写更复杂的Shader时一定会遇到各种奇怪的问题。这里分享一些我踩过的坑和调试技巧。5.1 Shader编译错误与警告解读Unity编辑器控制台是排查Shader问题的第一站。错误 C0000: syntax error语法错误。检查括号、分号、花括号是否匹配关键字是否拼写正确。HLSL对大小写不敏感但变量名和函数名需保持一致。错误 X3000: 无法识别的标识符通常是因为变量或函数未声明或者包含了错误的头文件。检查拼写并确认#include UnityCG.cginc等语句存在。警告 X3206: implicit truncation of vector type隐式截断向量类型。例如你尝试将一个float4赋值给float3而没有使用.xyz选择子。虽然有时能工作但最好显式转换如float3 pos worldPos.xyz;。Shader警告变量‘xxx’从未被使用可以忽略但说明你的Shader可能有冗余代码在移动平台可考虑移除以减小变体。一个强大的调试方法是使用return fixed4(1,0,0,1);在片元着色器中直接返回一个纯色如红色。如果物体变红说明Shader执行到了这里问题出在后面的计算逻辑如果没变红说明问题可能出在顶点着色器、属性绑定或Shader根本没有被正确执行。5.2 可视化调试眼见为实GPU调试不像CPU调试那样可以单步跟踪。我们需要把中间变量“可视化”出来。方法一直接输出中间值作为颜色。这是最常用的方法。比如你想看法线是否正确可以在片元着色器中return fixed4(normal * 0.5 0.5, 1.0);。因为法线分量范围在[-1,1]而颜色范围在[0,1]所以需要映射一下。看到彩色球面说明法线基本正确。方法二使用Unity的Frame Debugger。Window - Analysis - Frame Debugger。它可以截取一帧的完整渲染过程查看每个Draw Call使用的Shader、状态和渲染目标。对于理解渲染顺序和排查合批问题非常有用。方法三在材质面板使用自定义的调试视图。你可以写一个专门的调试Shader将你想看的任何数据如深度、UV、世界坐标编码到颜色输出。Asset Store上也有一些强大的可视化调试工具。5.3 初识性能陷阱与优化方向Shader性能直接影响帧率尤其是移动设备。精度选择如前所述在片元着色器中对颜色等范围在0-1的数据使用fixed或half对位置、向量等使用float。虽然现代GPU优化得很好但在低端设备上仍有差异。计算频率牢记“顶点少片元多”。复杂的计算尽量放在顶点着色器。例如如果你需要基于世界位置做噪声在顶点着色器算好再插值比在片元着色器对每个像素算一次要高效得多。纹理采样纹理采样是昂贵的操作。避免在片元着色器中无意义地多次采样同一张纹理。如果多次用到同一纹理的不同通道如RGBA采样一次后使用.r,.g,.b,.a访问即可。分支与循环GPU是并行处理器分支if/else和循环for可能导致性能急剧下降因为不同线程可能执行不同路径造成“线程发散”。尽量使用线性计算或贴图查找如使用step,lerp函数来替代分支。Shader变体Variant#pragma multi_compile和#pragma shader_feature会为不同的关键字组合生成多个Shader变体。变体过多会显著增加构建时间和内存占用。只定义真正需要的变体并使用skip_variants指令剔除不需要的。例如一个常见的性能优化例子是雾效。我们之前的Shader使用了UNITY_APPLY_FOG。如果你确定某个物体永远不需要雾效可以在Pass中移除雾效相关的宏和代码节省一点点计算。对于海量重复的物体如草地这点节省累积起来就很可观。学习Shader是一个从“能用”到“好用”再到“高效”的过程。不要一开始就追求极致的性能。先实现功能确保正确性然后再用工具如Unity Profiler的GPU模块分析瓶颈有针对性地进行优化。最昂贵的错误往往不是一次复杂的计算而是一个全屏范围的、每帧都在执行的无用操作。
Unity Shader入门实战：从核心概念到可运行代码的完整指南
1. 项目概述为什么Shader是Unity开发者的分水岭如果你在Unity里做过一段时间开发可能有过这样的经历你费尽心思调好了模型、灯光和材质但总觉得画面“差了点意思”要么是塑料感太强要么是缺少那种能抓住眼球的动态效果。你打开Asset Store看到那些炫酷的粒子、流动的水面、风格化的渲染心里痒痒的但一看实现核心都是一个词——Shader。很多开发者包括曾经的我对Shader都抱有一种敬畏感觉得它高深莫测是图形程序员的专属领域。但事实上Shader并没有想象中那么遥不可及。它更像是一套规则一套告诉GPU“如何为屏幕上的每一个像素上色”的规则。掌握它你就从“场景的组装工”变成了“画面的创作者”。这个笔记系列源于我跟随唐老师教程系统学习Shader的实践与思考。它不是对教程的简单复述而是结合我作为一线开发者在项目中实际应用Shader时遇到的困惑、踩过的坑重新梳理出的学习路径和核心心法。我的目标很明确帮你绕开那些抽象的理论陷阱直接抓住Shader编程中那些“必须懂”且“马上能用”的概念让你能亲手写出改变游戏视觉风格的代码而不是永远在复制粘贴别人的Shader。无论是想实现一个简单的边缘光还是打造独特的卡通渲染理解这些基础概念都是你迈出的第一步。2. 核心概念拆解从“黑盒”到“可控管线”在深入代码之前我们必须把Shader放在Unity的渲染管线中来理解。你可以把渲染管线想象成一条食品加工流水线。模型数据网格、顶点是原材料经过一系列加工站顶点着色器、片元着色器等最终产出成品——屏幕上的像素。Shader就是你在关键加工站上编写的“加工手册”。2.1 渲染管线GPU的“工作流程图”Unity主要支持两种渲染管线内置渲染管线Built-in和通用渲染管线URP。对于入门而言我强烈建议从内置管线开始因为它更直接概念更纯粹能让你看清本质。URP和HDRP高清渲染管线是更现代、更模块化的封装它们在底层概念上是相通的但多了许多可配置的“开关”和“模块”。一开始就接触URP你可能会被它的Volume、Render Feature等高级概念绕晕反而忽略了Shader本身在做什么。在内置管线中一个最简单的Shader流程是这样的顶点着色器Vertex Shader这是流水线的第一个关键站。它的输入是模型的顶点数据位置、法线、UV坐标等。在这里你可以对顶点进行变换比如实现物体的摆动、波浪效果。它的核心输出是顶点在裁剪空间中的位置sv_position这决定了顶点最终在屏幕上的哪里。片元着色器Fragment Shader这是最核心、最常被我们修改的站。在早期也叫像素着色器Pixel Shader。它的任务是为光栅化后生成的每一个“片元”你可以近似理解为最终屏幕上的一个像素候选点计算颜色。所有关于材质颜色、纹理采样、光照计算、特效混合的逻辑几乎都在这里发生。理解这两个阶段的分工是至关重要的。顶点着色器处理“形状”和“位置”片元着色器处理“颜色”和“外观”。一个常见的性能优化原则就是能在顶点着色器算的就不要放到片元着色器。因为顶点数量通常远少于片元像素数量。2.2 ShaderLab与HLSL/CG规则书与加工手册Unity的Shader文件.shader使用一种名为ShaderLab的声明性语言来组织。你可以把它看作是整个流水线的“规则书”或“总装说明书”。它不负责具体的计算而是定义这个Shader叫什么Shader “Custom/MyShader”有哪些属性可以暴露给材质面板调节Properties块如何与渲染引擎交互SubShader,Pass块使用哪个顶点/片元着色器程序而真正的“加工手册”即具体的计算逻辑则是写在CGPROGRAM和ENDCG包裹的代码块中使用HLSLHigh-Level Shading Language或CGC for Graphics语言来编写。这两者在Unity中高度相似你可以把它们看作同一种语言。这些代码会被编译成GPU能直接执行的指令。一个最直观的例子你在材质球上拖拽的那个颜色拾取器对应的是ShaderLab的Properties里定义的_Color (“Main Color”, Color) (1,1,1,1)。而当你在片元着色器里使用这个颜色时你需要用HLSL声明一个与之匹配的变量float4 _Color;然后在计算最终颜色时使用它比如return _Color * tex2D(_MainTex, i.uv);。注意这里有一个新手极易混淆的点。ShaderLab中的属性名如_Color和HLSL代码中的变量名必须完全一致包括大小写Unity才会自动将它们绑定起来。如果HLSL里写的是_MainColor而Properties里是_Color那么你在材质面板调的颜色将永远传不进Shader结果就是你的修改无效画面不变。这是我早期调试Shader时最常犯的错误之一。2.3 坐标系空间变换三维世界的“翻译官”这是Shader入门路上最大的“拦路虎”之一但又是无法绕开的基石。模型从它自己的小天地模型空间最终被画到屏幕上屏幕空间中间经历了多次坐标变换。你需要清楚地知道你的数据当前在哪个空间以及如何转换到你需要的空间。模型空间Object Space顶点数据的原生状态相对于模型自身的原点。世界空间World Space所有物体在同一个场景坐标系下的位置。光照计算、物体交互通常需要在这个空间进行。观察空间View Space / Eye Space以摄像机为原点的坐标系。Z轴指向摄像机前方。裁剪空间Clip Space经过投影矩阵变换后的空间是一个中心在(0,0,0)边界在±1或[0,1]之间的立方体。在这个空间之外的部分会被“裁剪”掉。顶点着色器通常需要输出到这个空间。屏幕空间Screen Space最终的2D像素坐标。Unity提供了一系列内置的矩阵来帮助我们完成这些变换最常用的是UNITY_MATRIX_MVP(旧版)直接将顶点从模型空间变换到裁剪空间Model-View-Projection。unity_ObjectToWorld模型空间到世界空间的矩阵。unity_WorldToObject世界空间到模型空间的逆矩阵。UNITY_MATRIX_V世界空间到观察空间的矩阵。UNITY_MATRIX_P观察空间到裁剪空间的投影矩阵。在URP中这些矩阵的命名和获取方式有所变化但概念不变。理解这些矩阵你就能自由地在不同空间操作数据。例如要在世界空间计算光照你就需要在顶点着色器中将法线从模型空间变换到世界空间float3 worldNormal normalize(mul(unity_ObjectToWorld, float4(v.normal, 0.0)).xyz);。这里将法线的w分量设为0是因为法线是方向向量不应受平移变换影响。3. 第一个可实操的Shader从“Hello World”到可控颜色理论说再多不如动手写一个。我们来创建一个最简单的Shader它只做一件事用我们自定义的颜色渲染物体。3.1 创建与基础结构在Unity项目中右键 - Create - Shader - Unlit Shader。命名为SimpleColor.shader。打开它你会看到Unity生成的模板代码。我们从头开始理解每一部分。Shader Custom/SimpleColor { Properties { // 在材质面板上暴露一个名为“Main Color”的颜色属性默认白色 _Color (Main Color, Color) (1,1,1,1) } SubShader { Tags { RenderTypeOpaque } // 这是一个不透明物体着色器 LOD 100 // 细节级别暂时不用管 Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag // 确保雾效和光照不会影响我们因为是无光照Shader #pragma multi_compile_fog #include UnityCG.cginc // 声明与Properties块中同名的变量用于在CG代码中访问 float4 _Color; // 应用程序传入顶点着色器的数据结构 struct appdata { float4 vertex : POSITION; // 顶点位置模型空间 float2 uv : TEXCOORD0; // 第一套UV坐标 }; // 顶点着色器输出给片元着色器的数据结构 struct v2f { float2 uv : TEXCOORD0; UNITY_FOG_COORDS(1) // 雾效坐标宏 float4 vertex : SV_POSITION; // 裁剪空间位置必须 }; // 顶点着色器函数 v2f vert (appdata v) { v2f o; o.vertex UnityObjectToClipPos(v.vertex); // 核心变换模型空间-裁剪空间 o.uv v.uv; UNITY_TRANSFER_FOG(o,o.vertex); // 传递雾效数据 return o; } // 片元着色器函数 fixed4 frag (v2f i) : SV_Target { // 最简单的片元着色器直接返回我们定义的颜色 fixed4 col _Color; // 应用雾效如果启用 UNITY_APPLY_FOG(i.fogCoord, col); return col; } ENDCG } } }将这个Shader赋给一个材质球再将该材质球赋给一个3D物体如Cube。在材质面板上你应该能看到一个“Main Color”的拾色器。改变它物体的颜色就会随之改变。恭喜你写出了第一个真正意义上的可交互Shader3.2 关键代码行解读与避坑指南UnityObjectToClipPos(v.vertex)这是Unity提供的一个内置函数它等价于mul(UNITY_MATRIX_MVP, v.vertex)。它完成了从模型空间到裁剪空间的核心坐标变换。永远不要在顶点着色器中忘记对顶点位置进行这个变换否则物体将无法被正确渲染到屏幕上。: POSITION,: TEXCOORD0,: SV_POSITION这些是语义Semantics。它们告诉GPU每个变量数据的用途。POSITION表示这是顶点位置TEXCOORD0表示这是第一套纹理坐标SV_POSITION表示这是裁剪空间的位置System Value Position。语义必须正确匹配这是Shader能工作的基础。fixed4vsfloat4这是精度修饰符。fixed是低精度通常用于颜色范围0-1float是高精度。在移动平台或对性能要求苛刻的地方合理使用fixed可以提升性能。但在现代GPU上区别已不大通常用half中精度或float即可。入门阶段可以统一用float避免因精度问题导致诡异的效果。实操心得创建新Shader后如果材质球上的属性修改了但画面没反应请按以下顺序排查1. 检查Properties中的属性名和CG代码中的变量名是否完全一致。2. 检查Shader是否编译成功Console窗口有无错误。3. 检查材质球是否正确应用到了物体上。4. 检查摄像机是否能看到该物体。90%的问题出在第一步。4. 核心功能进阶纹理、光照与混合单一颜色显然不够。接下来我们为Shader添加纹理支持和基础光照这是让物体看起来有“质感”的关键。4.1 纹理采样让表面拥有细节纹理是覆盖在模型表面的图片。在Shader中我们通过UV坐标来访问纹理上的颜色。首先在Properties块添加纹理属性Properties { _Color (Main Color, Color) (1,1,1,1) _MainTex (Main Texture, 2D) white {} // 添加纹理属性默认白色 }在CG代码中声明对应的变量sampler2D _MainTex; float4 _MainTex_ST; // 非常重要这个变量包含了纹理的缩放(Scale)和平移(Translation)信息_MainTex_ST是一个固定命名规则的变量纹理名_STUnity会自动将材质面板上纹理的Tiling和Offset值填充进来。_MainTex_ST.xy是缩放_MainTex_ST.zw是偏移。修改顶点着色器正确传递并变换UVv2f vert (appdata v) { v2f o; o.vertex UnityObjectToClipPos(v.vertex); // 使用TRANSFORM_TEX宏应用纹理的缩放和偏移 o.uv TRANSFORM_TEX(v.uv, _MainTex); UNITY_TRANSFER_FOG(o,o.vertex); return o; }TRANSFORM_TEX是一个内置宏它等价于v.uv * _MainTex_ST.xy _MainTex_ST.zw。最后在片元着色器中进行纹理采样fixed4 frag (v2f i) : SV_Target { // 使用tex2D函数采样纹理参数是采样器和UV坐标 fixed4 texCol tex2D(_MainTex, i.uv); // 将纹理颜色与自定义颜色相乘常用于着色 fixed4 col texCol * _Color; UNITY_APPLY_FOG(i.fogCoord, col); return col; }现在你的物体应该能显示纹理了。在材质面板上你可以拖入一张图片作为_MainTex并通过Tiling和Offset调整其平铺和位置。4.2 基础漫反射光照引入明暗关系无光照Unlit的Shader看起来是平的。我们把它升级成一个最简单的漫反射Diffuse光照模型让它能对场景中的灯光产生反应。这里我们采用兰伯特Lambert光照模型其核心思想是表面法线与光线方向夹角的余弦值决定了光照强度。首先我们需要在顶点数据中获取法线。修改appdata结构struct appdata { float4 vertex : POSITION; float3 normal : NORMAL; // 添加法线 float2 uv : TEXCOORD0; };我们需要在顶点着色器中将法线从模型空间变换到世界空间并归一化。同时我们还需要计算世界空间下的顶点位置以便计算光线方向。v2f vert (appdata v) { v2f o; o.vertex UnityObjectToClipPos(v.vertex); o.uv TRANSFORM_TEX(v.uv, _MainTex); // 计算世界空间法线 float3 worldNormal UnityObjectToWorldNormal(v.normal); o.worldNormal worldNormal; // 计算世界空间顶点位置 float3 worldPos mul(unity_ObjectToWorld, v.vertex).xyz; o.worldPos worldPos; UNITY_TRANSFER_FOG(o,o.vertex); return o; }相应地需要修改v2f结构以传递这些数据struct v2f { float2 uv : TEXCOORD0; float3 worldNormal : TEXCOORD1; float3 worldPos : TEXCOORD2; UNITY_FOG_COORDS(3) float4 vertex : SV_POSITION; };现在在片元着色器中计算漫反射光照。我们假设场景中只有一个平行光Directional LightUnity内置变量_WorldSpaceLightPos0提供了它的方向对于平行光其w分量为0xyz是方向_LightColor0提供了它的颜色。fixed4 frag (v2f i) : SV_Target { // 采样纹理 fixed4 texCol tex2D(_MainTex, i.uv); // 归一化法线和光线方向世界空间 float3 normal normalize(i.worldNormal); float3 lightDir normalize(_WorldSpaceLightPos0.xyz); // 计算兰伯特漫反射系数max(0, dot(N, L)) float diff max(0, dot(normal, lightDir)); // 结合光照颜色和纹理颜色 fixed4 col texCol * _Color * diff * _LightColor0; // 添加环境光避免完全黑暗 fixed4 ambient UNITY_LIGHTMODEL_AMBIENT * texCol * _Color; col ambient; UNITY_APPLY_FOG(i.fogCoord, col); return col; }为了让这个Shader能接收光照我们需要修改它的Tags和添加光照模式。在Pass块内部CGPROGRAM之前添加Tags { LightModeForwardBase } // 告诉Unity这个Pass用于前向渲染的基础光照同时在#pragma指令中启用光照相关的变体#pragma multi_compile_fwdbase现在你的物体应该会对场景中的平行光产生反应有明暗变化了。这就是最基础的光照Shader。注意事项这里实现的是逐顶点光照Gouraud Shading因为光照计算是在顶点着色器传递出的插值数据基础上进行的。虽然我们在片元着色器计算diff但法线和光线方向是在顶点着色器计算后插值过来的。对于平滑模型效果尚可但对于低模或需要高光等精细效果时更精确的做法是进行逐像素光照Phong Shading即在片元着色器中重新归一化所有向量。我们的示例为了清晰做了简化。在实际项目中计算高光反射Specular时必须进行逐像素计算否则高光会显得破碎。4.3 透明与混合处理玻璃、火焰等效果默认情况下我们的Shader渲染的物体是不透明的Opaque。如果要实现透明效果如玻璃、水面、粒子需要改变渲染队列和混合模式。首先修改SubShader的Tags使用透明队列并禁用深度写入Tags { QueueTransparent // 在透明队列渲染 RenderTypeTransparent IgnoreProjectorTrue // 通常透明物体不受投影器影响 }在Pass块内设置混合模式。最常见的混合模式是Alpha混合用于模拟透明Blend SrcAlpha OneMinusSrcAlpha // 标准透明度混合 ZWrite Off // 关闭深度写入防止透明物体相互遮挡出错Blend SrcAlpha OneMinusSrcAlpha的含义是最终颜色 源颜色Shader输出 * 源Alpha 目标颜色帧缓冲区已有颜色 * (1 - 源Alpha)。这实现了基于Alpha通道的透明叠加。现在你的Shader就可以渲染透明物体了。确保你纹理或_Color的Alpha通道a分量小于1。你可以在片元着色器中直接控制输出颜色的Alpha值例如col.a 0.5;。常见问题透明物体的渲染顺序是一个经典难题。因为关闭了深度写入后渲染的透明物体会覆盖先渲染的而不管实际深度谁在前。这会导致错误的遮挡关系。解决方案通常是1. 确保透明物体按从后往前的顺序渲染Unity的Transparent队列大致如此但不完全可靠。2. 对于复杂透明物体有时需要分割成多个部分或使用更高级的渲染技术如深度剥离。对于入门项目尽量保持透明物体形状简单并理解这个限制。5. 实战问题排查与性能优化入门当你开始编写更复杂的Shader时一定会遇到各种奇怪的问题。这里分享一些我踩过的坑和调试技巧。5.1 Shader编译错误与警告解读Unity编辑器控制台是排查Shader问题的第一站。错误 C0000: syntax error语法错误。检查括号、分号、花括号是否匹配关键字是否拼写正确。HLSL对大小写不敏感但变量名和函数名需保持一致。错误 X3000: 无法识别的标识符通常是因为变量或函数未声明或者包含了错误的头文件。检查拼写并确认#include UnityCG.cginc等语句存在。警告 X3206: implicit truncation of vector type隐式截断向量类型。例如你尝试将一个float4赋值给float3而没有使用.xyz选择子。虽然有时能工作但最好显式转换如float3 pos worldPos.xyz;。Shader警告变量‘xxx’从未被使用可以忽略但说明你的Shader可能有冗余代码在移动平台可考虑移除以减小变体。一个强大的调试方法是使用return fixed4(1,0,0,1);在片元着色器中直接返回一个纯色如红色。如果物体变红说明Shader执行到了这里问题出在后面的计算逻辑如果没变红说明问题可能出在顶点着色器、属性绑定或Shader根本没有被正确执行。5.2 可视化调试眼见为实GPU调试不像CPU调试那样可以单步跟踪。我们需要把中间变量“可视化”出来。方法一直接输出中间值作为颜色。这是最常用的方法。比如你想看法线是否正确可以在片元着色器中return fixed4(normal * 0.5 0.5, 1.0);。因为法线分量范围在[-1,1]而颜色范围在[0,1]所以需要映射一下。看到彩色球面说明法线基本正确。方法二使用Unity的Frame Debugger。Window - Analysis - Frame Debugger。它可以截取一帧的完整渲染过程查看每个Draw Call使用的Shader、状态和渲染目标。对于理解渲染顺序和排查合批问题非常有用。方法三在材质面板使用自定义的调试视图。你可以写一个专门的调试Shader将你想看的任何数据如深度、UV、世界坐标编码到颜色输出。Asset Store上也有一些强大的可视化调试工具。5.3 初识性能陷阱与优化方向Shader性能直接影响帧率尤其是移动设备。精度选择如前所述在片元着色器中对颜色等范围在0-1的数据使用fixed或half对位置、向量等使用float。虽然现代GPU优化得很好但在低端设备上仍有差异。计算频率牢记“顶点少片元多”。复杂的计算尽量放在顶点着色器。例如如果你需要基于世界位置做噪声在顶点着色器算好再插值比在片元着色器对每个像素算一次要高效得多。纹理采样纹理采样是昂贵的操作。避免在片元着色器中无意义地多次采样同一张纹理。如果多次用到同一纹理的不同通道如RGBA采样一次后使用.r,.g,.b,.a访问即可。分支与循环GPU是并行处理器分支if/else和循环for可能导致性能急剧下降因为不同线程可能执行不同路径造成“线程发散”。尽量使用线性计算或贴图查找如使用step,lerp函数来替代分支。Shader变体Variant#pragma multi_compile和#pragma shader_feature会为不同的关键字组合生成多个Shader变体。变体过多会显著增加构建时间和内存占用。只定义真正需要的变体并使用skip_variants指令剔除不需要的。例如一个常见的性能优化例子是雾效。我们之前的Shader使用了UNITY_APPLY_FOG。如果你确定某个物体永远不需要雾效可以在Pass中移除雾效相关的宏和代码节省一点点计算。对于海量重复的物体如草地这点节省累积起来就很可观。学习Shader是一个从“能用”到“好用”再到“高效”的过程。不要一开始就追求极致的性能。先实现功能确保正确性然后再用工具如Unity Profiler的GPU模块分析瓶颈有针对性地进行优化。最昂贵的错误往往不是一次复杂的计算而是一个全屏范围的、每帧都在执行的无用操作。
