Question

我正在学习如何在iOS上使用OpenGL ES 2.0。现在我想做一些基本的2D动画（例如在屏幕周围移动一个矩形并改变它的大小）。我已经开始使用Apple在Xcode中提供的OpenGL ES项目模板。我的绘图代码如下所示：

static GLfloat squareVertices[] = {
    -0.5f, -0.33f,
    0.5f, -0.33f,
    -0.5f,  0.33f,
    0.5f,  0.33f
 };

// Update attribute values.
glVertexAttribPointer(VERTEX_ATTR, 2, GL_FLOAT, 0, 0, squareVertices);
glEnableVertexAttribArray(VERTEX_ATTR);

glVertexAttribPointer(COLOR_ATTR, 4, GL_UNSIGNED_BYTE, 1, 0, squareColors);
glEnableVertexAttribArray(COLOR_ATTR);

glDrawArrays(GL_TRIANGLE_STRIP, 0, 5);

现在，这将在屏幕中间绘制一个nice rectangle。但是如果我通过添加以下代码开始更改矩形，它将开始look funky：

squareVertices[5] -= .001;
squareVertices[7] -= .001;

好像矩形的一部分附着在屏幕的中心。我是OpenGL ES的新手，所以我确信我的问题很明显。我还假设这与OpenGL ES是3D图形库有关，我试图把它当作2D空间。所以我的问题是：在OpenGL ES 2.0中绘制和动画2D对象的最佳方法是什么？我在网上看过OpenGL ES 1.1的一些东西，但这对我没什么帮助。他们是在OpenGL ES 2.0中进行2D绘图的特殊技术，还是有某种2D绘图模式？

非常感谢任何指导。

Answer 1

@macinjosh：对于那些对答案感兴趣的人，这是对您更新的问题的回复。我猜你自2010年12月发布以来已经获得了进一步的知识！

OpenGL顶点是3D，而不是2D。为了完全真实，它们实际上是4D，因为它们也包含'w'组件，但是现在只需将其视为值1.0，就像同质向量一样。

由于它们具有3D效果，除非在着色器中添加“z”组件，否则必须指定一个作为顶点属性。

Answer 2

我是OpenGL的新手，但顶点不需要3个浮点数，每个斧头一个：X，Y，Z？

因此，第一个顶点数组将是：

( -0.50f, -0.33f, 0.50f) 
( -0.33f, -0.50f, 0.33f)
(  0.50f,  0.33f, ?????)

第二个将是：

( -0.50f, -0.33f, 0.00f )
(  0.50f, -0.33f, 0.00f )
( -0.50f,  0.33f, 0.00f )
(  0.50f,  0.33f, 0.00f )

我真的是个新手，所以不要太认真地对待我......）

顺便说一下，这是我发现的关于OpenGL的最佳知识来源：

http://iphonedevelopment.blogspot.com/2010/10/opengl-es-20-for-ios-chapter-3.html

希望这个答案有意义......

Answer 3

因为你有一个'3'作为glVertexAttribPointer的第三个参数。我相信你可以把它设置为2，但我没有在GL中尝试过这个。我的猜测是缺少的z轴将在内部填充为“0”（但再次尝试并看到！）。在内部，它可能都是4个浮点向量，其中第4个（'w'）参数用于均匀矩阵乘法gubbins。

如果您在移动设备上执行此操作，您可能还希望查看定点数学（在某些没有浮点co-pro的设备上更快）以及更高效的顶点缓冲对象在许多机器上。此外，还有一个固定的顶点格式，例如

使用的格式

glInterleavedArrays(format_code, stride, data)

可能证明效率更高，因为设备可能已为您决定使用的'format_code'优化了代码路径。

Answer 4

经过一番游戏后，我将绘图代码更改为：

static GLfloat squareVertices[12] = {
    -0.5f, -0.33f, 0.0,
    0.5f, -0.33f, 0.0,
    -0.5f, 0.33f, 0.0,
    0.5f, 0.33f, 0.0
};

// Update attribute values.
glVertexAttribPointer(VERTEX_ATTR, 3, GL_FLOAT, 0, 0, squareVertices);
glEnableVertexAttribArray(VERTEX_ATTR);

glVertexAttribPointer(COLOR_ATTR, 4, GL_UNSIGNED_BYTE, 1, 0, squareColors);
glEnableVertexAttribArray(COLOR_ATTR);

squareVertices[7] -= .001;
squareVertices[10] -= .001;

glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

向每个顶点添加第三个0.0浮点似乎可以解决问题。我不清楚为什么会出现这种情况，如果任何人能够解释一下，我会贬低它。

OpenGL ES 2.0（iOS）中的2D绘图

4 个答案: