Hazel游戏引擎（063）优化批处理和绘画旋转的Quad

原创

已于 2023-07-28 20:58:51 修改 · 401 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#游戏引擎 #OpenGL #渲染 #批处理

于 2023-07-24 01:36:31 首次发布

文章讨论了在OpenGL中处理Quad旋转的方法，通过CPU计算顶点在世界空间的位置，使用transform矩阵进行平移、旋转和缩放。批处理技术被用来优化渲染流程，先在CPU上累积多个物体的顶点信息，然后一次性传递给GPU进行绘制，以减少drawcall次数。在实现中，注意到了顶点位置的矩阵变换导致的图形偏离问题。

文中若有代码、术语等错误，欢迎指正

前言

062与061写的批处理留下来的问题
1. 批处理没有处理Quad旋转的函数
2. 062 061设计的顶点位置是基于自身空间的，没有经过transform变换位置，所以无旋转效果
此节所做
1. 处理Quad旋转函数
2. 将顶点位置在Cpu上计算，通过transform矩阵（平移、缩放、旋转）变换到世界空间
  
  与060之前不同，之前将顶点从局部空间转换到世界空间是在GPU(GLSL代码）上运行的。
流程：
1. 给所有quad以原点为初始位置（局部空间）
2. 再接受旋转角度，用初始位置transform矩阵 = 平移*旋转*缩放，再乘以顶点转换到世界空间
  
  （提下，写代码顺序是：平移*旋转*缩放，但解读顺序是：从右往左读，先进行缩放，再进行旋转最后平移)
3. 将最终世界空间的位置上传到GLSL的顶点着色器阶段

关键地方

Renderer2D.cpp

void Renderer2D::DrawrRotatedQuad(const glm::vec3& position, const glm::vec2& size, float rotation, const Ref<Texture2D>& texture, float tilingFactor, const glm::vec4& tintColor)
{
   
   
    HZ_PROFILE_FUNCTION();

    constexpr glm::vec4 color = {
   
    1.0f, 1.0f, 1.0f, 1.0f };

    float textureIndex = 0.0f;
    for (uint32_t i = 1; i < s_Data.TextureSlotIndex; i++)
    {
   
   
        // 当前纹理，如果已经存储在纹理槽，就直接读取
        if (*s_Data.TextureSlots[i].get() == *texture.get()) {
   
   
            textureIndex = (float)i;
            break;
        }
    }
    if (textureIndex == 0.0f) {
   
   
        textureIndex = (float