![0aaf85b59577f18e524be9f675a646fb.png](https://i-blog.csdnimg.cn/blog_migrate/89b5ed17e5009d58f071d1ef0e3af358.jpeg)
前言
着色器可以看着是一段小程序,它有自己的输入与输出,并且它的输出可以传递下去,作为下一个着色器的输入。
通过前面一系列文章,可以了解到绘制一个简单三角形的流程,那么接下来我们希望绘制的三角形带有一定的”特色“,希望它能展现出更炫的效果,这里我们修改着色器来达到我们的目的。
Delevin:【OpenGL】入门篇(二)-画三角形zhuanlan.zhihu.com![5711249af5443a4a6bbbdda1e9b58789.png](https://i-blog.csdnimg.cn/blog_migrate/dcb49866025102d80d55795ec0be3628.jpeg)
以上一篇文章为例,我们创建一个颜色随时间变化的三角形,实现方式是调整片段着色器,根据时间来变化颜色,下面是实际的效果:
![0ad2dfd59130ca195b8cf49a238fb0fb.gif](https://i-blog.csdnimg.cn/blog_migrate/42edff37a8c4ccb5e1abf804b800dc23.gif)
gif截取的有些掉帧了,整体的效果是颜色随时间正弦变化
修改片段着色器
const char *fragmentShaderSource = "#version 330 coren"
"out vec4 FragColor;n"
"uniform vec4 ourColor;n"
"void main()n"
"{n"
" FragColor = ourColor;n"
"}n0";
定义了一个 ourColor;
uniform vec4 ourColor
关于Uniform
Uniform是一种从CPU中的应用向GPU中的着色器发送数据的方式,但uniform和顶点属性有些不同。首先,uniform是全局的(Global)。全局意味着uniform变量必须在每个着色器程序对象中都是独一无二的,而且它可以被着色器程序的任意着色器在任意阶段访问。第二,无论你把uniform值设置成什么,uniform会一直保存它们的数据,直到它们被重置或更新。
然后修改循环渲染的内容
//循环渲染
while(!glfwWindowShouldClose(window)){
processInput(window);
glClearColor(0.3f,0.5f,0.8f,1.0f);
glClear(GL_COLOR_BUFFER_BIT);
glUseProgram(shaderProgram);//使用这个着色器程序
float timeValue = glfwGetTime();//时间
float greenValue = sin(timeValue)/2.0f + 0.9f;
int vertexColorLocation = glGetUniformLocation(shaderProgram,"ourColor");
glUniform4f(vertexColorLocation,0.0f,greenValue,0.0f,1.0f);
//glBindVertexArray(VAO);
glDrawArrays(GL_TRIANGLES,0,3);//绘制三角形
glfwSwapBuffers(window);
glfwPollEvents();
}
着色器github代码
![051ca3bd987f738874b4600cf99754ad.png](https://i-blog.csdnimg.cn/blog_migrate/61d87954abbfb3a48fefff2ad0c3a2b0.jpeg)
以上提到的着色器,都是以字符对象的形式写在C++代码中。
![a7abe80c85c77c9d8b02d6818fbd4351.png](https://i-blog.csdnimg.cn/blog_migrate/a517e906c250bb2c2ddfba8942ecb5e1.jpeg)
除此之外还可以通过文件读取,把文件中的内容导入到string中,如下所示
![387b8568c27c16ac699156e36a481faa.png](https://i-blog.csdnimg.cn/blog_migrate/886187ba7aa82ace2bb4688674a36975.jpeg)
如何只修改着色器,让整个三角形颠倒?
首先想到的是修改顶点,选择在顶点着色器上作文章,修改y.
![ca2300c5af6082f831239b69e4c9eda5.png](https://i-blog.csdnimg.cn/blog_migrate/61fead7f5c87fd23937d9f38f4fe97b8.jpeg)
const char *vertexShaderSoucre = "#version 330 coren"
"layout (location = 0) in vec3 aPos;n"
"layout (location = 1) in vec3 aColor;n"
"out vec3 ourColor;n"
"void main()n"
"{n"
" gl_Position = vec4(aPos.x, -aPos.y, aPos.z, 1.0);n"//直接修改坐标,颠倒y的值
" ourColor = aColor;n"
"}0";
//记录的顶点被颠倒了y值,所以三角形颠倒了
如何移动三角形?
与上面的问题类似,三角的的位置变化,首先要意识到这与顶点着色器有一定联系,那么我们给三角形的每个顶点加上一个偏移量,那么三角形就整体移动了
getting-started/shaders-exercise2learnopengl.com