c - 在 OpenGL 中应用着色器时不会渲染纹理
问题描述
按照教程,我正在尝试使用 FreeType 在 OpenGL 中渲染文本。因此,灰度 8 位图像被用作每个字符的纹理,图像的每个字节对应于纹理的红色分量。
为了以其他颜色呈现文本,建议您使用 Shader。但是,当使用提供的着色器时,我看到的不是彩色字母,而是一个彩色框,好像根本没有涉及纹理。
这是没有 Shader 时的样子:
下面是它在着色器中的外观:
(盒子的位置也发生了变化)
这是顶点着色器代码:
#version 330 core
layout (location = 0) in vec4 vertex;
out vec2 TexCoords;
void main() {
gl_Position = vec4(vertex.xy, 0.0, 1.0);
TexCoords = vertex.zw;
}
这是片段着色器代码:
#version 330 core
in vec2 TexCoords;
out vec4 color;
uniform sampler2D text;
uniform vec4 textColor;
void main() {
vec4 sampled = vec4(1.0, 1.0, 1.0, texture(text, TexCoords).r);
color = textColor * sampled;
}
这是在屏幕上呈现的代码:
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
// Shader here
glUseProgram(shaderProgram);
glUniform4f(
glGetUniformLocation(shaderProgram, "textColor"),
0.0f, 1.0f, 0.0f, 1.0f
);
glActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D, texID);
glUniform1i(glGetUniformLocation(shaderProgram, "text"), 0);
// Draw here
glBegin(GL_QUADS);
glTexCoord2f(1., 0.);
glVertex2f(20. / WIDTH, 20. / HEIGHT);
glTexCoord2f(0., 0.);
glVertex2f(100. / WIDTH, 20. / HEIGHT);
glTexCoord2f(0., 1.);
glVertex2f(100. / WIDTH, 100. / HEIGHT);
glTexCoord2f(1., 1.);
glVertex2f(20. / WIDTH, 100. / HEIGHT);
glEnd();
而且,这里是整个代码:
#include <stdio.h>
#include <GL/glew.h>
#include <GLFW/glfw3.h>
#include <ft2build.h>
#include FT_FREETYPE_H
#include <freetype2/freetype/freetype.h>
const unsigned int WIDTH = 640;
const unsigned int HEIGHT= 480;
const char *vertex_shader_src =
"#version 330 core\n"
"layout (location = 0) in vec4 vertex;\n"
"out vec2 TexCoords;\n"
"void main() {\n"
"gl_Position = vec4(vertex.xy, 0.0, 1.0);\n"
"TexCoords = vertex.zw;}\0";
const char *frag_shader_src =
"#version 330 core\n"
"in vec2 TexCoords;\n"
"out vec4 color;\n"
"uniform sampler2D text;\n"
"uniform vec4 textColor;\n"
"void main() {\n"
"vec4 sampled = vec4(1.0, 1.0, 1.0, texture(text, TexCoords).r);\n"
"color = textColor * sampled;}\0";
int main() {
// -------------------------------------------------------------------------
// WINDOW INITIALIZATION
GLFWwindow *window;
glfwInit();
window = glfwCreateWindow(640, 480, "SHADER", NULL, NULL);
glfwMakeContextCurrent(window);
glfwSwapInterval(1);
glClearColor(0., 0. , 0., 1.);
glColor4f(1., 1., 1., 1.);
glPointSize(1.);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glOrtho(0, (WIDTH*1.)/HEIGHT, 1., 0, 1., -1.);
glViewport(0, 0, WIDTH, HEIGHT);
// -------------------------------------------------------------------------
// SHADER INITIALIZATION
glewInit();
int vertexShader = glCreateShader(GL_VERTEX_SHADER);
glShaderSource(vertexShader, 1, &vertex_shader_src, NULL);
glCompileShader(vertexShader);
int fragShader = glCreateShader(GL_FRAGMENT_SHADER);
glShaderSource(fragShader, 1, &frag_shader_src, NULL);
glCompileShader(fragShader);
int shaderProgram = glCreateProgram();
glAttachShader(shaderProgram, vertexShader);
glAttachShader(shaderProgram, fragShader);
glLinkProgram(shaderProgram);
glDeleteShader(vertexShader);
glDeleteShader(fragShader);
// -------------------------------------------------------------------------
// TEXTURE FOR A SINGLE CHARACTER
FT_Library ft;
if (FT_Init_FreeType(&ft)) {
printf("Error in FT_Init_FreeType\n");
return 1;
}
FT_Face face;
if (FT_New_Face(ft, "Ubuntu-R.ttf", 0, &face)) {
printf("Error in FT_New_Face\n");
return 1;
}
FT_Set_Pixel_Sizes(face, 0, 96);
glPixelStorei(GL_UNPACK_ALIGNMENT, 1);
glEnable(GL_TEXTURE_2D);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
if (FT_Load_Char(face, 'A', FT_LOAD_RENDER)) {
printf("Error in FT_Load_Char\n");
return 1;
}
unsigned int texID;
glGenTextures(1, &texID);
glBindTexture(GL_TEXTURE_2D, texID);
glTexImage2D(
GL_TEXTURE_2D, 0, GL_RED,
face->glyph->bitmap.width,
face->glyph->bitmap.rows,
0, GL_RED, GL_UNSIGNED_BYTE,
face->glyph->bitmap.buffer
);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glBindTexture(GL_TEXTURE_2D, 0);
FT_Done_Face(face);
FT_Done_FreeType(ft);
// -------------------------------------------------------------------------
// MAIN LOOP
while (!glfwWindowShouldClose(window)) {
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
// Shader here
glUseProgram(shaderProgram);
glUniform4f(
glGetUniformLocation(shaderProgram, "textColor"),
0.0f, 1.0f, 0.0f, 1.0f
);
glActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D, texID);
glUniform1i(glGetUniformLocation(shaderProgram, "text"), 0);
// Draw here
glBegin(GL_QUADS);
glTexCoord2f(1., 0.);
glVertex2f(20. / WIDTH, 20. / HEIGHT);
glTexCoord2f(0., 0.);
glVertex2f(100. / WIDTH, 20. / HEIGHT);
glTexCoord2f(0., 1.);
glVertex2f(100. / WIDTH, 100. / HEIGHT);
glTexCoord2f(1., 1.);
glVertex2f(20. / WIDTH, 100. / HEIGHT);
glEnd();
glUseProgram(0);
glFlush();
glfwSwapBuffers(window);
glfwPollEvents();
}
glDeleteProgram(shaderProgram);
glfwDestroyWindow(window);
glfwTerminate();
return 0;
}
我怀疑这个问题要么是因为我实际上没有将纹理发送到着色器,要么是着色器错误。
解决方案
您正在使用Legacy OpenGL OpenGL,并且正在通过立即模式glBegin
/glEnd
序列绘制几何图形。您无法访问glTexCoord
由通用顶点着色器输入设置的纹理坐标。请参阅OpenGL 4.0++ 核心配置文件中固定功能管道的属性位置是什么?.
您必须将顶点着色器降级到 GLSL 版本 1.20(OpenGL 着色语言 1.20 规范),并且您必须通过以下方式访问顶点坐标gl_Vertex
和纹理坐标gl_MultiTexCoord0
:
#version 120
varying vec2 TexCoords;
void main()
{
gl_Position = vec4(gl_Vertex.xy, 0.0, 1.0);
TexCoords = gl_MultiTexCoord0.st;
}
如果您想使用问题中的着色器,那么您必须指定顶点属性数组glVertexAttribPointer
(请参阅Vertex Specification)并且您必须通过以下方式绘制几何图形glDrawArrays
:
例如:
float vertex_attributes[] = {
20. / WIDTH, 20. / HEIGHT, 1., 0.,
100. / WIDTH, 20. / HEIGHT, 0., 0.,
100. / WIDTH, 100. / HEIGHT, 0., 1.,
20. / WIDTH, 100. / HEIGHT, 1., 1.
};
glVertexAttribPointer(0, 4, GL_FLOAT, GL_FALSE, 0, &vertex_attributes);
glEnableVertexAttribArray(0);
glDrawArrays(GL_QUADS, 0, 4);
glDisableVertexAttribArray(0);
请注意,这glewInit()
必须glfwMakeContextCurrent()
在任何 OpenGL 指令之后但之前完成。
推荐阅读
- c# - 无法访问的代码,但可以通过异常访问
- facebook - Facebook Messenger Bot Dialogflow:使用 Firebase HTTP 请求通过 webhook 获取响应
- javascript - 在 Javascript 中更改光标类型
- javascript - PrimeFaces PolarArea Chart - GridLine 颜色变化
- t4 - 仅在 linq2db 中使用 T4Model 为选定表生成 POCO 类
- ios - iPad pro 无法全屏打开我的应用程序
- swift - 如何在 Firebase 数据库中保存日期?[迅速]
- sql - 如何在 SQLite 中添加外键?
- python - Colab 不工作。TypeError:图像数据无法转换为浮点数
- c++ - 在 C++ 中迭代和创建日期和时间