PyOpenGL绘制的2D图像倾斜了。

Question

我将尝试使用Pillow加载图像在OpenGL中绘制2D图像，但是当我在OpenGL中渲染时，图像会变形。

这是原始图像：

Loading.png

这是代码：

# -*- coding: utf-8 -*-
import glfw
from OpenGL.GL import *
if not glfw.init():
    sys.exit()
glfw.window_hint(glfw.CONTEXT_VERSION_MAJOR, 1)
glfw.window_hint(glfw.CONTEXT_VERSION_MINOR, 4)
window = glfw.create_window(800, 600, "Hello World", None, None)
if not window:
    sys.exit()
glfw.make_context_current(window)
glEnable(GL_BLEND)
glClearColor(1.0/255.0*68.0, 1.0/255.0*68.0, 1.0/255.0*68.0, 1.0)
glClear(GL_COLOR_BUFFER_BIT)
glViewport(0, 0, 800, 600)
glMatrixMode(GL_PROJECTION)
glLoadIdentity()
glOrtho(0.0, 800.0, 600.0, 0.0, 0.0, 1.0)

import numpy
from PIL import Image # pillow
def ReadTexture( filename):
  # PIL can open BMP, EPS, FIG, IM, JPEG, MSP, PCX, PNG, PPM
  # and other file types.  We convert into a texture using GL.
  print('trying to open', filename)
  try:
     image = Image.open(filename)
  except IOError as ex:
     print('IOError: failed to open texture file')
     message = template.format(type(ex).__name__, ex.args)
     print(message)
     return -1
  print('opened file: size=', image.size, 'format=', image.format)
  imageData = numpy.array(list(image.getdata()), numpy.uint8)

  textureID = glGenTextures(1)
  glPixelStorei(GL_UNPACK_ALIGNMENT, 4)
  glBindTexture(GL_TEXTURE_2D, textureID)
  glTexParameterf(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_NEAREST);
  glTexParameterf(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_NEAREST);
  glTexParameterf(GL_TEXTURE_2D,GL_TEXTURE_WRAP_S,GL_CLAMP_TO_EDGE);
  glTexParameterf(GL_TEXTURE_2D,GL_TEXTURE_WRAP_T,GL_CLAMP_TO_EDGE);
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_BASE_LEVEL, 0)
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAX_LEVEL, 0)
  glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, image.size[0], image.size[1],
     0, GL_RGB, GL_UNSIGNED_BYTE, imageData)

  image.close()
  return textureID

import sys
def get_user_input(str):
    if sys.version_info[0] < 3:
        return raw_input(str)
    else:
        return input(str)
print("started")

texture_id = ReadTexture("loading.png")
while True:
    glfw.poll_events()            
    glClear(GL_COLOR_BUFFER_BIT)
    glEnable(GL_TEXTURE_2D)
    glBindTexture(GL_TEXTURE_2D, texture_id)
    glBegin(GL_QUADS)
    glTexCoord2f(0, 0)
    glVertex2f(0,0)
    glTexCoord2f(0, 1)
    glVertex2f(0,100)
    glTexCoord2f(1, 1)
    glVertex2f(100,100)
    glTexCoord2f(1, 0)
    glVertex2f(100,0)
    glEnd()
    glDisable(GL_TEXTURE_2D)
    glfw.swap_buffers(window)

glfw.destroy_window(window)
glfw.terminate()

get_user_input("PRESS ENTER")

结果

正如您所见，结果是一张歪斜的图片，我不知道为什么会发生这种情况，而且我也看不出代码有什么问题。

编辑：可以确认在Python 2.7和3.8中存在相同的问题。

- MrNoise

Answer 1

当将图像加载到纹理对象中时，需要将GL_UNPACK_ALIGNMENT设置为1：

glPixelStorei(GL_UNPACK_ALIGNMENT, 1)
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, image.size[0], image.size[1],
     0, GL_RGB, GL_UNSIGNED_BYTE, imageData)

注意，你的情况中对齐方式设置为4（默认值）。这意味着图像的每一行都被假定对齐到大小是4的倍数。由于图像数据是紧密打包的，且每个像素的大小为3字节（GL_RGB），因此需要更改对齐方式。

- Rabbid76

Answer 2

我认为你正在尝试在一个 100x100 的四边形上绘制一个 106x26 的图像。请尝试将你的四边形大小改为 106x26。

- Thomas Schillaci

---

仍然存在相同的问题。 - MrNoise

很奇怪，你能展示一下这个修改后的截图吗？ - Thomas Schillaci

@ThomasSchillaci 不应该有影响。使用纹理坐标，纹理应该被拉伸到四边形上，而不管四边形的大小。 - LLSv2.0