且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

字体渲染到屏幕外FBO上不起作用. (注意:通过使用带有glTexImage2D的Freetype lib创建纹理来加载字体)

更新时间:2023-11-09 22:20:16

存在一些问题.

在呈现文本时启用混合:

DrawRect();

glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
RenderTexture();
glDisable(GL_BLEND);

但是主要的问题是片段着色器.片段着色器采用纹理的Alpha通道,并且颜色形成统一的颜色.

But the major issue is the fragment shader. The fragment shader takes the alpha channel of the texture and a color form a uniform.

gl_FragColor = vec4(1, 1, 1, texture2D(s_texture, texcoord).a) * myColor;

这对于渲染四边形和文本效果很好.请注意,字形存储在纹理中,其中红色绿色和蓝色为零,alpha通道包含字形蒙版.

This works fine for rendering the quad and the text. Note, the glyphs are stored in textures, where the red green and blue color is zero and the alpha channel contains the glyph mask.

您使用相同的着色器来着色帧缓冲,这根本不起作用,因为要复制帧缓冲,您将需要一个从纹理中读取颜色的着色器(您的着色器从制服中获取颜色).例如:

You use the same shader, to blit the framebuffer, that won't work at all, because for copying the framebuffer you would need a shader that reads the colors from the texture (your shader gets it from the uniform). e.g.:

gl_FragColor = texture2D(s_texture, texcoord);

如果要为所有图形使用1个着色器,则创建一个片段着色器,该片段着色器使用myColor的alpha通道,以

If you want to use 1 shader for all the drawing, then create a fragment shader, which uses the alpha channel of myColor, to mix the color channels of the texture and myColor. If it is 1, then the colors are read from myColor, if ti is 0.0, then the colors are read from the texture:

vec4 texColor   = texture2D(s_texture, texcoord);
vec3 finalColor = mix(texColor.rgb, myColor.rgb, myColor.a);
gl_FragColor    = vec4(finalColor, texColor.a);

DrawRectRenderTexture中设置颜色:

void DrawRect()
{
    // [...]

    glUniform4f(color_loc, 1.0f, 0.5f, 0.2f, 1.0f); // Orange

void RenderTexture()
{
    // [...]

    glUniform4f(color_loc, 0.5f, 0.0f, 0.0f, 1.0f); // Red

但是在render_fboTexture中将alpha通道设置为0.0:

But set an alpha channel of 0.0 in render_fboTexture:

void render_fboTexture()
{
    // [...]

    glUniform4f(color_loc, 1.0f, 1.0f, 1.0f, 0.0f); // use texture
} 


此外,render_fboTexture中四边形的纹理坐标的y分量被翻转.更改纹理坐标:


Furthermore the y component of your texture coordinates for the quad in render_fboTexture is flipped. Change the texture coordinates:

void render_fboTexture()
{
    // [...]

    GLfloat quad[4][4] = {
        {-1.0,  1.0,  0, 1},
        { 1.0,  1.0,  1, 1},
        {-1.0, -1.0,  0, 0},
        { 1.0, -1.0,  1, 0},

    // [...]
};