獲取示例代碼
上一篇介紹了變換矩陣罩句,本篇將介紹兩個重要的變換矩陣,透視投影矩陣和正交投影矩陣紊服。在介紹代碼之前伦泥,先來簡單介紹一下這兩個矩陣的作用。
透視投影矩陣
主要作用是模仿人眼觀察3D世界的規(guī)律芝雪,讓物體近大遠小减余,所以被稱為透視。
正交投影矩陣
主要作用是將坐標系映射到其他大小惩系,主要用于2D UI繪制位岔。
接下來我們就結(jié)合代碼和效果深入了解這兩個矩陣。我沿用了上一篇的代碼堡牡,只修改了兩處抒抬。update
中使用透視和正交投影,并配合一些平移晤柄,旋轉(zhuǎn)擦剑,縮放實現(xiàn)了本例中的效果。drawTriangle
中修改了頂點數(shù)據(jù),將繪制的菱形改成了矩形惠勒,方便觀察效果赚抡。
- (void)update {
[super update];
float varyingFactor = self.elapsedTime;
GLKMatrix4 rotateMatrix = GLKMatrix4MakeRotation(varyingFactor, 0, 1, 0);
//#define UsePerspective // 注釋這行運行查看正交投影效果,解除注釋運行查看透視投影效果
#ifdef UsePerspective
// 透視投影
float aspect = self.view.frame.size.width / self.view.frame.size.height;
GLKMatrix4 perspectiveMatrix = GLKMatrix4MakePerspective(GLKMathDegreesToRadians(90), aspect, 0.1, 10.0);
GLKMatrix4 translateMatrix = GLKMatrix4MakeTranslation(0, 0, -1.6);
self.transformMatrix = GLKMatrix4Multiply(translateMatrix, rotateMatrix);
self.transformMatrix = GLKMatrix4Multiply(perspectiveMatrix, self.transformMatrix);
#else
// 正交投影
float viewWidth = self.view.frame.size.width;
float viewHeight = self.view.frame.size.height;
GLKMatrix4 orthMatrix = GLKMatrix4MakeOrtho(-viewWidth/2, viewWidth/2, -viewHeight / 2, viewHeight/2, -10, 10);
GLKMatrix4 scaleMatrix = GLKMatrix4MakeScale(200, 200, 200);
self.transformMatrix = GLKMatrix4Multiply(scaleMatrix, rotateMatrix);
self.transformMatrix = GLKMatrix4Multiply(orthMatrix, self.transformMatrix);
#endif
}
- (void)drawTriangle {
static GLfloat triangleData[36] = {
-0.5, 0.5f, 0, 1, 0, 0, // x, y, z, r, g, b,每一行存儲一個點的信息纠屋,位置和顏色
-0.5f, -0.5f, 0, 0, 1, 0,
0.5f, -0.5f, 0, 0, 0, 1,
0.5, -0.5f, 0, 0, 0, 1,
0.5f, 0.5f, 0, 0, 1, 0,
-0.5f, 0.5f, 0, 1, 0, 0,
};
[self bindAttribs:triangleData];
glDrawArrays(GL_TRIANGLES, 0, 6);
}
透視投影
這是使用透視投影的全部代碼涂臣。
// 透視投影
float aspect = self.view.frame.size.width / self.view.frame.size.height;
GLKMatrix4 perspectiveMatrix = GLKMatrix4MakePerspective(GLKMathDegreesToRadians(90), aspect, 0.1, 10.0);
GLKMatrix4 translateMatrix = GLKMatrix4MakeTranslation(0, 0, -1.6);
self.transformMatrix = GLKMatrix4Multiply(translateMatrix, rotateMatrix);
self.transformMatrix = GLKMatrix4Multiply(perspectiveMatrix, self.transformMatrix);
GLKMathDegreesToRadians是將角度轉(zhuǎn)換成弧度
GLKit提供了GLKMatrix4MakePerspective
方法便捷的生成透視投影矩陣。方法有4個參數(shù)float fovyRadians, float aspect, float nearZ, float farZ
售担。fovyRadians
表示視角赁遗。aspect
表示屏幕寬高比,為了將所有軸的單位長度統(tǒng)一族铆,所以需要知道屏幕寬高比多少岩四。nearZ
表示可視范圍在Z軸的起點到原點(0,0,0)的距離,farZ
表示可視范圍在Z軸的終點到原點(0,0,0)的距離,nearZ
和farZ
始終為正哥攘。下面是透視投影的剖面示意圖炫乓。
透視投影矩陣默認的可視方向是向Z軸的反方向生長的。視角(fovyRadians)越大献丑,看到的東西就越多末捣。只有在nearZ和farZ兩個平面范圍內(nèi)的點才會被投影到屏幕上,當(dāng)然這些點也必須在視角的范圍內(nèi)创橄。根據(jù)上面的條件箩做,一個位于z=0上的點是不能被投影到屏幕的,所以我增加了一個平移矩陣GLKMatrix4 translateMatrix = GLKMatrix4MakeTranslation(0, 0, -1.6)
,為了演示近大遠小的視覺效果妥畏,我又增加了旋轉(zhuǎn)矩陣GLKMatrix4 rotateMatrix = GLKMatrix4MakeRotation(varyingFactor, 0, 1, 0)
邦邦。最后將 perspectiveMatrix * translateMatrix * rotateMatrix
的結(jié)果賦值給Vertex Shader中的transform。
如果讀者還記得上一篇提到的矩陣運算的話醉蚁,就應(yīng)該知道perspectiveMatrix * translateMatrix * rotateMatrix
代表著先旋轉(zhuǎn)再平移最后執(zhí)行透視投影燃辖。這是以后所有3D變換操作的基本順序,投影必須放在最后网棍。透視投影的效果如下黔龟。
正交投影
代碼如下
// 正交投影
float viewWidth = self.view.frame.size.width;
float viewHeight = self.view.frame.size.height;
GLKMatrix4 orthMatrix = GLKMatrix4MakeOrtho(-viewWidth/2, viewWidth/2, -viewHeight / 2, viewHeight/2, -10, 10);
GLKMatrix4 scaleMatrix = GLKMatrix4MakeScale(200, 200, 200);
self.transformMatrix = GLKMatrix4Multiply(scaleMatrix, rotateMatrix);
self.transformMatrix = GLKMatrix4Multiply(orthMatrix, self.transformMatrix);
正交投影其實比較好理解,原先屏幕的X軸從左到右是-1到1滥玷,Y軸從上到下是1到-1氏身,經(jīng)過GLKMatrix4 orthMatrix = GLKMatrix4MakeOrtho(-viewWidth/2, viewWidth/2, -viewHeight / 2, viewHeight/2, -10, 10)
正交矩陣的變換,就會變成X軸從左到右是-viewWidth/2到viewWidth/2惑畴,Y軸從上到下是viewHeight/2到-viewHeight / 2蛋欣,viewWidth和viewHeight是屏幕的寬和高。我增加了一個縮放矩陣GLKMatrix4 scaleMatrix = GLKMatrix4MakeScale(200, 200, 200)
如贷,是為了可以看見渲染出來的矩形陷虎。因為它原本只有1 x 1的大小到踏,在正交投影后,也就是一個像素的大小尚猿,幾乎是看不見的夭禽。正交投影里的nearZ和farZ代表可視的Z軸范圍,超出的點就不可見了谊路。代碼效果如下。
本篇主要介紹了OpenGL中的兩個重要投影矩陣菩彬,掌握好它們對于后面更深入的學(xué)習(xí)3D和2D渲染有著非常重要的作用缠劝。
下一篇會講解攝像機,作為3D渲染中最基本的三大矩陣MVP之一骗灶,學(xué)習(xí)完之后就可以正式踏入3D渲染的世界了惨恭。