学习OpenGL：笔记三

最新推荐文章于 2022-11-08 12:00:30 发布

donggongtao3511

最新推荐文章于 2022-11-08 12:00:30 发布

阅读量127

点赞数

原文链接：http://www.cnblogs.com/neverMore-face/p/10126737.html

版权

绘制图元－矩形

严格意义上来说，矩形并不是OpenGL ES的图元。但是，绘制这些矩形象绘制一个三角形一样非常简单。我们可以将把基本的三角形绘制代码转化为绘制矩形。这些渲染是静止的，但是我们通过转化（即移动它们）来使它们快速移动。先创建=一个顶点数组，告诉OpenGL这些数据并且使用 glVertexPointer() 来格式化。为渲染这个顶点数组定义一个状态，并且使用 glDrawArrays ()来渲染它。
用制作三角形的方法来制作一个矩形，我们需要4点来组成矩形，而不是原来3点的三角形。告诉OpenGL用不一样的 glDrawArrays().方法来绘制一个不同的物体。

定义矩形的顶点
找到 drawView函数，并且添加下列代码：

 static GLfloat triangleData[24] = {
        0.5,  -0.3f ,  0,  0,  0.5,  0, // x, y, z, r, g, b,每一行存储一个点的信息，位置和颜色
        -0.5f, -0.3f ,  0,  0,  1,  0,
        0.5f,  0.3f ,  0,  0,  0.5,  1,
        -0.5,  0.3f ,  0,  0,  0.5,  1,
    };

这个定义了我们的矩形，这个矩形的顶点是逆时针的，并添加以下代码：

    GLuint positionAttribLocation = glGetAttribLocation(self.shaderProgram, "position");
    glEnableVertexAttribArray(positionAttribLocation);
    GLuint colorAttribLocation = glGetAttribLocation(self.shaderProgram, "color");
    glEnableVertexAttribArray(colorAttribLocation);
    glVertexAttribPointer(positionAttribLocation, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(GLfloat), (char *)triangleData);
    glVertexAttribPointer(colorAttribLocation, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(GLfloat), (char *)triangleData + 3 * sizeof(GLfloat));
    glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

这三项职能相同，只是功能略有不同。

glVertexPointer(3, GL_FLOAT, 0, squareVertices);

这个唯一的变化就是我们告诉OpenGL使用了不同的顶点设置方案，而不是现在的三角形。

glEnableClientState()同样是告诉OpenGL从顶点数组来绘制（而不是颜色数组或者其他的什么）

glDrawArrays(GL_TRIANGLE_FAN, 0, 4);

这里有些改变了。我们使用 GL_TRIANGLE_FAN 做用第一个参数，并且使用4在第3个参数里。第2个参数，这里也是0，因为只包含了矩形的顶点。

绘图模式：

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 ，我们将在显示区域获得一个矩形。将在屏幕上看到一个白色的矩形（平面）

回头看你的顶点数组。设法想像用三角形来绘制一个矩形。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:。

然后你会获得下面的图片。

让我们来看看，为什么我们只是单单修改了下绘制模式，我们却没有获得一个矩形。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 ，只需要修改顶点数组，如下：

static GLfloat triangleData[18] = {

        0.5,  -0.3f ,  0,  0,  0.5,  0, 
        -0.5f, -0.3f ,  0,  0,  1,  0,
        0.5f,  0.3f ,  0,  0,  0.5,  1,
    };
glDrawArrays(GL_TRIANGLE_STRIP, 0, 3);

因此，我们可以看到第一个三角形将形成头三个顶点，产生一个三角形如下：

 static GLfloat triangleData[24] = {
        0.5,  -0.3f ,  0,  0,  0.5,  0, // x, y, z, r, g, b,每一行存储一个点的信息，位置和颜色
        -0.5f, -0.3f ,  0,  0,  1,  0,
        0.5f,  0.3f ,  0,  0,  0.5,  1,
        -0.5,  0.3f ,  0,  0,  0.5,  1,
    };
  glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

这个方式可以让我们生成一个矩形：