Question

我在Unity3D的着色器实验室中创建了一个简单的轮廓着色器，其中包含两次遍历：遍历通过沿顶点法线乘以顶点信息来放大对象，第二遍则绘制对象的常规（基本遍历）版本。问题出在大纲通过的代码中：

Pass {
    Name "OUTLINE"

    ZWrite Off
    Blend SrcAlpha OneMinusSrcAlpha // Normal

    CGPROGRAM
    #pragma vertex vert
    #pragma fragment frag
    #include "UnityCG.cginc"

    struct appdata {
        float4 vertex : POSITION;
        float3 normal : NORMAL;
    };

    struct v2f {
        float4 position : POSITION;
        float3 normal : NORMAL;
    };

    uniform float _OutlineWidth;
    uniform float4 _OutlineColor;

    v2f vert(appdata v) {
        v.vertex.xyz *=  _OutlineWidth;

        v2f o;
        o.position = UnityObjectToClipPos(v.vertex);
        return o;
    }

    half4 frag(v2f i) : COLOR {
        return _OutlineColor;
    }

    ENDCG
}

_OutlineWidth和_OutlineColor分别是范围和颜色类型。我已将此着色器应用于以编程方式创建的几个“类似Tetromino的”网格。结果是这样（单击链接）：

image one image two

如您所见，将创建轮廓，但轮廓沿对象的外边缘不是均匀宽度。沿其中一个面的轮廓较大-沿距形状中心最远的面较大。对于非凸形状，问题会被放大；轮廓甚至根本不包含形状：

image three

我知道这是由于顶点位置是相对于形状中心的，而线v.vertex.xyz *= _OutlineWidth仅将此位置乘以恒定量（使它远离对象中心）。如何修改代码，以使轮廓像素的计算与形状的中心无关，并且与对象的真实轮廓具有完整性？

Answer 1

正如@Gnietschow所说，您需要使用这些顶点的“平滑法线”来知道扩展轮廓的方向：

hard vs smooth normals. 资料来源：FrostSoft

一种方法是在C＃中计算软法线，然后将其分配为顶点数据。本示例使用uv2和uv3通道来容纳平滑法线分量：

Mesh mesh = GetComponent<MeshFilter>().mesh;

Vector3[] meshVertices = mesh.vertices;
//map vertex positions to the ids of all vertices at that position
Dictionary<Vector3, List<int>> vertexMerge = new Dictionary<Vector3, List<int>>();
for(int i = 0; i < mesh.vertexCount; i++) {
    Vector3 vectorPosition = meshVertices[i];

    if(!vertexMerge.ContainsKey(vectorPosition)) {
        //if not already in our collection as a key, add it as a key
        vertexMerge.Add(vectorPosition, new List<int>());
    }

    //add the vertex id to our collection
    vertexMerge[vectorPosition].Add(i);
}

//map vertexIDs to the averaged normal
Vector3[] meshNormals = mesh.normals;
Vector3[] vertexAveragedNormals = new Vector3[mesh.vertexCount];

foreach (List<int> duplicatedVertices in vertexMerge.Values) {
    //calculate average normal
    Vector3 sumOfNormals = Vector3.zero;
    foreach (int vertexIndex in duplicatedVertices) {
        sumOfNormals += meshNormals[vertexIndex];
    }

    Vector3 averagedNormal = (sumOfNormals /= duplicatedVertices.Count).normalized; //average is sum divided by the number of summed elements

    //write the result to our output
    foreach (int vertexIndex in duplicatedVertices) {
        vertexAveragedNormals[vertexIndex] = averagedNormal;
    }
}


//write the result to mesh.
//x and y components shoved into uv3, z component shoved into uv4, with w component of 1.
Vector2[] vertexAveragedNormalsXY = new Vector2[mesh.vertexCount];
Vector2[] vertexAveragedNormalsZW = new Vector2[mesh.vertexCount];
for(int i = 0; i < mesh.vertexCount; i++) {
    Vector3 normal = vertexAveragedNormals[i];
    vertexAveragedNormalsXY[i] = new Vector2(normal.x, normal.y);
    vertexAveragedNormalsZW[i] = new Vector2(normal.z, 1);
}

mesh.uv3 = vertexAveragedNormalsXY;
mesh.uv4 = vertexAveragedNormalsZW;

来源：Reddeyfish-

然后，使用TEXCOORD2和TEXCOORD3重建vert中的平滑法线。使用这些移动相应的顶点位置，同时将顶点法线保持为相同的硬法线以用于任何照明目的：

Pass {
    Name "OUTLINE"

    ZWrite Off
    Blend SrcAlpha OneMinusSrcAlpha // Normal

    CGPROGRAM
    #pragma vertex vert
    #pragma fragment frag
    #include "UnityCG.cginc"

    struct appdata {
        float4 vertex : POSITION;
        float3 normal : NORMAL;
        float4 texcoord2 : TEXCOORD2;
        float4 texcoord3 : TEXCOORD3;
    };

    struct v2f {
        float4 position : POSITION;
        float3 normal : NORMAL;
    };

    uniform float _OutlineWidth;
    uniform float4 _OutlineColor;

    v2f vert(appdata v) {
        // add the outline width in the direction of the shared normal
        float3 sharedNormal = float3(v.texcoord2.xy, v.texcoord3.x);

        v.vertex.xyz +=  _OutlineWidth * sharedNormal;  

        v2f o;
        o.position = UnityObjectToClipPos(v.vertex);
        return o;
    }

    half4 frag(v2f i) : COLOR {
        return _OutlineColor;
    }

    ENDCG
}

顶点数据相乘会导致轮廓不均匀（shaderlab unity3d）

1 个答案: