IOS OpenGLES2.0 入门03 绘制彩色三角形

接上一篇

上一篇的三角形是红色, 红色的代码是固定死在代码里面的, 如果要蓝色, 白色, 或者是彩色的, 这样就行不通了

那么如何绘制一个彩色的三角形呢

绘制红色的三角形的Fragment Shader的代码是这样的

void main(void) {
gl_FragColor = vec4(1, 0, 0, 1);
}

之前说了gl_FragColor是该顶点的输出颜色, 正常我们不会把代码写死, 而应该是传递一个变量给它, 想要什么颜色可以通过这个变量来改.

Vertex Shader可以给Fragment Shader传递参数, 使用的就是varying关键字

我们将之前的Vertex Shader和Fragment Shader源码改动一下

Vertex Shader

attribute vec4 position;
attribute vec4 inputColor;
varying vec4 fragmentColor;

void main(void) {
fragmentColor = inputColor;
gl_Position = position;
}

Fragment Shader

varying lowp vec4 fragmentColor;
void main(void) {
gl_FragColor = fragmentColor;
}

这样我们就要传递两个参数给Vertex Shader, 一个position, 一个inputColor.

我们定义Color的数据

static int colorCount = 3;
static GLfloat colorData[] = {
//RGB格式
1,  0,  0,
0,  1,  0,
0,  0,  1
};

然后使用跟顶点数据一样的方式将数据传递给OpenGL

_positionPtr = glGetAttribLocation(_program, "position");
_colorPtr = glGetAttribLocation(_program, "inputColor");

glGenBuffers(1, &_colorBuffer);
glBindBuffer(GL_ARRAY_BUFFER, _colorBuffer);
glBufferData(GL_ARRAY_BUFFER, sizeof(colorData), colorData, GL_STATIC_DRAW);

因为颜色和顶点数据都是使用GL_ARRAY_BUFFER这个标志, 所以我们将数据绑定给OpenGL并且告诉它如何使用的时候, 必须马上将数据绘制出来, 不然会被后面的数据覆盖, 或者再重新绑定一次

glBindBuffer(GL_ARRAY_BUFFER, _vertexBuffer);

后面的glDrawArrays都是针对_vertexBuffer来操作.

然后在

glBindBuffer(GL_ARRAY_BUFFER, _colorBuffer);

后面的glDrawArrays都是针对_colorBuffer来操作.

这边不在多次绑定, 直接draw出来

所以创建和绘制顶点和颜色的函数改成这样

- (void) setupVertexAndColorData {
//顶点数据
glGenBuffers(1, &_vertexBuffer);
glBindBuffer(GL_ARRAY_BUFFER, _vertexBuffer);
glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);

glEnableVertexAttribArray(_positionPtr);
glVertexAttribPointer(_positionPtr, 2, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 2, NULL);
glDrawArrays(GL_TRIANGLES, 0, vertexCount);

//颜色数据
glGenBuffers(1, &_colorBuffer);
glBindBuffer(GL_ARRAY_BUFFER, _colorBuffer);
glBufferData(GL_ARRAY_BUFFER, sizeof(colorData), colorData, GL_STATIC_DRAW);

glEnableVertexAttribArray(_colorPtr);
glVertexAttribPointer(_colorPtr, 3, GL_FLOAT, GL_FALSE, sizeof(GLfloat) * 3, NULL);
glDrawArrays(GL_TRIANGLES, 0, colorCount);
}

其他的还是给上一篇一样

修改完后的代码