screenSize
screenSize
在 TSL 片元着色器中,提供当前渲染目标的总尺寸(宽度和高度,以像素为单位),是实现分辨率自适应效果和坐标系转换的基础。
核心优势
能够创建响应式的、分辨率自适应的视觉效果,并且是将在物理像素坐标转换为归一化UV坐标(大多数屏幕空间算法的标准)的关键。
常见用途
计算屏幕宽高比以校正程序化图形的形变,确保其不被拉伸。
通过 `screenCoordinate / screenSize` 将像素坐标转换为归一化的UV坐标。
通过 `1.0 / screenSize` 计算单像素在UV空间的大小,用于高级采样技术(如FXAA)。
如何调整
此节点的值由渲染器根据画布尺寸自动提供,不可调整。其效果由它在计算中的用法决定:通过除法(`screenCoordinate.div(screenSize)`)进行归一化,通过分量比(`screenSize.x.div(screenSize.y)`)计算宽高比,或通过倒数(`1.0 / screenSize`)获取单像素大小。
代码示例
1// 计算屏幕的宽高比
2const aspectRatio = screenSize.x.div( screenSize.y );
3
4// 校正UV坐标以防止拉伸
5const uvCorrected = uv.sub( 0.5 );
6uvCorrected.x = uvCorrected.x.mul( aspectRatio );
7
8// 基于校正后的坐标计算距离,确保圆形不会变形
9const dist = length( uvCorrected );