Shader学习笔记，通过GLSL实现

from: http://www.ituring.com.cn/article/851

最近一直在专心研究利用GLSL编写Shader，写点东西将自己学的总结一下，把自己学习shader的经历分享一下，希望能对有兴趣学习shader的同学有些帮助，但这些玩意还算不上教程，很多都是我自己在学习中的问题以及如何解决的，有什么不足还请各位指出，想要系统的学习GLSL的话还是推荐大家看《OpenGL Shading Language 3rd Edition》，但如果你对OpenGL也一无所知的话，那就请从《OpenGL Programming Guide 7th Edition》读起了。

本次主要是给大家一个GLSL的简单示例，对于一门新的语言或者技术，初学者入门总是要通过阅读一些示例程序，我在初学GLSL的时候也是这样，但是上网找了一圈发现，网上的大牛们所给的示例大部分都是仅仅有shader的代码，而没有相应的OpenGL应用程序，好不容易找到一个完整的也只是简简单单的渲染一个2D三角形，但是如果如果是想渲染一个带有光照的3D模型呢？如何在OpenGL程序中加入对shader的支持呢？如何向shader中传递数据呢？等等这些问题虽然书中会有答案，但是却缺少一个完整的示例将他们系统的整合起来，下面我就给出一个利用GLSL+OpenGL实现最基本的Binn-phong+lamber光照的的程序，至于具体算法就不细讲了，有兴趣的可以自己研究一下，很简单的。

在本程序中，顶点着色器完成了几乎所有任务，包括顶点由物体坐标系到投影坐标系的变换以及所有的光照计算，而片段着色器只是完成了颜色数据的传递，但在后面由于一些算法的要求（例如bumpmap），我们还会将光照计算移到片段着色器中，这里要注意，其实除了个别一些功能以外（例如顶点的空间变化或者纹理查询），很多的计算均可以放在顶点着色器或者片段着色器里，其区别只是计算速度与图像的质量。下面是着色器代码：

顶点着色器（Vertex Shader）：

uniform vec3 lightposition;//光源位置
uniform vec3 eyeposition;//相机位置
uniform vec4 ambient;//环境光颜色
uniform vec4 lightcolor;//光源颜色
uniform float Ns;//高光系数
uniform float attenuation;//光线的衰减系数

varying vec4 color;//向片段着色其传递的参数

void main()
{
/*很多示例中都是利用uniform参数从应用程序中向shader里传递当前模型视图矩阵和模型视图投影矩阵，其实对于初学者来说，我们大可以先用GLSL的内建变量：gl_ModelViewMatrix和gl_ModelViewProjectionMatrix代替，而顶点坐标的变换则直接可以利用内建函数ftransform()实现。当然，如果你想自己传递这些参数也是可以的，后面会介绍一下。而gl_Vertex和gl_Normal则分别表示当前传入的顶点的物体坐标系坐标和表面法向量，gl_Position则是用来传输投影坐标系内顶点坐标的内建变量。注意内建变量是不用声明的，直接使用就行*/
vec3 ECPosition = vec3(gl_ModelViewMatrix * gl_Vertex);

vec3 N = normalize(gl_NormalMatrix * gl_Normal);
vec3 L = normalize(lightposition - ECPosition);
vec3 V = normalize(eyeposition - ECPosition);
vec3 H = normalize(V + L);

vec3 diffuse = lightcolor * max(dot(N , L) , 0);
vec3 specular = lightcolor * pow(max(dot(N , H) , 0) , Ns) * attenuation;

color = vec4(clamp((diffuse + specular) , 0.0 , 1.0) , 1.0);
color = color + ambient;

gl_Position = ftransform();
}

片段着色器（Fragment Shader）:
//这里的的varying变量名称要与顶点着色器里的一样，否则会编译错误
varying vec4 color;

void main()
{
//gl_FragColor是输出片段颜色的内建变量，凡是以gl_开头的变量都是内建变量
gl_FragColor = color;
}

其实shader程序不是很难写，我学习的过程中主要是卡在了OpenGL程序和shader程序的关联上，其实后来看看并不是太难，总结起来也就是读取shader代码；建立、编译shader；向shader中传递数据，其他的和一般的OpenGL程序差不多，下面给出OpenGL程序：

//头文件是我自己封装的工具包，功能包括：读取shader源文件；初始化shader和program等 #include

GLfloat ambient[4] = {1.0 , 0.0 , 0.0 , 1.0};
GLfloat lightcolor[4] = {1.0 , 1.0 , 1.0 , 1.0};
GLfloat eyeposition[3] = {0.0 , 10.0 , 30.0};
GLfloat skycolor[3] = {0.7 , 0.7 , 1.0};
GLfloat groundcolor[3] = {0.2 , 0.2 , 0.2};
GLfloat Ns = 8;
GLfloat attenuation = 0.1;
GLfloat objectSize = 15.0;
GLuint program;
GLuint vShader , fShader;

void myInit()
{
glewInit();
glClearColor(0.0 , 0.0 , 0.0 , 1.0); glEnable(GL_DEPTH_TEST);

//读取源文件
const GLchar *vShaderSource = readShaderSource("GLSL_sample2.vert");
const GLchar *fShaderSource = readShaderSource("GLSL_sample2.frag");
//初始化shader和program
vShader = buildShader(&vShaderSource , GL_VERTEX_SHADER);
fShader = buildShader(&fShaderSource , GL_FRAGMENT_SHADER);
program = buildShaderProgram(vShader , fShader);
}

void myReshape(int w , int h)
{
glViewport(0 , 0 , (GLsizei)w , (GLsizei)h);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
gluPerspective(90 , 1 , 0.1 , 1000.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
gluLookAt(eyeposition[0] , eyeposition1 , eyeposition[2] , 0.0 , 0.0 , 0.0 , 0.0 , 1.0 , 0.0);
}

void myDisplay()
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glColor3f(1.0 , 1.0 , 1.0);

/这里是程序比较重要的地方：向给shader中的uniform变量赋值。注意赋值函数使用的位置，只有当一个program启用的时候，里面的uniform变量才会被分配索引，所以过早的对uniform变量赋值会长生错误。同时注意函数的格式/
glUseProgram(program);
glUniform3f(glGetUniformLocation(program , "lightposition") , 30.0 , 30.0 , 30.0);
glUniform3f(glGetUniformLocation(program , "eyeposition") , eyeposition[0] , eyeposition1 , eyeposition[2]);
glUniform4f(glGetUniformLocation(program , "ambient") , ambient[0] , ambient1 , ambient[2] , ambient[3]);
glUniform4f(glGetUniformLocation(program , "lightcolor") , lightcolor[0] , lightcolor1 , lightcolor[2] , lightcolor[3]);
glUniform1f(glGetUniformLocation(program , "Ns") , Ns); glUniform1f(glGetUniformLocation(program , "attenuation") , attenuation);
/刚开始我以为要利用shader进行渲染就要必须将模型变为一个一个顶点信息向shader中传入，但其实并不是这样，我们同样可以利用glut的内建模型或者自己动手载入模型，和平时一样。同时注意一点，glut的一些内建模型只包含平面法线，没有纹理坐标，所以在后面我们给模型添加纹理的时候有些就无法显示出纹理/
glutSolidTeapot(objectSize);
glutSwapBuffers();
}

void main(int argc , char** argv)
{
glutInit(&argc , argv);
glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);
glutInitWindowPosition(100 , 100);
glutInitWindowSize(600 , 600);
glutCreateWindow("GLSL_example2");
myInit();
glutReshapeFunc(myReshape);
glutDisplayFunc(myDisplay);
glutIdleFunc(myDisplay);
glutMainLoop();
}
程序效果：

前面说到了我们自己向shader中传递矩阵数据，这里简单说一下：

**在程序中向声明个变量，例如**GLfloat modelViewMatrix[16];

**然后在完成视图模型矩阵的设置后调用**glGetFloatv(GL_MODELVIEW_MATRIX ,modelViewMatrix);

**然后在program启用后调用**glUniformMatrix4fv(glGetUniformLocation("modelViewMatrix"), 1 , GL_FALSE , modelViewMatrix);

这样就完成了向shader中传递我们自己的矩阵数据。 总的说来整个程序并不是很难，但我是折腾了有一阵才搞成功，估计还是我太水了的缘故吧。。。