iOS開發OpenGL ES教程(2)繪制矩形
嚴格意義上來說，矩形并不是OpenGL ES的圖元。 但是，讓我們面對現實，繪制這些矩形象繪制一個三角形一樣非常簡單。在本教程中，我們將把基本的三角形繪制代碼轉化為繪制矩形。再一次說明，這些渲染是靜 止的，但是我們通過轉化（即移動它們）來使它們快速移動。當然，一旦我們完成了矩形，我們將試圖完成一個立方體，我們將完成一個紋理映射的立方體。
本教程的快速小結及其他教程
上個教程，我們用空白畫布的XCode工程來渲染了一個實心的白色的三角形。為了做到這點，你創建了一個頂點數組，告訴OpenGL這些數據并且使用 glVertexPointer() 來格式化。為渲染這個頂點數組定義一個狀態，并且使用 glDrawArrays ()來渲染它。
今天，我們要使用之前的代碼，用制作三角形的方法來制作一個矩形。要做到這點，我們僅僅需要修改一對（組）代碼。***點是顯然的，我們需要4點來組成矩形， 而不是原來3點的三角形。然后，我們要告訴OpenGL用不一樣的 glDrawArrays().方法來繪制一個不同的物體。
讓我們開始吧。
定義矩形的頂點
打開之前教程中建立的XCode工程，找到 drawView函數。注釋掉 triangleVertices ，但是不是刪除它，我們在之后轉換的時候還需要用到，并且添加下列代碼：
- const GLfloat squareVertices[] = {
- -1.0, 1.0, -6.0, // Top left
- -1.0, -1.0, -6.0, // Bottom left
- 1.0, -1.0, -6.0, // Bottom right
- 1.0, 1.0, -6.0 // Top right
- };
這個定義了我們的矩形。注意，這個矩形的頂點也是逆時針的。然后，到下面的繪制三角形的代碼處，將這些代碼都注釋掉，回復到開始狀態。 所以注釋掉三個函數調用的glVertexArray （ ） ， glEnableClientState （ ） ，和glDrawArrays （ ） ，并添加以下代碼：
- glVertexPointer(3, GL_FLOAT, 0, squareVertices);
- glEnableClientState(GL_VERTEX_ARRAY);
- glDrawArrays(GL_TRIANGLE_FAN, 0, 4);
這三項職能相同，只是功能略有不同。
- glVertexPointer(3, GL_FLOAT, 0, squareVertices);
這個唯一的變化就是我們告訴OpenGL使用了不同的頂點設置方案，而不是現在的三角形。
glEnableClientState()同樣是告訴OpenGL從頂點數組來繪制（而不是顏色數組或者其他的什么）
- glDrawArrays(GL_TRIANGLE_FAN, 0, 4);
這里有些改變了。在上個教程，我們使用 GL_TRIANGLES 做用***個參數，并且使用3在第3個參數里。第2個參數。之前是0，這里也還是0，因為只包含了矩形的頂點。
***個參數是繪圖模式，而且你現在看到兩種可能的OpenGL繪圖方式。 我想花時間來討論現在不同的繪圖模式。
它們是：
GL_POINTS
GL_LINES
GL_LINE_LOOP
GL_LINE_STRIP
GL_TRIANGLES
GL_TRIANGLE_STRIP
GL_TRIANGLE_FAN
我們還沒有討論點或線，所以我只介紹***的三個 。在我開始之前，我要提醒你，頂點數組可能包含不止一個三角形，以便當您只看到一個物體頂點數組，你要知道，不僅限于這一點。
GL_TRIANGLES - 這個參數意味著OpenGL使用三個頂點來組成圖形。所以，在開始的三個頂點，將用頂點1，頂點2，頂點3來組成一個三角形。完成后，在用下一組的三個頂點來組成三角形，直到數組結束。
GL_TRIANGLE_STRIP - OpenGL的使用將最開始的兩個頂點出發，然后遍歷每個頂點，這些頂點將使用前2個頂點一起組成一個三角形。所以 squareVertices[6~8]將與 squareVerticies[0~2] 和 squareVerticies[3~5].生成一個三角形。 squareVertices[9~11]將與 squareVertices[3~5] 和squareVertices[6~8]生成三角形。
也就是說，0，1，2這三個點組成一個三角形，1，2，3這三個點也組成一個三角形。
注意的是， squareVerticies[0~2]表示的意思是：
squareVerticies[0] x坐標
squareVerticies[1] y坐標
squareVerticies[2] z坐標
如果我沒有說清楚的話，我用下面的例子來說明。
GL_TRIANGLE_FAN - 在跳過開始的2個頂點，然后遍歷每個頂點，讓OpenGL將這些頂點于它們前一個，以及數組的***個頂點一起組成一個三角形。 squareVertices[6~8]將與 squareVerticies[3~5] （前一個）和 squareVerticies[0~2]（***個）.生成一個三角形。
也就是說，同樣是0，1，2，3這4個頂點。
在STRIP狀態下是，0，1，2；1，2，3這2個三角形。
在FAN狀態下是，2，1，0；3，2，0這2個三角形。
這次我們將使用 GL_TRIANGLE_FAN ，我們將在顯示區域獲得一個矩形。點擊”Build & Go”,然后你將在屏幕上看到一個白色的矩形（平面）
回頭看你的頂點數組。設法想像用三角形來繪制一個矩形。OpenGL就是這樣做的。
三角形點1： squareVerticies[0~2] －矩形的左上
三角形點2： squareVerticies[3~5] －矩形的左下
三角形點3： squareVerticies[6~8] －矩形的右下
考慮到上述3點，一個三角形的OpenGL的繪制將彌補左下角的一半面積。試想矩形被對角線分割為左上角和右下角。如何通知這兩個三角形？OpenGL剛才只繪制了矩形的左半邊。
三角形點1： squareVerticies[9~11] －矩形的右上
三角形點2： squareVerticies[6~8] －矩形的右下，上個點
三角形點3： squareVerticies[0~2] －矩形的左上，***點
只使用了一個新的點，OpenGL可以渲染這個三角形來完成矩形。
GL_TRIANGLE_STRIP
返回代碼，改變 glDrawArrays() 的***個參數由 GL_TRIANGLE_FAN 為GL_TRIANGLE_STRIP:。
點擊”Build & Go”然后你會獲得下面的圖片。
讓我們來看看，為什么我們只是單單修改了下繪制模式，我們卻沒有獲得一個矩形。OpenGL展示我們的頂點數組如下：
三角形點1： squareVerticies[0~2] －矩形的左上
三角形點2： squareVerticies[3~5] －矩形的左下
三角形點3： squareVerticies[6~8] －矩形的右下
OpenGL使用了前3個點來渲染一個三角形。這個左下的三角形和之前是相同的。
三角形點1： squareVerticies[9~11] －矩形的右上
三角形點2： squareVerticies[6~8] －矩形的右下，上個點
三角形點3： squareVerticies[3~5] －矩形的左下，上2個點
這個是現在渲染三角形的3個點。這個三角形和我們理想的三角形有90度的夾角。
如果我們提供的頂點的數組不同，我們可以實現一個正確的 GL_TRIANGLE_STRIP ，我們現在還是做我們的 GL_TRIANGLE_FAN 。必須記住，你的繪制模式必須和你的頂點數組保持一致，否則，就會出現奇怪的效果，就象我們剛才修改的那樣。
如果，你堅持使用 GL_TRIANGLE_STRIP ，你只需要修改你的頂點數組，如下：
- const GLfloat stripSquare[] = {
- -1.0, -1.0, -6.0, // bottom left
- 1.0, -1.0, -6.0, // bottom right
- -1.0, 1.0, -6.0, // top left
- 1.0, 1.0, -6.0 // top right
- };
因此，與上述情況，我們可以看到***個三角形將形成頭三個頂點，產生一個三角形如下：
現在，通過指定點右上角頂點（ P4） ，一個新的三角地帶將形成與左上角工作（ P3 ）和第二前頂點（P2）這是右下角。新的頂點顯示為橙色，綠色和紅色如下：
結果是，那種方式都可以讓我們生成一個矩形。最終的結果是相同的。但這些提醒我們，要注意保持你的頂點數組和你的繪制模式的一致。
***。。。
現在，你已經知道如何生成三角形和矩形。我的介紹沒有包含點和線，因為它們比較簡單。在下一教程，我們將增加一些顏色。
一旦我們可以為我們的目標上色，我們可以移動他們，并且在3d中實現紋理映射。雖然，它不會象Doom 3一樣酷。但你知道，你可以開始建立3d的物體，我將開始包含3d世界的知識。
