基于Mesh UV实现场景纹理与屏幕叠加图匹配的问题求助

阿华AIGC实验室

2026-5-29

关于《Catacombs of Solaris》特效复刻的纹理扭曲问题解答

嘿，我来帮你拆解这个问题——你遇到的纹理扭曲和视角异常问题，本质是屏幕坐标转UV的方式在非正交视角下的透视畸变，咱们一步步来分析：

1. 为什么三角边界处会出现扭曲？

你现在的做法是把每个顶点的世界坐标转成屏幕坐标，再直接转成UV赋值给Mesh，然后GPU会在三角形内部对这些UV做线性插值。但问题在于：屏幕坐标是透视投影后的结果，透视投影会让远处的顶点在屏幕上的间距被压缩，而GPU的线性插值是基于裁剪空间的，直接用屏幕坐标转的UV做线性插值，相当于在屏幕空间强行做线性映射，这和纹理在3D空间中真实的透视映射完全不符。

三角边界处的扭曲会更明显，因为相邻两个三角形的顶点UV插值方向不同，这种“错误的线性插值”会导致两个三角形的纹理衔接处出现撕裂、拉伸的视觉断层。

2. 为什么相机非垂直视角下特效效果异常？

当相机垂直对准Quad时，Quad所在平面和相机的近平面完全平行，此时世界坐标转屏幕坐标的过程相当于正交投影（或者说透视投影的平行特例），顶点的屏幕坐标和UV的映射是1:1的线性关系，所以纹理能和屏幕叠加图完美匹配。

但当相机绕Y轴旋转后，Quad和相机近平面不再平行，透视投影的“近大远小”效应开始发挥作用，顶点的屏幕坐标和3D空间中纹理的实际位置不再是线性对应关系。你直接用顶点屏幕坐标转UV的方式，完全忽略了透视投影的齐次坐标转换过程，自然会导致纹理拉伸、扭曲，和屏幕叠加图脱节。

3. 修复方案 & 相关知识学习

最优修复方案：用Shader实现透视校正的屏幕空间采样

不要在CPU端修改Mesh的UV，而是把屏幕空间UV的计算放到Shader里，让GPU自动处理透视校正。这样不管相机怎么旋转，纹理都会和屏幕叠加图完美匹配。

给你一个简单的Unlit Shader示例，直接替换Quad的材质Shader即可：

Shader "Custom/ScreenSpaceRainbow"
{
    Properties
    {
        _MainTex ("Rainbow Texture", 2D) = "white" {}
    }
    SubShader
    {
        Tags { "RenderType"="Opaque" "Queue"="Overlay" }
        LOD 100

        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag

            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
            };

            struct v2f
            {
                float4 screenPos : TEXCOORD0;
                float4 clipPos : SV_POSITION;
            };

            sampler2D _MainTex;

            v2f vert (appdata v)
            {
                v2f o;
                // 把顶点转成裁剪空间坐标
                o.clipPos = UnityObjectToClipPos(v.vertex);
                // 计算屏幕空间位置（带透视信息）
                o.screenPos = ComputeScreenPos(o.clipPos);
                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                // 透视除法：把屏幕空间坐标转成正确的UV（自动处理透视校正）
                float2 uv = i.screenPos.xy / i.screenPos.w;
                // 采样纹理
                fixed4 col = tex2D(_MainTex, uv);
                return col;
            }
            ENDCG
        }
    }
}

原理说明：

在顶点着色器中，我们计算顶点的裁剪空间坐标和屏幕空间位置（ComputeScreenPos会保留透视投影的w分量）。
在片元着色器中，通过i.screenPos.xy / i.screenPos.w做透视除法，得到的UV是经过透视校正的——GPU会基于裁剪空间的w分量对UV做正确的插值，而不是简单的线性插值，这样三角形内部的每个片元都能对应到屏幕上的正确位置，纹理自然和屏幕叠加图匹配。