我如何对这个OpenGL ES纹理应用正确的视angular?

我想描述我的目标,并得到一些build议解决scheme的反馈。 我对OpenGL ES(或者OpenGL ES)相当陌生,所以请温和。 我也想提一下,这个平台是iPad(iOS),它是属于它的限制。

目标:让用户以正确的视angular(或至less可调整的透视图)正确地绘制纹理的顶点。 为了解释我的意思,请考虑下面的例子。

比方说,我们有一个在它前面有一个相应的草坪的房子的照片。 现在,我想铺平(用户)指定的path与瓷砖(纹理),使透视看起来是正确的。 如果视图恰好是正交的,那么这些图块将是完全正方形的,这在图像中具有某种深度时是不现实的。

现在,一种方法是在OpenGL ES上设置一个截然不同的视angular。 然后把一架飞机(如下图),并把它的图像纹理为初学者。

飞机上放置图像纹理

现在,如你所期望的,从上面的图像看,图像将被扭曲。 但是,这很好,因为如果我们将飞机向后倾斜(以便完美地适应显示器的边界),图像将呈现方形。

如果用户现在定义了要铺设的区域,我们可以将这些点放在与倾斜平面相同的angular度,然后在其中放置一个带有正方形瓷砖的纹理,并以透视的方式出现。 如果我们的倾斜angular度不正确,用户可以手动调整,那么上图中的平面的angular度angular度将会被调整,并且平面会以不同的方式倾斜以适合显示器。 然后瓷砖纹理将从不同的angular度出现。

这是一个可行的方法,还是有其他更好的方法来做到这一点? 我认为这是一个丑陋的黑客,可能与我有限的3D编程技能有关。

如果你只想把视angular应用到图像上,你甚至可能不需要OpenGL ES。 你可以简单地创build一个合适的CATransform3D,并以我在这个答案中描述的方式将其设置为UIView或CALayer。 关键是转换matrix的m34分量。

如果您仍想使用OpenGL ES和纹理进行此操作,则可以对纹理四边形的顶点应用变换以创build透视效果。 这个例子可以在这里看到:

在四边形上的透视变换

在这里我转换纹理显示相机input,使其具有透视效果。 这是使用以下顶点着色器完成的:

  attribute vec4 position; attribute vec4 inputTextureCoordinate; uniform mat4 transformMatrix; uniform mat4 orthographicMatrix; varying vec2 textureCoordinate; void main() { gl_Position = transformMatrix * vec4(position.xyz, 1.0) * orthographicMatrix; textureCoordinate = inputTextureCoordinate.xy; } 

在那里我以下面的方式生成了一个基于CATransform3D的matrix:

  CATransform3D perspectiveTransform = CATransform3DIdentity; perspectiveTransform.m34 = 0.4; perspectiveTransform.m33 = 0.4; perspectiveTransform = CATransform3DScale(perspectiveTransform, 0.75, 0.75, 0.75); perspectiveTransform = CATransform3DRotate(perspectiveTransform, rotation, 0.0, 1.0, 0.0); 

然后将CATransform3D转换为mat4(它有一个4×4的matrix内部结构,所以这相当容易)。 如果你想看到这个动作,抓住我的GPUImage框架中的FilterShowcase示例应用程序的代码,并尝试3-D转换条目。 代码全部在GPUImageTransformFilter中,并且应该相当容易地遵循。

这是最简单的方法。 你将不得不显示一个angular度正确的消失点,所以让用户旋转飞机本身是一个可行的解决scheme。 否则,这是一个image processing问题。 如果你有兴趣,我会看看计算机视觉中的消失点确定。