OpenGL 四

代码 or demo查看请滑动到最后。

一、问题场景：

在 3D 图形的渲染过程中，我们是需要来决定哪部分是要对观察者可见/不可见的，对于不可见的部分，我们就没有渲染的必要了，要及早丢弃掉他们。例子：一间草屋，我们站在门前的时候，草屋的背后我们是看不到的，那么就不要渲染它了。否则就会出现下图中的场景(我们绘制一个立体图形后对其进行旋转操作查看时，背面我们本应是看不到的面也被看到了)，叫做“隐藏面消除”(Hidden surface elimination)。 (图中的)

背面为什么黑色呢？光源着色器，想象一下我们在太阳光下，光打下来，朝阳和背阳的两个场景下，是不是一面亮一面暗呢。

二、解决方案

1：油画算法（过时且浪费性能-重复渲染）

　　先绘制画面中距离观察者远的物体，再绘制较*的物体。由远及*，如下图，远的会被*物遮住。

但是如果是下面这种场景，油画算法就无法解决了：

这种每个面都要看到部分的场景怎么办呢？

2、正背面剔除(Face Culling)

背景：

　　想象一个 3D 图形，从任何一个⽅向去观察，我们最多可以看到⼏个⾯？最多3面。从⼀个⽴方体的任意位置和⽅向上看，最多不可能看到多于3个面。那么，为何还要多余的去绘制那些根本看不到的3个面呢? 如果能以某种⽅式去丢弃这部分数据, OpenGL 在渲染的性能就可以提高超过 50% 呢。

问题分析：

　　如何知道某个⾯在观察者的视口中不会出现？任何*⾯都有2个面：正⾯/背面。这意味着我们在一个时刻只能看到一⾯。

　　OpenGL 可以做到检查所有正面朝向观察者的面并渲染它们，⽽丢弃背⾯朝向的面，这样可以节约片元着⾊器的性能。

　　OpenGL 如何知道我们绘制的图形哪是正面呢？可通过分析顶点数据的顺序。

分析顶点数据：

1）正背面区分：OpenGL 中按逆时针进行顶点相连的三角形面为正面，顺时针相连的三角形面为背面 -- 规则如此

2）立方体的正背面

眼睛在右侧时，右边顶点按逆时针顺序，为正面，左侧为顺时针背面；眼睛在左侧时，则左侧为正面。

归结：

正面和背面是由三角形的顶点定义顺序鹅观察者方向共同决定的，随着观察者观察角度的改变，正背面也会跟着改变。

解决操作：

　　a、开启表面剔除(默认背面剔除)
　　void glEnable(GL_CULL_FACE);

　　b、关闭表⾯剔除(默认背面剔除)
　　void glDisable(GL_CULL_FACE);

　　c、用户选择剔除哪个面(正面/背面)

　　void glCullFace(GLenum mode); // mode参数为: GL_FRONT、GL_BACK、GL_FRONT_AND_BACK，默认GL_BACK ⽤户指定旋转顺序哪个为正面

　　void glFrontFace(GLenum mode); // mode参数为: GL_CW、GL_CCW，默认值：GL_CCW

　　例子,剔除正面的实现

　　(1) glCullFace(GL_BACK);

　　　 glFrontFace(GL_CW);

　　(2) glCullFace(GL_FRONT);

我们对背面进行剔除后，图形好像正常了，但是，旋转到一定角度，发现：

这又是怎么回事儿呢？

下图中，当我们旋转到这个角度继续旋转时，此时A、B面都是正面，但继续旋转至A、B面重合，此时OpenGL无法区分谁才是正面应该也无法确定要显示A or B，因而出现了上图的场景。

我们应该怎么在解决隐藏面消除的同时，告诉OpenGL我们要显示谁呢？

3、Z-buffer 方法(深度缓冲区Depth-buffer)

1）深度

a、深度：像素点在3D世界中，距离观察者(眼睛)的距离 -- Z值(这个值是指物体的Z值)

b、深度缓冲区：存储在显存值的一块区域，它主要就存储每个像素点的深度值，Z绝对值越大，说明距离观察者越远 -- 想象我们的现实世界。

　　Z值的绝对值：因为我们可能在Z轴的负轴。负值(负数)越小对应的绝对值(正数)越大。

c、深度缓冲区用来做什么呢？

　　想象一个场景：当我们绘制一幅草屋图时，不按远*顺序而是随意绘制，若先画了*处场景(门前的栏杆)再画远处场景(大门)，那么此时在我们的画中大门就在栏杆的前面了，这是不符合逻辑的。想象下在现实生活中，如果眼前远景和*景无法分辨产生了混乱，我们眼前的世界就光怪陆离了。

　　有了深度，我们就可以知道每个点距离我们眼睛的远*，进而也就知道当2处重叠时我们应该看见的是哪一部分了 --> 对比到OpenGL上，有了深度缓冲区，知道了深度值，绘制时也就不担心绘制顺序和渲染谁了。 OpenGL中，只要存在深度缓存区(缓存==缓冲名字而已)，OpenGL都会把像素的深度值写入进去。除非手动禁止写入：glDepthMask(GL_FALSE)。(深度缓冲区中针对某个像素点只存一个对应值，重叠时我们需要知道应该存哪个值)

2）深度测试

a、什么是深度测试？DepthBuffer(深度缓冲区)和ColorBuffer(颜色缓冲区)是一一对应的，我们知道颜色缓冲区是存储像素的颜色信息，深度缓冲区是存储像素的深度信息。在决定是否要绘制某个物体表面时，首先要将表面对应的像素深度(A)与深度缓冲区中的深度值(B)进行对比，A>B则丢弃掉A对应的表面不绘制；A<B，则拿出这个像素对应的深度值和颜色值，对应的分别去更新深度缓冲区和颜色缓冲区。这个过程称为“深度测试”。

b、深度测试的使用

开启：glEnable(GL_DEPTH_TEST) -- 深度测试的值默认1，范围[0,1]

绘制开始前，首先清空缓冲区(颜色和深度都要清)：glClear()GL_COLEO_BUFFER_BIT | GL_DEPTH_BUFFER_BIT)

深度测试的模式 mode：

关闭：glDisable(GL_DEPTH_TEST)　

开启深度测试后：我的圈圈终于正常了，它是不是不会再出问题了呢？

开启深度测试也是存在风险的

4、ZFlighting 闪烁问题 - (深度测试的潜在风险)

1）产生场景：受限于设备的精度，当我们的绘制精度大于设备所支持精度就会出现。（根本原因：精度。目前的设备上较少会出现）

原因：开启深度测试后，OpenGL 就不会绘制被遮挡的部分了。此时绘制的图形已符合我们的现实场景了，但是，由于深度缓存区精度的限制，当出现两个像素的深度值相差很小(例子:0.0000005/0.0000007)时 --> OpenGL可能无法正确判断2个值大小 --> 深度测试的结果不确定性 --> 画面交错闪烁(AB的重叠绘制可能出现随机绘制 - 一会儿A一会儿B)。如下图白框中的画面

2）解决办法

导致问题的原因既然是因为2个深度值相差太小了，那我们就想办法把2个值偏差的大点 --> 深度测试前，将两个深度值手动做下细微的修改使之可以区分 --> 手动复杂又不精确 --> OpenGL提供了办法：多边形偏移 -- 使产生 ZFlighting 的图层产生一个的偏移，即深度值间产生一个间隔。

a、启用多边形偏移：

　　glEnable(GL_POLYGON_OFFSET_FILL)

　　　　GL_POLYGON_OFFSET_FILL：对应光栅化的 GL_FILL

　　　　GL_POLYGON_OFFSET_LINE：对应光栅化的 GL_LINE

　　　　GL_POLYGON_OFFSET_POINT：对应光栅化的 GL_POINT

b、指定偏移量：

　　glPolygonOffset(Glfloat factor,Glfloat units)

　　　　深度：Depth offset = DZ * factor + r * units // 负值，使得模型距离观察者更*；正值，将使得模型距离观察者更远

　　　　DZ：多边形的深度斜率最大值

　　　　r：使深度缓冲区产生变化的最小值，即可分辨的最小差异值

　　这里我们只需传 factor 和 units 两个值给 glPolygonOffset 即可：一般传入-1, -1

c、关闭　

　　glDisable(GL_POLYGON_OFFSET_FILL)　　　　　　

3）预防

　　a、不要将2个物体放太*，避免渲染时重叠。这种方式要求对场景中物体插入一个少量的偏移，自然这个操作是要付出一定代价的。

　　b、将裁剪面设计的距离观察者远些，上⾯我们看到，在*裁剪*⾯附*，深度的精确度是很高的，因此尽可能让*裁剪⾯远一些的话，会使整个裁剪范围内的精确度变高一些。但是这种⽅式会使离观察者较*的物体被裁减掉，因此需要调试好裁剪⾯参数。

　　c、使用高位数的深度缓存区。通常使用的深度缓存区是24位的，现在有一些使用32位的缓冲区的硬件设备，使精度提高。

三、主要代码

压栈：记录临时状态保存一下下 - 状态的回滚

出栈：恢复初始状态 -- 不需要了记录的数据就可以扔掉，避免对后面的渲染产生异常影响 ---> 有点类似 Git 的 stash 命令

  1 GLBatch triangleBatch;
  2 
  3 GLShaderManager shaderManager;
  4 
  5 // 设置角色帧，作为相机
  6 GLFrame  viewFrame;// 观察者位置
  7 GLFrustum           viewFrustum;// 透视投影 - GLFrustum类
  8 GLTriangleBatch     torusBatch;
  9 // 两个矩阵
 10 GLMatrixStack       modelViewMatix;// 模型矩阵
 11 GLMatrixStack       projectionMatrix;// 透视矩阵
 12 //
 13 GLGeometryTransform transformPipeline;// 几何转换
 14 
 15 
 16 // 定义字段判断 正背面剔除/深度测试 开启与否
 17 int iCull = 0;
 18 int iDepth = 0;
 19 
 20 
 21 // 右键菜单栏选项 开启关闭深度测试
 22 void ProcessMenu(int value) {
 23     
 24     switch(value)
 25     {
 26         case 1:
 27             iCull = !iCull;
 28             break;
 29 
 30         case 2:
 31             iDepth = !iDepth;
 32             break;
 45     }
 46 
 47     glutPostRedisplay();
 48 }
 49 
 50 // 键盘上下左右 事件
 51 // 观察者移动 物体不动
 52 void SpecialKeys(int key, int x, int  y) {
 53     
 54     if(key == GLUT_KEY_UP)
 55         viewFrame.RotateWorld(m3dDegToRad(-5.0), 1.0f, 0.0f, 0.0f);
 56     
 57     if(key == GLUT_KEY_DOWN)
 58         viewFrame.RotateWorld(m3dDegToRad(5.0), 1.0f, 0.0f, 0.0f);
 59     
 60     if(key == GLUT_KEY_LEFT)
 61         viewFrame.RotateWorld(m3dDegToRad(-5.0), 0.0f, 1.0f, 0.0f);
 62     
 63     if(key == GLUT_KEY_RIGHT)
 64         viewFrame.RotateWorld(m3dDegToRad(5.0), 0.0f, 1.0f, 0.0f);
 65     
 66     //重新刷新window
 67     glutPostRedisplay();
 68 }
 69 
 70 // 初始化 设置
 71 void SetupRC() {
 72     
 73     // ================ 简单绘制一个立体的圈圈 =================
 74     // 设置背景颜色
 75      glClearColor(0.0f, 0.3f, 0.3f, 1.0f );
 76      
 77      //初始化着色器管理器
 78      shaderManager.InitializeStockShaders();
 79      
 80      //将相机向后移动7个单元：肉眼到物体之间的距离
 81      viewFrame.MoveForward(7.0);
 82      
 83      //创建一个圈
 84      //void gltMakeTorus(GLTriangleBatch& torusBatch, GLfloat majorRadius, GLfloat minorRadius, GLint numMajor, GLint numMinor);
 85      //参数1：GLTriangleBatch 容器帮助类
 86      //参数2：外边缘半径
 87      //参数3：内边缘半径
 88      //参数4、5：主半径和从半径的细分单元数量
 89      gltMakeTorus(torusBatch, 1.0f, 0.3f, 52, 26);
 90     //点的大小
 91      glPointSize(4.0f);
117 }
118 
119 
120 // 视口  窗口大小改变时接受新的宽度和高度，其中0,0代表窗口中视口的左下角坐标，w，h代表像素
121 void ChangeSize(int w,int h) {
122     // 防止h变为0
123     if(h == 0)
124         h = 1;
125     
126     // 设置视口窗口尺寸
127     glViewport(0, 0, w, h);
128     
129     // setPerspective 函数的参数是一个从顶点方向看去的视场角度（用角度值表示）
130     // 设置透视模式，初始化其透视矩阵
131     viewFrustum.SetPerspective(35.0f, float(w)/float(h), 1.0f, 100.0f);
132     
133     //4.把 透视矩阵 加载到 透视矩阵对阵中
134     projectionMatrix.LoadMatrix(viewFrustum.GetProjectionMatrix());
135     
136     //5.初始化渲染管线
137     transformPipeline.SetMatrixStacks(modelViewMatix, projectionMatrix);
138 }
139 
140 // 渲染
141 void RenderScene(void) {
142     
143     //清除窗口和深度缓冲区
144     //
145     glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
146     
147     
148     // iCull 判断是否开启背面剔除 GL_CULL_FACE
149     if(iCull)
150     {
151         glEnable(GL_CULL_FACE);
152         glFrontFace(GL_CCW);
153         glCullFace(GL_BACK);
154     }
155     else
156         glDisable(GL_CULL_FACE);
157     
158     // iDepth 判断是否开启深度测试 GL_DEPTH_TEST
159     if(iDepth)
160         glEnable(GL_DEPTH_TEST);
161     else
162         glDisable(GL_DEPTH_TEST);
163     
164     //把摄像机矩阵压入模型矩阵中 入栈
165     modelViewMatix.PushMatrix(viewFrame);
166     
167     GLfloat vRed[] = { 0.0f, 0.5f, 0.5f, 1.0f };// 画笔颜色
168     
169     //使用默认光源着色器
170     //通过光源、阴影效果跟提现立体效果
171     //参数1：GLT_SHADER_DEFAULT_LIGHT 默认光源着色器
172     //参数2：模型视图矩阵
173     //参数3：投影矩阵
174     //参数4：基本颜色值
175     shaderManager.UseStockShader(GLT_SHADER_DEFAULT_LIGHT, transformPipeline.GetModelViewMatrix(), transformPipeline.GetProjectionMatrix(), vRed);
176     
177     //绘制
178     torusBatch.Draw();
179 
180     //出栈
181     modelViewMatix.PopMatrix();
182     glutSwapBuffers();
205 }
206 
207 int main(int argc,char* argv[]) {
208     
209     //设置当前工作目录，针对MAC OS X
210     
211     gltSetWorkingDirectory(argv[0]);
212     
213     //初始化GLUT库
214     
215     glutInit(&argc, argv);
216     /* 初始化双缓冲窗口，其中标志GLUT_DOUBLE、GLUT_RGBA、GLUT_DEPTH、GLUT_STENCIL分别指
217         双缓冲窗口、RGBA颜色模式、深度测试、模板缓冲区
218      */
219     glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL);
220     
221     //GLUT窗口大小，标题窗口
222     glutInitWindowSize(800,600);
223     glutCreateWindow("Triangle");
224     
225     //注册回调函数
226     glutReshapeFunc(ChangeSize);
227     glutDisplayFunc(RenderScene);
228     glutSpecialFunc(SpecialKeys);// 注册键盘特殊键位(上下左右键) 处理点击事件
229     
230     // Create the Menu
231     glutCreateMenu(ProcessMenu);// 右键菜单栏选项 开启关闭深度测试
232     glutAddMenuEntry("Toggle cull backface",1);// 正背面剔除
233     glutAddMenuEntry("Toggle depth test",2);// 深度测试的开启与否
234 
235     glutAttachMenu(GLUT_RIGHT_BUTTON);
236     
239     //驱动程序的初始化中没有出现任何问题。
240     GLenum err = glewInit();
241     if(GLEW_OK != err) {
242         
243         fprintf(stderr,"glew error:%s
",glewGetErrorString(err));
244         return 1;
245     }
246     
247     //调用SetupRC
248     SetupRC();
249     
250     glutMainLoop();
251     
252     return 0;
253 }

Demo