如何将渲染顶点数组对象与 ImGUI 结合起来？

Question

将 PyOpenGL 与 GLU 和 PyGame 结合使用。

我有一个 VAO，后面有 VBO 和 IBO，它们提供面的顶点和索引数据。此外，我还有一个简单的顶点和片段着色器。事物呈现找到。

但是，我想将 ImGUI 添加到我的应用程序中。所以我做了以下事情：

def main():
    width = 800
    height = 800

    display = (width, height)

    pygame.init()
    pygame.display.set_caption('OpenGL VAO with pygame')
    pygame.display.set_mode(display, pygame.DOUBLEBUF | pygame.OPENGL | pygame.RESIZABLE)
    pygame.display.gl_set_attribute(pygame.GL_CONTEXT_MAJOR_VERSION, 4)
    pygame.display.gl_set_attribute(pygame.GL_CONTEXT_MINOR_VERSION, 1)
    pygame.display.gl_set_attribute(pygame.GL_CONTEXT_PROFILE_MASK, pygame.GL_CONTEXT_PROFILE_CORE)

    imgui.create_context()
    impl = PygameRenderer()
    io = imgui.get_io()
    #io.set_WantCaptureMouse(True)
    io.display_size = width, height

    init()

    clock = pygame.time.Clock()
    while True:
        for event in pygame.event.get():
            if event.type == pygame.QUIT:
                pygame.quit()
                quit()
            impl.process_event(event)

        render(time=clock, imgui_impl=impl)

        pygame.display.flip()
        pygame.time.wait(10)

if __name__ == '__main__':
    main()

这里有两个重要的功能：

• init()

  - 加载着色器并将其编译为程序，创建 VBO 和 IBO 并绑定它们

• render()

  - 清除深度和颜色缓冲区，创建并绑定 VAO，打开着色器，渲染 VAO 的内容等。

render()

函数看起来与此类似：

def render(time, imgui_impl):
    glClearColor(0.0, 0.0, 0.0, 0.0)
    glClearDepth(1.0)
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT)
    
    glUseProgram(program)
    glBindVertexArray(vao)
    
    fElapsedTime = pygame.time.get_ticks() / 1000.0
    for func in g_instanceList:
        transformMatrix = func(fElapsedTime)
        
        glUniformMatrix4fv(modelToCameraMatrixUnif, 1, GL_FALSE, transformMatrix.transpose())
        glDrawElements(GL_TRIANGLES, len(indexData), GL_UNSIGNED_SHORT, None)
    
    glBindVertexArray(0)
    glUseProgram(0)

    imgui.new_frame()
    imgui.begin('Controls', True)
    changed, strings = imgui.input_text('Path to OBJ', '...', imgui.INPUT_TEXT_READ_ONLY)
    imgui.same_line()
    if imgui.button('Load'):
        print('Loading', strings)
    imgui.end()
    imgui.end_frame()
    imgui.render()
    print(imgui.get_draw_data().valid)
    imgui_impl.render(imgui.get_draw_data())

我的问题是 ImGUI 根本不显示。我检查了 ImGui 绘制数据对象的有效性

imgui.get_draw_data().valid

并且它返回

True

。

我应该如何处理ImGUI数据？我确实关闭了程序（着色器），所以我想到的唯一问题是 VAO，这在某种程度上影响了 UI 的渲染。

Answer 1

我发现this帖子提到了一个似乎与我的问题类似的问题。然而，该OP的问题根源是不同的。他们解决这个问题的尝试对我来说很有效，即解除所有缓冲区的绑定。

在我的原始代码中，我解除了 VAO 的绑定，并禁用了着色器程序。看来解除 VBO 的绑定就足够了，尽管我也为 IBO 这样做了:

def render(time, imgui_impl):
    glClearColor(0.0, 0.0, 0.0, 0.0)
    glClearDepth(1.0)
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT)
    
    glUseProgram(program)
    glBindVertexArray(vao)
    
    fElapsedTime = pygame.time.get_ticks() / 1000.0
    for func in g_instanceList:
        transformMatrix = func(fElapsedTime)
        
        glUniformMatrix4fv(modelToCameraMatrixUnif, 1, GL_FALSE, transformMatrix.transpose())
        glDrawElements(GL_TRIANGLES, len(indexData), GL_UNSIGNED_SHORT, None)
    
    glBindVertexArray(0) # Disable the VAO
    glBindBuffer(GL_ARRAY_BUFFER, 0) # Disable the VBO
    glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, 0) # Disable the IBO (not required)
    glUseProgram(0) # Disable the shader program

    imgui.new_frame()
    # Add ImGUI contents
    imgui.end_frame()
    imgui.render()
    imgui_impl.render(imgui.get_draw_data())