首页 文章

传递具有不同含义的两个矩形,从几何到片段着色器

提问于
浏览
3

我已经将Cinder库签名的距离字体处理改编为Delphi,现在正在实现一个扭曲,在一次调用中上传多个文本的所有数据,并在缩放时对相对大小进行控制(使用制服代替1.0001)几何着色器中的因子,尚未在此代码中工作)

基本的有符号距离处理没有改变,我只尝试使用几何着色器计算所需的矩形 . 我理解如何使用triangle_strip创建目标矩形(字符必须出现的位置),但是在将texcoord传递给片段着色器时遇到了问题 .

  • 目标矩形:输入topleft.xy widthheight(dimensions)用于计算屏幕上每个字符的目标矩形 . 使用gl_position .

  • 纹理源矩形2:texcoordtl texdimens,字体纹理中字符的topleft点维度 . 这是我不确定的要点 . 使用texcoord in / out param传递给片段 .

我会感激任何研究指针或途径,并特别想知道我计算texcoord坐标的方式并将它们传递给片段着色器 .

下面记录的数组与GL_ARRAY_BUFFER绑定,并使用一系列glGetAttribLocation / glEnableVertexAttribArray / glVertexAttribPointer调用进行描述)

绘图是使用

glDrawArrays(GL_POINTS, 0, numberofelements_in_array );

记录:

TGLCharacter = packed record // 5*2* single + 1*4 byte color + 1*4 byte detail. = 48 bytes per character drawn
              origin     : TGLVectorf2;  // origin of text   ( = glfloat[2])
              topleft    : TGLVectorf2;  // origin of this character
              widthheight: TGLVectorf2;  // width and heght this chracter
              texcoordtl : TGLVectorf2;  // coordinates topleft in texture.
              texdimens  : TGLVectorf2;  // sizes in texture
              col        : TGLVectorub4; // 4 colors, 1 per rect vertex
              detail     : integer;      // layer. Not used in this example.
              end;

几何代码首先因为我期待这里的问题:

#version 150 compatibility
    layout(points) in;
    layout(triangle_strip, max_vertices = 4) out;

    in vec2 gorigin[];
    in vec2 gtopleft[];
    in vec2 gwidthheight[];
    in vec2 gtexcoordtl[];
    in vec2 gtexdimens[];
    in vec4 gcolor[];

    out vec3 fColor;
    out vec2 texcoord;

    void main() {
        // calculate distance cur char - first char of this text
        vec2 dxcoordinate = (gtopleft[0]-gorigin[0]);
        // now multiply with uniform here and calc new coordinate:
        // for now we use uniform slightly close to 1 to make debugging easier and avoid
        // nvidia's shadercompiler to optimize gorigin out.
        // equal to 1, and the nvidia shader optimizes it out.
        vec2 x1y1 = 1.0001*gorigin[0]+dxcoordinate;
        vec2 x2y2 = x1y1+gwidthheight[0]*1.0001;
        vec2 texx1y1 = gtexcoordtl[0];
        vec2 texx2y2 = gtexcoordtl[0]+gtexdimens[0];

        fColor = vec3(gcolor[0].rgb);


        gl_Position = gl_ModelViewProjectionMatrix * vec4(x1y1,0,1.0);
        texcoord = texx1y1.xy;
        EmitVertex();
        gl_Position = gl_ModelViewProjectionMatrix * vec4(x2y2.x,x1y1.y,0,1.0);
        texcoord = vec2(texx2y2.x,texx1y1.y);
        EmitVertex();
        gl_Position= gl_ModelViewProjectionMatrix * vec4(x1y1.x,x2y2.y,0,1.0);
        texcoord = vec2(texx1y1.x,texx2y2.y);
        EmitVertex();
        gl_Position = gl_ModelViewProjectionMatrix * vec4(x2y2,0,1.0);
        texcoord = texx2y2.xy;
        EmitVertex();
        EndPrimitive();
    }

碎片代码:

#version 150 compatibility

uniform sampler2D   font_map;
uniform float      smoothness;

const float gamma = 2.2;

in vec3 fColor;
in vec2 texcoord;
void main()
{
  // retrieve signed distance
  float sdf = texture2D( font_map, texcoord.xy ).r;

  // perform adaptive anti-aliasing of the edges
  float w = clamp( smoothness * (abs(dFdx(texcoord.x)) + abs(dFdy(texcoord.y))), 0.0, 0.5);
  float a = smoothstep(0.5-w, 0.5+w, sdf);

  // gamma correction for linear attenuation
  a = pow(a, 1.0/gamma);

  if (a<0.1)
  discard;

  // final color
  gl_FragColor.rgb = fColor.rgb;
  gl_FragColor.a = gl_Color.a * a;
}

顶点代码可能是好的我猜 .

#version 150 compatibility

in vec2 anorigin;
in vec2 topleft;
in vec2 widthheight;
in vec2 texcoordtl;
in vec2 texdimens;
in vec4 color;


out vec2 gorigin;
out vec2 gtopleft;
out vec2 gwidthheight;
out vec2 gtexcoordtl;
out vec2 gtexdimens;
out vec4 gcolor;


void main()
{
  gorigin=anorigin;
  gtopleft=topleft;
  gwidthheight=widthheight;
  gtexcoordtl=texcoordtl;
  gtexdimens=texdimens;
  gcolor=color;

  gl_Position = gl_ModelViewProjectionMatrix * vec4(anorigin.xy,0,1.0);;
}

1 回答

  • 1

    上面的代码有效 . 问题在于上传代码,因此上传了错误的顶点数据 . 我在调试时对上面的代码做了一些小修改,并将其添加到问题中,以便现在的问题显示工作代码 .

    下面是一些可能的代码,它们会更改frag着色器的最后两行以创建轮廓字体 . 虽然我还不高兴 . 当缩小时,字体的颜色似乎会改变

    vec3 othercol; // to be added to declarations
    

    ..丢弃声明下方的其他着色器变为:

    othercol=vec3(1.0,1.0,1.0);
      if (sqrt(0.299 * fColor.r*fColor.r + 0.587 * fColor.g*fColor.g + 0.114 * fColor.b*fColor.b)>0.5)
        {  othercol=vec3(0,0,0);}
    
      // final color
      if (sdf>0.25 && sdf<0.75)
         {gl_FragColor.rgb = othercol.rgb;}
         else
         {gl_FragColor.rgb = fColor.rgb;}
    
    
      gl_FragColor.a = gl_Color.a * a;
    }
    

相关问题