1、概述
前面几篇关于OpenGLES的文章：
前面讨论了利用矩阵的变换来对所有顶点进行变换。OpenGL ES希望在每次顶点着色器运行后，可见的所有顶点都为标准化设备坐标(Normalized Device Coordinate, NDC)。也就是说，每个顶点的x，y，z坐标都应该在-1.0到1.0之间，超出这个坐标范围的顶点都将不可见。开发时候通可以自己设定一个坐标的范围，之后再在顶点着色器中将这些坐标变换为标准化设备坐标。然后将这些标准化设备坐标传入光栅器，将它们变换为屏幕上的二维坐标或像素。
将坐标变换为标准化设备坐标，接着再转化为屏幕坐标的过程通常是分步进行的。物体的顶点在最终转化为屏幕坐标之前还会被变换到多个坐标系。将物体的坐标变换到几个过渡坐标系的好处在于，在这些特定的坐标系统中，一些操作或运算更加方便和容易。一般来说比较重要的总共有5个不同的坐标系统：
局部空间(Local Space，或者称为物体空间(Object Space))
世界空间(World Space)
观察空间(View Space，或者称为视觉空间(Eye Space))
裁剪空间(Clip Space)
屏幕空间(Screen Space)
这就是一个顶点在最终被转化为片段之前需要经历的所有不同状态。
2、坐标系总览
为了将坐标从一个坐标系变换到另一个坐标系，需要用到几个变换矩阵，最重要的几个分别是模型(Model)、观察(View)、投影(Projection)三个矩阵。顶点坐标起始于局部空间(Local Space)，在这里它称为局部坐标(Local Coordinate)，它在之后会变为世界坐标(World Coordinate)，观察坐标(View Coordinate)，裁剪坐标(Clip Coordinate)，并最后以屏幕坐标(Screen Coordinate)的形式结束。下面的这张图展示了整个流程以及各个变换过程做了什么：
① 局部坐标系：对象相对于局部原点的坐标，也是物体起始的坐标。
② 世界坐标系：世界空间坐标是处于一个更大的空间范围的。这些坐标相对于世界的全局原点，它们会和其它物体一起相对于世界的原点进行摆放。
③ 观察坐标系：观察坐标下每个坐标都是从摄像机或者说观察者的角度进行观察的。
④ 剪裁坐标系：坐标到达观察空间之后，需要将其投影到裁剪坐标。裁剪坐标会被处理至-1.0到1.0的范围内，并判断哪些顶点将会出现在屏幕上。
⑤ 屏幕坐标系：使用一个叫做视口变换(Viewport Transform)的过程，将剪裁坐标变成屏幕坐标。视口变换将位于-1.0到1.0范围的坐标变换到由glViewport()所定义的坐标范围内。最后变换出来的坐标将会送到光栅器，将其转化为片段。
上面就是每个坐标系大致的作用，之所以将顶点变换到各个不同的空间的原因是有些操作在特定的坐标系统中才有意义且更方便。例如，当需要对物体进行修改的时候，在局部空间中来操作会更合理；如果要对一个物体做出一个相对于其它物体位置的操作时，在世界坐标系中来做这个才更合理，等等。其实也可以定义一个直接从局部空间直接变换到裁剪空间的变换矩阵，但那样会失去很多灵活性。
3、各坐标系空间详述
3.1 局部坐标系空间
局部坐标系空间是指物体所在的坐标系空间，即对象最开始所在的地方。例如在一个建模软件中创建了一个立方体。创建的立方体的原点有可能位于(0, 0, 0)，即便它有可能最后在程序中处于完全不同的位置。甚至有可能创建的所有模型都以(0, 0, 0)为初始位置，然而它们会最终出现在世界的不同位置。所以，模型的所有顶点都是在局部系空间中，它们相对于物体来说都是局部的。
3.2 世界坐标系空间
如果将所有的物体导入到程序当中，它们有可能会全挤在世界的原点(0, 0, 0)上，这并不是想要的结果。理想状态下是为每一个物体定义一个位置，从而能在更大的世界当中放置它们。世界空间中的坐标系正如其名：是指顶点相对于世界的坐标。物体的坐标将会从局部变换到世界空间；该变换一般是由模型矩阵(Model Matrix)实现。模型矩阵是一种变换矩阵，它能通过对物体进行位移、缩放、旋转来将它置于它本应该在的位置或朝向。
3.3 观察坐标系空间
观察坐标系空间经常被称之OpenGL ES的摄像机视角，所以有时也称为摄像机坐标系空间(Camera Space)或视觉坐标系空间(Eye Space)。观察坐标系空间是将世界空间坐标转化为用户视野前方的坐标而产生的结果。因此观察坐标系空间就是从摄像机的视角所观察到的空间。而这通常是由一系列的位移和旋转的组合来完成，平移/旋转场景从而使得特定的对象被变换到摄像机的前方。这些组合在一起的变换通常存储在一个观察矩阵(View Matrix)里，它被用来将世界坐标变换到观察空间。更详细的情况之后会用专门的一篇文章来进行讨论。
3.4 剪裁坐标系空间
在一个顶点着色器运行的最后，OpenGL ES期望所有的坐标都能落在一个特定的范围内，且任何在这个范围之外的点都应该被裁剪掉。被裁剪掉的坐标就会被忽略，所以剩下的坐标就将变为屏幕上可见的片段。这也就是裁剪坐标系空间名字的由来。
因为将所有可见的坐标都指定在-1.0到1.0的范围内不是很直观，所以会指定自己的坐标集并将它变换回标准化设备坐标系，就像OpenGL ES期望的那样。为了将顶点坐标从观察坐标系空间变换到裁剪坐标系空间，需要定义一个投影矩阵(Projection Matrix)，它指定了一个范围的坐标，比如在每个维度上的-1000到1000。投影矩阵接着会将在这个指定的范围内的坐标变换为标准化设备坐标的范围(-1.0, 1.0)。所有在范围外的坐标不会被映射到在-1.0到1.0的范围之间，所以会被裁剪掉。在上面这个投影矩阵所指定的范围内，坐标(1250, 500, 750)将是不可见的，这是由于它的x坐标超出了范围，它被转化为一个大于1.0的标准化设备坐标，所以被裁剪掉了。
如果只是图元(Primitive)，例如三角形，的一部分超出了裁剪体积，则OpenGL ES会重新构建这个三角形为一个或多个三角形让其能够适合这个裁剪范围。
由投影矩阵创建的观察箱(Viewing Box)被称为平截头体，每个出现在平截头体范围内的坐标都会最终出现在用户的屏幕上。将特定范围内的坐标转化到标准化设备坐标系的过程（而且它很容易被映射到2D观察空间坐标）被称之为投影，因为使用投影矩阵能将3D坐标投影到很容易映射到2D的标准化设备坐标系中。
一旦所有顶点被变换到裁剪空间，最终的操作——透视除法将会执行，在这个过程中将位置向量的x，y，z分量分别除以向量的齐次w分量；透视除法是将4D裁剪空间坐标变换为3D标准化设备坐标的过程。这一步会在每一个顶点着色器运行的最后被自动执行。在这一阶段之后，最终的坐标将会被映射到屏幕空间中（使用glViewport中的设定），并被变换成片段。
将观察坐标变换为裁剪坐标的投影矩阵可以为两种不同的形式，每种形式都定义了不同的平截头体。可以选择创建一个正射投影矩阵(Orthographic Projection Matrix)或一个透视投影矩阵(Perspective Projection Matrix)。
3.4.1 正射投影
正射投影矩阵定义了一个类似立方体的平截头箱，它定义了一个裁剪空间，在这空间之外的顶点都会被裁剪掉。创建一个正射投影矩阵需要指定可见平截头体的宽、高和长度。在使用正射投影矩阵变换至裁剪空间之后处于这个平截头体内的所有坐标将不会被裁剪掉。它的平截头体看起来像一个容器：
上面的平截头体定义了可见的坐标，它由由宽、高、近(Near)平面和远(Far)平面所指定。任何出现在近平面之前或远平面之后的坐标都会被裁剪掉。正射平截头体直接将平截头体内部的所有坐标映射为标准化设备坐标，因为每个向量的w分量都没有进行改变；如果w分量等于1.0，透视除法则不会改变这个坐标。
要创建一个正射投影矩阵，可以使用android.opengl.Matrix 下面的内置函数orthoM()：
public static void orthoM(float[] m, int mOffset,
float left, float right, float bottom, float top,
float near, float far)
上面第一个参数是需要变换的矩阵存储数组，第二个参数从第一个参数数组中的偏移位置，第三、四、五、六分别对应平截头的左右下上边界，第七、八个参数对应近平面和远平面距离。这个投影矩阵会将处于这些x，y，z值范围内的坐标变换为标准化设备坐标。
其映射原理如下图：
如上图所示剪裁空间中的 所有x，y和z分量线性映射到NDC。只需要将矩形体积缩放到立方体，然后将观察坐标系的原点移动到标准化设备坐标原点。最终呈现出来的图像就是标准化过后的效果。
正射投影矩阵直接将坐标映射到2D平面中，即屏幕上，但实际上一个直接的投影矩阵会产生不真实的结果，因为这个投影没有将透视(Perspective)考虑进去。所以需要透视投影矩阵来解决这个问题。
3.4.2 透视投影
对于肉眼直观的感受是，近大远小的，这种视觉效果称之为透视。透视投影要模仿肉眼的这种效果，是使用透视投影矩阵来完成的。这个透视投影矩阵将给定的平截头体范围映射到裁剪空间，除此之外还修改了每个顶点坐标的w值，从而使得离观察者越远的顶点坐标w分量越大。被变换到裁剪空间的坐标都会在-w到w的范围之间（任何大于这个范围的坐标都会被裁剪掉）。OpenGL ES要求所有可见的坐标都落在-1.0到1.0范围内，作为顶点着色器最后的输出，因此，一旦坐标在裁剪空间内之后，透视除法就会被应用到裁剪空间坐标上：
顶点坐标的每个分量都会除以它的w分量，距离观察者越远顶点坐标就会越小。这是也是w分量非常重要的另一个原因，它能够帮助开发者进行透视投影。最后的结果坐标就是处于标准化设备空间中的。
在android.opengl.Matrix 可以这样创建一个透视投影矩阵：
public static void perspectiveM(float[] m, int offset,
float fovy, float aspect, float zNear, float zFar)
perspectiveM() 所做的其实就是创建了一个定义了可视空间的大平截头体，任何在这个平截头体以外的东西最后都不会出现在裁剪空间体积内，并且将会受到裁剪。一个透视平截头体可以被看作一个不均匀形状的箱子，在这个箱子内部的每个坐标都会被映射到裁剪空间上的一个点。下面是一张透视平截头体的图片：
上面的函数第一个参数是需要变换的矩阵存储数组，第二个参数从第一个参数数组中的偏移位置，第三个参数表示的是视角。如果想要一个真实的观察效果，它的值通常设置为45.0f。第四个参数设置了宽高比，由视口的宽除以高所得。第三和第四个参数设置了平截头体的近和远平面。通常设置近距离为0.1f，而远距离设为100.0f。所有在近平面和远平面内且处于平截头体内的顶点都会被渲染。当把透视矩阵的 near 值设置太大时（如10.0f），OpenGL ES会将靠近摄像机的坐标（在0.0f和10.0f之间）都裁剪掉，这会导致游戏中常见那种太靠近物体时候视线直接穿过物体的情况。
透视投影映射到标准化设备坐标的原理如下图：
在透视投影中，截断的金字塔平截头体（观察坐标）中的3D点被映射到立方体（NDC）。从[l，r]到[-1,1]的x坐标范围，从[b，t]到[-1,1]的y坐标范围和[-n，-f]到到[-1,1]的z的坐标范围。这边需要注意的是在OpenGL ES观察坐标是在右手坐标系中定义的，但NDC使用左手坐标系。也就是说，原点处的相机沿着观察空间中的-Z轴看，但它在NDC中沿着+ Z轴看。
3.5 坐标系组合
上述的每一个步骤都创建了一个变换矩阵：模型矩阵、观察矩阵和投影矩阵。一个顶点坐标将会根据以下过程被变换到裁剪坐标：
注意矩阵运算的顺序是相反的即需要从右往左阅读矩阵的乘法。最后的顶点应该被赋值到顶点着色器中的gl_Position，OpenGLES将会自动进行透视除法和裁剪。顶点着色器的输出要求所有的顶点都在裁剪空间内，这正是刚才使用变换矩阵所做的。OpenGL ES然后对裁剪坐标执行透视除法从而将它们变换到标准化设备坐标。OpenGL ES会使用glViewPort内部的参数来将标准化设备坐标映射到屏幕坐标，每个坐标都关联了一个屏幕上的点。
4、OpenGL ES中的操作
有来前面的坐标系的铺垫，可以正式用OpenGL ES创建三维物体了，而不是前面的两维物体。
4.1 二维平面倾斜
首先创建一个模型矩阵。这个模型矩阵包含了位移、缩放与旋转操作，它们会被应用到所有物体的顶点上，以变换它们到全局的世界空间。变换一下前面几篇文章所展示的平面，将其绕着x轴旋转，使它看起来像放在地上一样。这里为了和下面两节内容所一致，将模型的生成操作放在draw()中这个模型矩阵看起来是这样的：
//Triangle.kt
private val mModelMatrix = FloatArray(16)
fun draw(){
...
Matrix.setIdentityM(mModelMatrix, 0)
Matrix.rotateM(mModelMatrix, 0, -55f, 1.0f, 0.0f, 0f)
...
}
通过将顶点坐标乘以这个模型矩阵，将该顶点坐标变换到世界坐标。原理的平面看起来就是在地板上，代表全局世界里的平面。
接下来需要创建一个观察矩阵。想要在场景里面稍微往后移动，以使得物体变成可见的，当在世界空间时，默认观察点也就是相机所处位置位于原点(0,0,0)。所以将摄像机向后移动，和将整个场景向前移动是一样的。
这正是观察矩阵所做的，以相反于摄像机移动的方向移动整个场景。因为想要往后移动，并且OpenGL ES是一个右手坐标系，所以需要沿着z轴的正方向移动。则要通过将场景沿着z轴负方向平移来实现。它会给我们一种在往后移动的感觉。所以这边观察矩阵如下所示：
//Triangle.kt
private val mViewMatrix = FloatArray(16)
fun draw(){
...
Matrix.setIdentityM(mViewMatrix,0)
Matrix.translateM(mViewMatrix,0,0f,0.0f, -2.5f)
...
}
最后需要做的是定义一个投影矩阵。在场景中使用透视投影，所以像这样声明一个投影矩阵：
//Triangle.kt
private val mProjectionMatrix = FloatArray(16)
fun draw(){
...
val displayMetrics = mContext.resources.displayMetrics
Matrix.setIdentityM(mProjectionMatrix, 0)
Matrix.perspectiveM(mProjectionMatrix, 0,45f, displayMetrics.widthPixels * 1.0f / displayMetrics.heightPixels,0.1f,100f)
...
}
现在已经创建了变换矩阵，应该将它们传入着色器。首先，在顶点着色器中声明三个uniform变换矩阵然后将它乘以顶点坐标：
//Triangle.kt
private val vertexShaderCode =
"#version 300 es \n" +
...
"uniform mat4 model;" +
"uniform mat4 view;" +
"uniform mat4 projection;" +
"void main() {" +
" gl_Position = projection * view * model * vec4(aPos, 1.0);" +
...
"}"
还应该将矩阵传入着色器这通常在每次的渲染迭代中进行，因为变换矩阵会经常变动：
//Triangle.kt
fun draw(){
...
Matrix.setIdentityM(mModelMatrix, 0)
Matrix.rotateM(mModelMatrix, 0, -55f, 1.0f, 0.0f, 0f)
Matrix.setIdentityM(mViewMatrix, 0)
Matrix.translateM(mViewMatrix, 0, 0f, 0.0f, -2.5f)
val displayMetrics = mContext.resources.displayMetrics
Matrix.setIdentityM(mProjectionMatrix, 0)
Matrix.perspectiveM(mProjectionMatrix,0,45f, displayMetrics.widthPixels * 1.0f / displayMetrics.heightPixels,0.1f,100f)
val modelLoc = GLES30.glGetUniformLocation(mProgram, "model")
GLES30.glUniformMatrix4fv(modelLoc, 1, false, mModelMatrix, 0)
val viewLoc = GLES30.glGetUniformLocation(mProgram, "view")
GLES30.glUniformMatrix4fv(viewLoc, 1, false, mViewMatrix, 0)
val projectionLoc = GLES30.glGetUniformLocation(mProgram, "projection")
GLES30.glUniformMatrix4fv(projectionLoc, 1, false, mProjectionMatrix, 0)
...
}
这样操作过后顶点坐标已经使用了模型、观察和投影矩阵进行变换，最终效果如下图：
4.2 三维效果
目前为止，尽管已经甚至是在3D空间里，但还是对2D平面进行操作。这一章节将讨论实现3D效果，来渲染一个立方体，首先一共需要36个顶点（6个面 x 每个面有2个三角形组成 x 每个三角形有3个顶点），这36个顶点的位置如下：
var vertices3D = floatArrayOf(
// --- 位置 --- --- 纹理坐标 ---
-0.5f, -0.5f, -0.5f, 0f, 0f,
0.5f, -0.5f, -0.5f, 1f, 0f,
0.5f, 0.5f, -0.5f, 1f, 1f,
0.5f, 0.5f, -0.5f, 1f, 1f,
-0.5f, 0.5f, -0.5f, 0f, 1f,
-0.5f, -0.5f, -0.5f, 0f, 0f,
-0.5f, -0.5f, 0.5f, 0f, 1f,
0.5f, -0.5f, 0.5f, 1f, 1f,
0.5f, 0.5f, 0.5f, 1f, 0f,
0.5f, 0.5f, 0.5f, 1f, 0f,
-0.5f, 0.5f, 0.5f, 0f, 0f,
-0.5f, -0.5f, 0.5f, 0f, 1f,
-0.5f, 0.5f, 0.5f, 1f, 00f,
-0.5f, 0.5f, -0.5f, 1f, 1f,
-0.5f, -0.5f, -0.5f, 0f, 1f,
-0.5f, -0.5f, -0.5f, 0f, 1f,
-0.5f, -0.5f, 0.5f, 0f, 0f,
-0.5f, 0.5f, 0.5f, 1f, 0f,
0.5f, 0.5f, 0.5f, 1.0f, 0.0f,
0.5f, 0.5f, -0.5f, 1.0f, 1.0f,
0.5f, -0.5f, -0.5f, 0.0f, 1.0f,
0.5f, -0.5f, -0.5f, 0.0f, 1.0f,
0.5f, -0.5f, 0.5f, 0.0f, 0.0f,
0.5f, 0.5f, 0.5f, 1.0f, 0.0f,
-0.5f, -0.5f, -0.5f, 0.0f, 1.0f,
0.5f, -0.5f, -0.5f, 1.0f, 1.0f,
0.5f, -0.5f, 0.5f, 1.0f, 0.0f,
0.5f, -0.5f, 0.5f, 1.0f, 0.0f,
-0.5f, -0.5f, 0.5f, 0.0f, 0.0f,
-0.5f, -0.5f, -0.5f, 0.0f, 1.0f,
-0.5f, 0.5f, -0.5f, 0.0f, 1.0f,
0.5f, 0.5f, -0.5f, 1.0f, 1.0f,
0.5f, 0.5f, 0.5f, 1.0f, 0.0f,
0.5f, 0.5f, 0.5f, 1.0f, 0.0f,
-0.5f, 0.5f, 0.5f, 0.0f, 0.0f,
-0.5f, 0.5f, -0.5f, 0.0f, 1.0f)
这里做一个立方体随时间旋转的效果,同时绘制的顶点要改成36个：
fun draw(){
...
Matrix.setIdentityM(mModelMatrix,0)
mAngle =5.0f * ((System.currentTimeMillis() /200) %60)
Matrix.rotateM(mModelMatrix,0,mAngle,0.5f,1.0f,0f)
...
GLES30.glDrawArrays(GLES30.GL_TRIANGLES,0,36)
...
}
此时会得到如下效果：
上面出现的效果的确有些像立方体，不过明显感觉有问题。立方体的某些本应被遮挡住的面被绘制在了这个立方体其他面之上。之所以这样是因为OpenGL ES是一个三角形一个三角形地来绘制立方体的，所以即便之前那里有东西它也会覆盖之前的像素。因为这个原因，有些三角形会被绘制在其它三角形上面，虽然它们本不应该是被覆盖的。OpenGL ES存储深度信息在一个叫做Z缓冲(Z-buffer)的缓冲中，它允许OpenGL ES决定何时覆盖一个像素而何时不覆盖。通过使用Z缓冲，可以配置OpenGL来进行深度测试。
OpenGL ES存储它的所有深度信息于一个Z缓冲中，也被称为深度缓冲。OpenGL ES的窗口管理系统会自动生成这样一个缓冲（就像它也有一个颜色缓冲来存储输出图像的颜色）。深度值存储在每个片段里面，作为片段的z值，当片段想要输出它的颜色时，OpenGL ES会将它的深度值和z缓冲进行比较，如果当前的片段在其它片段之后，它将会被丢弃，否则将会覆盖。这个过程称为深度测试，它是由OpenGL ES自动完成的。
如果想要确定OpenGL ES真的执行了深度测试，首先要告诉OpenGL ES想要启用深度测试；它默认是关闭的。可以通过GLES30.glEnable()函数来开启深度测试。GLES30.glEnable()和GLES30glDisable()允许开发者启用或禁用某个OpenGL ES功能。这个功能会一直保持启用/禁用状态，直到另一个调用来禁用/启用它。现在启用深度测试，需要开启GLES30.GL_DEPTH_TEST
//Triangle.kt
init {
...
GLES30.glEnable(GLES30.GL_DEPTH_TEST)
...
}
因为使用了深度测试，同时也想要在每次渲染迭代之前清除深度缓冲，否则前一帧的深度信息仍然保存在缓冲中。就像清除颜色缓冲一样，可以通过在glClear()中指定DEPTH_BUFFER_BIT位来清除深度缓冲，同时别忘记前面文章提到的自动动态刷新要注释掉GLSurfaceView 的 RENDERMODE_WHEN_DIRTY：
//Triangle.kt
fun draw() {
...
GLES30.glClear(GLES30.GL_COLOR_BUFFER_BIT or GLES30.GL_DEPTH_BUFFER_BIT)
...
}
// MyGLSurfaceView.kt
init {
...
// renderMode = GLSurfaceView.RENDERMODE_WHEN_DIRTY
...
}
其效果如下：
4.3 渲染多个三维图像
现在想在屏幕上显示4个立方体。每个立方体看起来都是一样的，区别在于它们在世界的位置及旋转角度不同。立方体的图形布局已经定义好了，所以当渲染更多物体的时候不需要改变缓冲数组和属性数组，唯一需要做的只是改变每个对象的模型矩阵来将立方体变换到世界坐标系中。
首先，让为每个立方体定义一个位移向量来指定它在世界空间的位置。
//Triangle.kt
var cubePosition =floatArrayOf(
0.0f,0.0f,0.0f,
0.9f,1.3f,0.4f,
-0.5f, -1.2f, -1.5f,
-1.8f, -1.0f, -2.3f)
现在，在循环中，调用glDrawArrays() 4次，但这次在渲染之前每次传入一个不同的模型矩阵到顶点着色器中。将会在游戏循环中创建一个小的循环用不同的模型矩阵渲染的物体4次。注意也对每个箱子加了一点旋转：
//Triangle.kt
fun draw() {
...
for (i in 0..3) {
...
Matrix.setIdentityM(mModelMatrix, 0)
mAngle = 5.0f * ((System.currentTimeMillis() / 200) % 60)
Matrix.rotateM(mModelMatrix, 0, mAngle,
cubePosition[i * 3] + 0.5f,
cubePosition[i * 3 + 1] + 1.0f,
cubePosition[i * 3 + 2])
Matrix.setIdentityM(mViewMatrix, 0)
Matrix.translateM(mViewMatrix, 0,
cubePosition[i * 3],
cubePosition[i * 3 + 1],
cubePosition[i * 3 + 2] - 4f)
val displayMetrics = mContext.resources.displayMetrics
Matrix.setIdentityM(mProjectionMatrix, 0)
Matrix.perspectiveM(mProjectionMatrix,
0,
45f,
displayMetrics.widthPixels * 1.0f / displayMetrics.heightPixels,
0.1f,
100f)
...
GLES30.glDrawArrays(GLES30.GL_TRIANGLES, 0, 36)
}
...
}
其最终效果如下：
