通过曲面细分着色器传递颜色

Question

我正在学习曲面细分。尝试通过曲面细分着色器传递颜色。就像我在这里找到的一样，最一致的答案是： Passing data through tessellation shaders to the fragment shader
到目前为止还咨询了这些资源，但还没有在我的代码中发现问题：
https://www.khronos.org/opengl/wiki/Tessellation_Control_Shader
https://www.khronos.org/opengl/wiki/Tessellation_Evaluation_Shader
由于未能通过复杂的形状，我将问题缩小到简单的基本三角形。这就是问题所在。只有最后一种、第三种颜色是从传递给着色器的三角形数据中获取的，请参阅细分三角形的 C++ 代码片段中的 TessTriangleRainbow::points。无论我这样做，第一个广告第二个颜色都会被忽略：

请注意，完全相同的代码和数据，但 未镶嵌 看起来没问题：

细分三角形的顶点着色器：

#version 430 core
layout(location = 0) in vec3 pos;
layout(location = 1) in vec3 color;
out vec4 vs_color;

void main()
{
    gl_Position = vec4(pos,   1.f);
    vs_color    = vec4(color, 1.f);
}

曲面细分控制着色器：

#version 430 core
layout (vertices = 3) out;
      in  vec4 vs_color [];
patch out vec4 patch_color;

void main()
{
    gl_TessLevelOuter[0] = 10.0;
    gl_TessLevelOuter[1] = 10.0;
    gl_TessLevelOuter[2] = 10.0;
    gl_TessLevelInner[0] = 5.0;
    gl_out[gl_InvocationID].gl_Position = gl_in[gl_InvocationID].gl_Position;
    
    patch_color = vs_color [gl_InvocationID];
}

细分评估着色器：

#version 430 core

layout (triangles, equal_spacing, cw) in;
patch in  vec4 patch_color;
      out vec4 tes_color;
void main(void)
{
    gl_Position= (
        gl_TessCoord.x * gl_in[0].gl_Position +
        gl_TessCoord.y * gl_in[1].gl_Position +
        gl_TessCoord.z * gl_in[2].gl_Position );

    tes_color = patch_color;
}

镶嵌三角形的片段着色器：

#version 430 core
out vec4 color;
in vec4 tes_color;
void main()
{
    color = tes_color;
}

镶嵌三角形来源：

GLfloat TessTriangleRainbow::points[] =
{
    //x      y       z       r    g    b
  -0.5f, -0.5f,   0.0f,   0.0f, 0.f, 1.f,   // first   xyz vertex + rgb color
   0.5f, -0.5f,   0.0f,   1.0f, 0.f, 0.f,   // second  xyz vertex + rgb color
   0.0f,  0.5f,   0.0f,   0.0f, 1.f, 0.f    // third   xyz vertex + rgb color
};
//The base class Tess is tesselation shader aware
//It is responsible for compiling linking the shaders
TessTriangleRainbow::TessTriangleRainbow()
    : Tess ("shaders/tesselation/triangleRainbow.tcs", "shaders/tesselation/triangleRainbow.tes",
            "shaders/tesselation/triangleRainbow.vs",  "shaders/tesselation/triangleRainbow.fs")
{
    build();
}

void TessTriangleRainbow::build()
{
    glGenVertexArrays(1, &vao);
    glBindVertexArray(vao);

    unsigned int vbo;
    glGenBuffers(1, &vbo);
    glBindBuffer(GL_ARRAY_BUFFER, vbo);
    glBufferData(GL_ARRAY_BUFFER, sizeof(points), &points, GL_STATIC_DRAW);

    //get XYZ values into location 0 on vertex shader
    glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);
    glEnableVertexAttribArray(0);

    //RGBA to location 1
    glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3 * sizeof(float)));
    glEnableVertexAttribArray(1);


    glBindVertexArray(0);
}
void TessTriangleRainbow::draw()
{
    glUseProgram(*this); //the inherited overloaded (int) operator returns the program id
    glPatchParameteri(GL_PATCH_VERTICES, 3);

    glBindVertexArray(vao);
    glDrawArrays(GL_PATCHES, 0, 3);
}

非镶嵌三角形的顶点着色器：

#version 430 core
layout(location = 0) in vec3 pos;
layout(location = 1) in vec3 color;
out vec4 vs_color;
void main()
{
    gl_Position = vec4(pos,   1.f);
    vs_color    = vec4(color, 1.f);
}

非镶嵌三角形的片段着色器：

#version 430 core
out vec4 color;
in vec4 vs_color;
void main()
{
    color = vs_color;
}

非镶嵌三角形源，与镶嵌三角形几乎相同：

GLfloat TriangleRainbow::points[] = identically the same as tessellated ones
//base Shape class builds the program from shaders
TriangleRainbow::TriangleRainbow()
    : Shape ( "shaders/tesselation/triangleRainbow.1.vs",  "shaders/tesselation/triangleRainbow.1.fs")
{
    build();
}

void TriangleRainbow::build()
{
    ... it is identically the same as the tessellated one
}
void TriangleRainbow::draw()
{
    glUseProgram(*this); //the inherited overloaded (int) operator returns the program id
    glBindVertexArray(vao);
    glDrawArrays(GL_TRIANGLES, 0, 3);
}

主要功能部分：

    TessTriangleRainbow   tessTriRainbow;
    TriangleRainbow       triRainbow;
    ... other shapes

    if (!tessTriRainbow.program.success) /*report tessellated triangle shader compile errors*/ ...
    if (!triRainbow.program.success) /*report triangle shader compile errors*/ ...
    ...

    glDisable(GL_CULL_FACE);
    //glEnable(GL_DEPTH_TEST);

    int currentShape = 0;
    while (!glfwWindowShouldClose(window))
    {
        processInputs(window);
        if (keyPressed) { /* change here currentShape to draw*/ ... }

        glClearColor(0.f, 0.f, 1.f, 1.0f);
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

        switch (currentShape)
        {
        case 0: triRainbow.draw();     break;
        case 1: tessTriRainbow.draw(); break;
        ...

Answer 1

您正在使用 Per-patch output。因此图元中的所有颜色属性都变得相同（从补丁中的最后一个顶点开始）：

patch out vec4 patch_color;

void main()
{
  // [...] 
  
   patch_color = vs_color [gl_InvocationID];
}

如果你想要每个顶点的颜色，你必须使用 Per-vertex outputs。输出变量必须是数组。

曲面细分控制着色器：

out vec4 vertex_color[];

void main
{
    // [...]

    vertex_color[gl_InvocationID] = vs_color[gl_InvocationID];
}

细分评估着色器：

#version 430 core

layout (triangles, equal_spacing, cw) in;
in  vec4 vertex_color[];
out vec4 tes_color;

void main(void)
{
    gl_Position =
        gl_TessCoord.x * gl_in[0].gl_Position +
        gl_TessCoord.y * gl_in[1].gl_Position +
        gl_TessCoord.z * gl_in[2].gl_Position;

    tes_color = 
        gl_TessCoord.x * vertex_color[0] +
        gl_TessCoord.y * vertex_color[1] +
        gl_TessCoord.z * vertex_color[2];
}

通过曲面细分着色器传递颜色

Passing colours through tessellation shaders

c++

opengl

shader

glsl

tessellation