【节点】[ScreenPosition节点]原理解析与实际应用

【Unity Shader Graph 使用与特效实现】专栏-直达

Screen Position节点是Unity URP Shader Graph中一个极其重要的内置节点，它提供了访问网格顶点或片元在屏幕空间中位置的能力。这个节点在实现各种屏幕空间效果、UI着色器、后期处理效果以及基于屏幕坐标的纹理映射等方面发挥着关键作用。理解Screen Position节点的不同模式及其应用场景，对于创建高质量的视觉特效至关重要。

Screen Position节点的基本概念

Screen Position节点的核心功能是获取当前处理的片元在屏幕坐标系中的位置信息。在实时渲染中，每个物体都需要从世界空间转换到裁剪空间，再经过透视除法转换到标准化设备坐标，最终映射到屏幕空间。Screen Position节点正是在这个渲染管线的末端，为我们提供了访问屏幕空间坐标的能力。

在Shader Graph中，Screen Position节点输出一个四维向量，其中X和Y分量包含了最重要的屏幕位置信息，而Z和W分量在不同模式下可能有不同的用途或保持为0。这个节点的灵活性在于它提供了多种坐标模式，每种模式都有其特定的应用场景和数学特性。

屏幕坐标系在Unity中的定义是：左下角为原点(0,0)，右上角为(1,1)或根据模式不同可能有其他范围。这种坐标系设计与传统的数学坐标系一致，但与一些图像处理软件中左上角为原点的设计有所不同，这一点在使用时需要注意。

端口详解

Screen Position节点只有一个输出端口，但通过不同的模式设置，这个端口输出的数据具有完全不同的含义和用途。

输出端口名为"Out"，类型为Vector 4，这意味着它输出一个包含四个浮点数的向量。在大多数情况下，我们主要使用X和Y分量，但了解所有分量的含义对于高级应用很重要：

X分量：表示水平方向的屏幕位置
Y分量：表示垂直方向的屏幕位置
Z分量：在不同模式下含义不同，通常为0或深度信息
W分量：通常用于齐次坐标或特殊计算，多数模式下为0

这个输出端口不直接绑定到任何特定的着色器语义，而是作为一个中间值，可以连接到其他节点进行进一步处理。这种设计使得Screen Position节点具有很高的灵活性，可以与各种其他节点组合使用。

模式控制详解

Screen Position节点最强大的特性就是其多种坐标模式选择。通过Mode下拉菜单，用户可以在五种不同的屏幕坐标表示方式之间切换，每种方式都有其独特的数学特性和应用场景。

Default模式

Default模式是Screen Position节点最常用的模式，它返回标准化的屏幕位置坐标。在这种模式下，X和Y分量的值范围被归一化到[0,1]区间，其中(0,0)对应屏幕左下角，(1,1)对应屏幕右上角。

数学上，Default模式的计算基于标准化设备坐标（NDC）。在顶点着色器阶段，位置信息被转换到裁剪空间，然后通过透视除法（除以W分量）得到NDC坐标。Default模式正是使用这些NDC坐标的X和Y分量，经过适当的缩放和偏移，使其落在[0,1]范围内。

这种模式特别适合需要与屏幕比例无关的效果，因为无论屏幕分辨率如何变化，坐标范围始终保持在0到1之间。例如，创建全屏渐变、屏幕空间遮罩或与分辨率无关的纹理映射时，Default模式是最佳选择。

在实际应用中，Default模式的一个典型用例是创建屏幕空间的光晕效果。通过将Screen Position节点的Default模式输出与一个噪声纹理结合，可以创建出随着屏幕位置变化的光照变化，而不受具体网格顶点位置的影响。

Raw模式

Raw模式提供的是原始的屏幕位置值，即在透视除法之前的裁剪空间坐标。这种模式保留了完整的齐次坐标信息，包括W分量，这使得它在投影计算和深度相关效果中特别有用。

与Default模式不同，Raw模式输出的坐标值范围不是固定的[0,1]，而是取决于具体的透视变换和相机参数。在透视相机中，这些值会随着深度变化，这正是Raw模式在投影效果中有用的原因。

Raw模式的一个关键应用是实现正确的投影纹理映射。当需要将纹理投影到场景中的物体上时，使用Raw模式可以确保投影在不同深度和角度的表面上都能正确显示，因为它考虑了透视校正所需的W分量。

另一个重要应用是深度相关的效果。由于Raw模式包含了完整的裁剪空间信息，它可以与深度纹理结合使用，创建基于像素深度的复杂效果，如雾气、水下的折射效果或者景深效果。

Center模式

Center模式将屏幕坐标系的原点移动到屏幕中心，X和Y分量的范围变为[-1,1]。这种坐标表示方式在需要对称计算或极坐标计算时特别有用。

数学上，Center模式通过对Default模式的输出进行线性变换实现：(Default_XY * 2 - 1)。这个简单的变换将原来的[0,1]范围映射到[-1,1]，同时将坐标原点从左下角移动到屏幕中心。

Center模式在创建径向渐变、圆形遮罩、镜头光晕和漩涡效果时非常有用。由于坐标系以屏幕中心为原点，计算到屏幕中心的距离变得非常简单，只需要使用length函数计算XY向量的模即可。

例如，创建一个从屏幕中心向外辐射的光晕效果，在Center模式下只需要几行代码：

HLSL

float2 centeredCoord = ScreenPosition.Center.xy;
float distanceFromCenter = length(centeredCoord);
float glow = 1.0 - saturate(distanceFromCenter);

这种基于中心距离的计算在Center模式下变得直观且高效，是许多屏幕空间效果的理想选择。

Tiled模式

Tiled模式是Screen Position节点中较为特殊的模式，它通过对Center模式的坐标进行平铺处理，创建出重复的图案效果。这种模式在创建无缝平铺纹理、网格背景或各种平铺效果时非常有用。

Tiled模式的数学处理相对复杂，它首先将坐标转换到Center模式，然后对X坐标进行纵横比校正，最后对结果应用frac函数实现平铺。具体计算如下：

HLSL

float aspectRatio = _ScreenParams.x / _ScreenParams.y;
float tiledX = frac((IN.NDCPosition.x * 2 - 1) * aspectRatio);
float tiledY = frac(IN.NDCPosition.y * 2 - 1);

这种处理确保了平铺图案在不同纵横比的屏幕上都能保持正确的比例，不会因为屏幕拉伸而变形。

Tiled模式的一个典型应用是创建动态背景图案。通过将Tiled模式的输出连接到纹理坐标，可以创建无限平铺的背景，适用于游戏UI、虚拟会议室或者各种需要重复图案的场景。

另一个有趣的应用是创建基于屏幕空间的网格效果。通过取Tiled坐标的小数部分，可以轻松创建等间距的网格线，适用于设计工具、建模软件或者需要精确对齐的界面元素。

Pixel模式

Pixel模式提供的是基于实际屏幕像素的坐标值，与Default模式的标准化坐标不同，Pixel模式的坐标范围取决于当前屏幕的分辨率。例如，在1920x1080的屏幕上，X坐标范围是[0,1919]，Y坐标范围是[0,1079]。

这种模式在需要精确像素级控制的效果中非常有用，如像素艺术风格渲染、精确的UI元素定位或者需要与屏幕像素对齐的效果。

Pixel模式的一个关键优势是它使得效果在不同分辨率下保持一致的外观。例如，创建一个总是1像素宽的边框效果，在Pixel模式下可以确保边框在任何分辨率下都保持1像素的物理宽度，而在Default模式下边框的视觉宽度会随着分辨率变化。

在实现像素艺术风格后处理时，Pixel模式是必不可少的。通过将Pixel坐标除以一个整数然后取整，可以实现像素块效果：

HLSL

float2 pixelCoord = ScreenPosition.Pixel.xy;
float2 pixelatedCoord = floor(pixelCoord / pixelSize) * pixelSize;
float2 normalizedCoord = pixelatedCoord / _ScreenParams.xy;

这种技术可以创建出复古的像素化效果，广泛应用于独立游戏和风格化渲染中。

实际应用案例

全屏渐变背景

使用Screen Position节点的Default模式可以轻松创建全屏渐变背景效果。这种效果在UI设计、场景过渡和视觉反馈中非常常见。

实现步骤：

在Shader Graph中创建Screen Position节点并设置为Default模式
使用Split节点分离出X和Y分量
将Y分量连接到Color节点的插值参数
设置渐变的起始颜色和结束颜色

这种方法的优势在于渐变效果完全基于屏幕位置，与场景中的几何体无关，可以在任何全屏效果中使用。通过调整渐变的颜色和方向，可以创建出各种氛围的背景效果。

屏幕空间水波纹效果

结合Screen Position节点的Center模式和时间节点，可以创建动态的水波纹效果。这种效果模拟了水滴落入水面后产生的同心圆波纹。

实现原理：

使用Center模式获取以屏幕中心为原点的坐标
计算当前像素到屏幕中心的距离
基于距离和时间参数计算波纹的偏移量
将偏移量应用到纹理采样坐标上

关键技术点：

HLSL

float2 centerCoord = ScreenPosition.Center.xy;
float distance = length(centerCoord);
float wave = sin(distance * frequency - time * speed) * amplitude;
float2 offset = normalize(centerCoord) * wave;
float2 distortedUV = originalUV + offset;

这种技术可以创建出逼真的水波纹效果，适用于水面材质、魔法特效或者界面动画。

投影纹理映射

使用Raw模式可以实现正确的投影纹理映射，这种技术常用于模拟幻灯机、投影仪或者魔法投影效果。

实现方法：

使用Raw模式的Screen Position输出，包含完整的XYZW分量
进行透视除法：float2 projUV = raw.xy / raw.w
根据需要调整UV坐标的缩放和偏移
使用处理后的UV坐标采样投影纹理

与普通纹理映射不同，投影纹理映射考虑了透视校正，确保纹理在不同深度和角度的表面上都能正确显示。这种技术在创建动态光照、阴影投影或者特殊视觉效果时非常有用。

像素化后处理效果

Pixel模式是实现像素化风格渲染的关键。这种效果通过将屏幕分割为大型像素块，创建出复古的视觉风格。

实现步骤：

获取Pixel模式的屏幕位置
将像素坐标除以像素块大小并取整
将取整后的坐标转换回标准化UV坐标
使用新的UV坐标采样场景颜色

HLSL

float2 pixelCoord = ScreenPosition.Pixel.xy;
float2 pixelatedCoord = floor(pixelCoord / pixelSize) * pixelSize;
float2 normalizedUV = pixelatedCoord / _ScreenParams.xy;
float4 pixelColor = SampleSceneColor(normalizedUV);

通过调整pixelSize参数，可以控制像素化程度，从轻微的复古感到强烈的块状效果都可以实现。

性能考虑和最佳实践

虽然Screen Position节点非常有用，但在使用时也需要考虑性能影响和最佳实践，以确保着色器的高效运行。

性能优化建议

在片段着色器中频繁使用Screen Position节点可能增加GPU负担，特别是在移动设备上
对于全屏效果，考虑在顶点着色器中计算屏幕位置，然后插值到片段着色器
使用最简单的模式满足需求，例如如果不需要Raw模式的特殊功能，就使用Default模式
避免在同一个着色器中多次使用Screen Position节点，可以计算一次然后重用结果

跨平台兼容性

不同平台对屏幕坐标的处理可能略有差异，特别是在处理UV坐标方向和深度值时。为了确保效果在所有平台上一致：

测试时涵盖不同的屏幕纵横比和分辨率
在移动设备上特别注意精度问题，适当使用精度修饰符
考虑使用Unity提供的平台特定宏来处理差异

常见问题解决

在使用Screen Position节点时，可能会遇到一些常见问题：

坐标反转问题：在某些平台上Y坐标可能反转，可以使用Unity的宏如UNITY_UV_STARTS_AT_TOP来处理
深度计算错误：使用Raw模式时确保正确理解W分量的含义
分辨率依赖问题：在Pixel模式下效果可能受分辨率影响，需要适当处理

高级技巧和组合应用

Screen Position节点与其他Shader Graph节点结合使用，可以创建出更加复杂和有趣的效果。

与Depth节点结合

将Screen Position节点与Depth节点结合，可以创建基于像素深度的复杂效果，如：

深度雾效：根据像素深度混合雾颜色
水平面效果：在特定深度创建水平面反射和折射
景深效果：模拟相机的焦点和模糊区域

与Time节点结合

结合Time节点可以让Screen Position效果动起来：

流动的背景图案
动态的光照扫描效果
随时间变化的扭曲效果

与Custom Function节点结合

对于特别复杂的效果，可以将Screen Position节点与Custom Function节点结合，在HLSL中实现自定义算法：

复杂的数学变换
高级噪声函数
自定义的坐标空间转换

【Unity Shader Graph 使用与特效实现】专栏-直达
（欢迎点赞留言探讨，更多人加入进来能更加完善这个探索的过程，🙏）

posted @ 2026-01-27 10:24 SmalBox 阅读(2) 评论(0) 收藏举报

刷新页面返回顶部

SmalBox

设计 AI 玩游戏🎮