OpenGL ES 2(iOS)变形/两组顶点之间的动画

Question

我有两组顶点用作线条:

1. Vertexes1
2. Vertexes2

重要的是要知道这些顶点具有先前未知的值,因为它们是动态的.

我想在这两者之间进行动画过渡(变形).我想出了两种不同的方法:

选项1:

在顶点着色器中设置一个时间均匀,从0到1,我可以这样做:

// Inside main() in the vertex shader
float originX = Position.x;
float destinationX = DestinationVertexPosition.x;
float interpolatedX = originX + (destinationX - originX) * Time;

gl_Position.x = interpolatedX;

正如您可能看到的,这有一个问题:如何在那里获得"DestinationVertexPosition"？

选项2:

在顶点着色器之外进行插值计算,我遍历每个顶点并为插值创建第三个顶点集,并使用它进行渲染:

// Pre render
// Use this vertex set to render
InterpolatedVertexes

for (unsigned int i = 0; i < vertexCount; i++) {
   float originX = Vertexes1[i].x;
   float destinationX = Vertexes2[i].x;
   float interpolatedX = originX + (destinationX - originX) * Time;

   InterpolatedVertexes[i].x = interpolatedX;
}

我已经高度简化了这两个代码片段,只是为了让这个想法变得清晰.

现在,从两个选项中,我觉得第一个在性能方面肯定更好,因为在着色器级别发生了一些事情,并且每次更新"时间"时我都不必创建一组新的顶点.

那么,既然已经涵盖了问题的介绍,我将不胜感激以下三点:

1. 讨论在OpenGL ES 2(iOS)中实现预期结果的更好方法.
2. 关于如何通过提供"DestinationVertexPosition"或通过某种方式修改想法来正确实现选项1的讨论,以更好地实现相同的结果.
3. 关于如何实施选项2的讨论.

Answer 1

在ES 2中,您可以根据需要指定这些属性 - 因此,为两者指定属性origin并destination在顶点着色器中对它们进行线性插值没有问题.但是你真的不应该逐个组件地执行它,因为你的代码建议你想要GPU作为矢量处理器,而mixGLSL函数将执行你想要的线性混合.所以例如(明显效率低下和假设)

int sourceAttribute = glGetAttribLocation(shader, "sourceVertex");
glVertexAttribPointer(sourceAttribute, 3, GL_FLOAT, GL_FALSE, 0, sourceLocations);

int destAttribute = glGetAttribLocation(shader, "destVertex");
glVertexAttribPointer(destAttribute, 3, GL_FLOAT, GL_FALSE, 0, destLocations);

和:

gl_Position = vec4(mix(sourceVertex, destVertex, Time), 1.0);