OpenGL 优化项之面剔除和注意点

现在我们用 OpenGL 绘制了如下的立方体：

不管我们怎么旋转立方体，从任何一个方向去看它，最多都只能看到三个面。

那么对于 OpenGL 来说，那看不到的另外三个面完全可以不用绘制它，从而提高绘制的性能。

面剔除

既然现在要把看不到的面丢弃，那么问题就来了：

如何去确定哪个面看得到，哪个面看不到呢？

在 OpenGL 中允许检查所有正面朝向观察者的面，并渲染它们，而丢弃所有背向观察者的面，这就可以节省片段着色器的运行。

所以，我们要做的就是告诉 OpenGL 哪个面是正面，哪个面是背面。

通过顶点连接顺序确定正反面

当我们通过三角形来绘制形状时，会定义顶点连接的顺序，它可能是顺时针或逆时针。

上图中，左侧三角形就是顺时针方向，右侧就是逆时针方向。

而 OpenGL 就是利用这个三角形的顺时针或逆时针方向来决定三角形是正面还是反面。

默认情况下，逆时针的顶点连接顺序被定义为三角形的正面

逆时针或顺时针都是相对于观察者方向的

当定义顶点顺序时，应该想象对应的三角形是面向你的，所以定义的三角形顶点方向应该逆时针的。

这样定义的好处在于三角形顶点的实际连接顺序是在光栅化阶段进行的，也就是顶点着色器运行之后，这些顶点就是以观察者视角所见的了。

对于上图，左侧三角形 1 -> 2 ->3 的连接顺序是顺时针的，这是在观察者位于屏幕前看到的，如果观察者位于屏幕后，连接顺序依旧是 1 -> 2 -> 3 ，那么就是逆时针了。

这也是为什么说，定义三角形顶点顺序时要假设三角形是面向你的，保证逆时针定义，并且可以根据观察者方向的改变，顺时针和逆时针方向会发生改变。

如下图：

三角形的顶点顺序都 1 -> 2 -> 3，当我们定义这个顺序时，都是假设观察者正面向这个三角形呢，所以都是逆时针定义的。

但是从右侧眼镜处来观察，右侧三角形方向是逆时针的，左侧三角形方向是顺时针的，这就是因为对于右侧三角形来说，观察者方向和当初定义顺序时的假设方向一致，而对于左侧三角形，观察者方向就和定义顺序时的假设方向相反了，所以从反方向来看就成了顺时针了。

这样一来，在面剔除的优化下，右侧面可见，左侧面不可见了，也就是面向观察者的正面可见，反面不可见了。

看了好多文章，都没有讲：为什么要逆时针定义三角形方向，但是观察时却成了顺时针了，就是因为当初定义的逆时针方向其实是和观察者方向挂钩的。

当上图的观察者方向变成了左侧，那么顶点连接顺序都还是 1 -> 2 -> 3 的情况下，左侧三角形的顺序就和当初定义顶点顺序一样成了逆时针可见，而右侧的三角形顶点顺序就成了顺时针不可见。

明白了这一点，就对于面剔除更加清晰了。

具体使用

在 OpenGL 中可以通过如下方法开启面剔除：

glEnable(GLES20.GL_CULL_FACE)
复制代码

默认情况下，面剔除是关闭的。

开启面剔除后，所有的背向观察者的面都会被丢弃，节省渲染性能。

另外，OpenGL 还提供了其他功能来选择要剔除的面。

    public static native void glCullFace( int mode );
复制代码

有三个模式可选：

• GL_BACK：只剔除背向面
• GL_FRONT：只剔除正向面
• GL_FRONT_AND_BACK：剔除正向面和背向面

glCullFace 的初始值是 GL_BACK，只剔除背向面。

除了需要剔除的面之外，还可以通过调用 glFrontFace 方法告诉 OpenGL 将顺时针的面（而不是逆时针的面）定义为正向面。

    public static native void glFrontFace( int mode );
复制代码

它有两个选项：

• GL_CCW：代表逆时针方向为正向面
• GL_CW：代表顺时针方向为正向面

glFrontFace 模式值是 GL_CCW，逆时针方向为正向面。

现假设开启面剔除，并且剔除正向，顺时针为正向：

    glEnable(GL_CULL_FACE);
    glCullFace(GL_FRONT);
    glFrontFace(GL_CW);
复制代码

关于具体的代码实现，可以参考我的 Github 项目：

github.com/glumes/Andr…

小结

使用面剔除可以优化渲染过程，省下超过 50 % 的片段着色器执行数。

使用面剔除时定义顶点要以逆时针方向定义。

逆时针或顺时针都是相对于观察者方向的。

一起讨论

欢迎一起讨论 OpenGL 相关知识：

要是二维码过期了，加微信 ezglumes 好友，备注 OpenGL ，拉你入群~

参考

1. https://learnopengl-cn.github.io/04%20Advanced%20OpenGL/04%20Face%20culling/

欢迎关注微信公众号：【纸上浅谈】，获得最新文章推送~~~