【问题标题】:iPhone OpenGL ES 2.0 - Pixel Perfect TexturesiPhone OpenGL ES 2.0 - 像素完美纹理
【发布时间】:2011-11-08 12:16:01
【问题描述】:

如何让我的纹理与 OpenGL ES 2.0 中像素完美图形的屏幕像素对齐?这对于我正在处理的使用像素艺术图形的项目至关重要。对此的任何帮助都会很棒!

【问题讨论】:

  • 还有一件事...确保在着色器顶部有precision highp float;。如果您的纹理大于 1024x1024,mediump 将无法为您提供足够的精度来对纹理中的每个像素进行采样。

标签: ios opengl-es textures pixel


【解决方案1】:

在这里查看我的答案:OpenGL Texture Coordinates in Pixel Space


这已被问过几次,但我手头没有链接,所以一个快速而粗略的解释。假设纹理是 8 像素宽:

 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
 ^   ^   ^   ^   ^   ^   ^   ^   ^
0.0  |   |   |   |   |   |   |  1.0
 |   |   |   |   |   |   |   |   |
0/8 1/8 2/8 3/8 4/8 5/8 6/8 7/8 8/8

数字表示纹理的像素,条形表示纹理的边缘,并且在最近过滤像素之间的边界的情况下。但是,您想击中像素的中心。所以你对纹理坐标感兴趣

(0/8 + 1/8)/2 = 1 / (2 * 8)

(1/8 + 2/8)/2 = 3 / (2 * 8)

...

(7/8 + 8/8)/2 = 15 / (2 * 8)

或者更一般地说,对于 N 宽纹理中的像素 i,正确的纹理坐标是

(2i + 1)/(2N)

但是,如果您想将纹理与屏幕像素完美对齐,请记住您指定的坐标不是四边形的像素,而是边缘,根据投影,边缘可能与屏幕像素边缘对齐,而不是中心,因此可能需要其他纹理坐标。

【讨论】:

  • 我有点不同意 - 没有理由做任何特别的事情。 GL 确保始终在像素内的某个地方(通常是中心)计算变化的样本,因此不需要做任何特殊的事情。只需将纹理绘制为四边形,使用 GL_NEAREST 进行纹理过滤,使用 (0,0,1,1) 作为纹理坐标。只要纹理与屏幕空间中的四边形大小相同,您的纹理绘制将是像素完美的。
【解决方案2】:

此链接可能有用:

http://glprogramming.com/red/appendixg.html#name1

查看“如果需要精确的二维光栅化...”。这个 OpenGL 技巧告诉你如何最好地设置你的 2D 正交矩阵。

此外,您可能需要禁用任何类型的纹理过滤。

【讨论】:

  • 这对旧版 OpenGL 来说是个好建议,但并不直接适用于 ES 2.0
  • @andrewmu:不知道 - 你能解释一下原因吗? ES有那么不同吗?
  • 非常感谢,但正如 ardrewmu 所说,这样的矩阵运算在 ES 2.0 中不可用。虽然我以前看过这个,但它可能会有所帮助。
  • @neodelphi:在 ES 2.0 中它非常不同。由于片段和顶点着色器可以实现很多功能,因此删除了很多内容。
  • @andrewmu 好的。不能在顶点着色器中做正确偏移的投影矩阵吗?
猜你喜欢
  • 2011-05-19
  • 1970-01-01
  • 2012-04-08
  • 1970-01-01
  • 1970-01-01
  • 2012-04-08
  • 2012-03-29
  • 1970-01-01
  • 2023-03-17
相关资源
最近更新 更多