美文网首页
OpenGL-07-OpenGL渲染架构、投影、着色器分类及图元

OpenGL-07-OpenGL渲染架构、投影、着色器分类及图元

作者: 宇宙那么大丶 | 来源:发表于2020-07-17 18:57 被阅读0次

    一、OpenGL渲染架构

    1、架构

    image.png
    • client 客户端,这里指的是在iOS中调用的OpenGL API方法。这一部分在CPU中运行
    • sever 服务端,这里指的是OpenGL底层的渲染处理。这一部分在GPU中运行。
    • 客户端中用过调用API,将图形渲染的相关数据通过通道传递到服务端中顶点着色器、片元着色器,并交由GPU处理
    • 服务端通过与客户端的通道接收传递的数据,并交由相应的着色器进行渲染处理,并将结果显示在屏幕上

    2、数据传递方式

    • attributes:
      1、用于传递经常发生变动的数据。例如:颜色数据、顶点坐标、纹理坐标、光照法线等
      2、只能传入顶点着色器。不能直接传入片元着色器,可以通过顶点着色器间接传递给片元着色器
    • uniform:
      1、用于传递不经常发生变动的数据。例如:统一的批次数据、一次性传递一个东西(变换矩阵)
      2、可以直接传入顶点着色器,也可以直接传入片元着色器
    • Texture data:
      1、与uniform一样,可以直接传入顶点着色器和片元着色器
      2、由于顶点着色器主要是用来处理顶点数据的,我们将纹理数据传入没有什么意义。并且纹理的处理逻辑主要还是在片元着色器中进行

    二、投影方式及API使用

    1、正投影

    1、使用场景:显示2D图形效果
    2、API使用:

    //依次传入X、Y、Z轴上的最小、最大范围值
    GLFrumstum::SetOrthographic(GLfloat xMin, GLfloat xMax, GLfloat yMin, GLfloat yMax, GLfloat zMin, GLfloat zMax)
    

    2、透视投影

    1、使用场景:显示3D图形效果,及远小近大效果
    2、API使用:

    /*
    参数:
    fFov:垂直⽅向上的视场⻆度
    fAspect:窗⼝的宽度与⾼度的纵横⽐,纵横⽐ = 宽(w)/⾼(h)
    fNear:近裁剪⾯距离
    fFar:远裁剪⾯距离
    */
    CLFrustum::SetPerspective(float fFov , float fAspect ,float fNear ,float fFar);
    

    三、存储着色器分类

    初始化

    // GLShaderManager 的初始化
    GLShaderManager shaderManager;
    shaderManager.InitializeStockShaders();  
    

    1、单元着色器

    GLT_SHADER_IDENTITY

    /*
    使⽤场景: 绘制默认OpenGL 坐标系(-1,1)下图形. 图形所有⽚段都会以⼀种颜⾊填充
    参数1: 存储着⾊器种类-单元着⾊器 GLT_SHADER_IDENTITY
    参数2: 颜⾊
    */
    GLShaderManager::UserStockShader(GLT_SHADER_IDENTITY,GLfloat vColor[4]);
    

    2、平面着色器

    GLT_SHADER_FLAT

    /*
    使用场景:在绘制图形时,可以应用变换(模型/投影变化)
    
    参数1:存储着⾊器种类-平⾯着⾊器 GLT_SHADER_FLAT
    参数2:允许变化的4*4矩阵
    参数3:颜色
    */
    GLShaderManager::UserStockShader(GLT_SHADER_FLAT,GLfloat mvp[16],GLfloat 
    vColor[4]);
    

    3、上色着色器

    GLT_SHADER_SHADED

    /*
    使⽤场景: 在绘制图形时, 可以应⽤变换(模型/投影变化) ,颜⾊将会平滑地插⼊到顶点之间
    称为平滑着⾊.
    
    参数1: 存储着⾊器种类-上⾊着⾊器 GLT_SHADER_SHADED
    参数2: 允许变化的4*4矩阵
    */
    GLShaderManager::UserStockShader(GLT_SHADER_SHADED,GLfloat mvp[16]);
    

    4、默认光源着色器

    GLT_SHADER_DEFAULT_LIGHT

    /*
    使⽤场景: 在绘制图形时, 可以应⽤变换(模型/投影变化) 这种着⾊器会使绘制的图形产⽣
    阴影和光照的效果. 
    
    参数1: 存储着⾊器种类-默认光源着⾊器 GLT_SHADER_DEFAULT_LIGHT
    参数2: 模型4*4矩阵
    参数3: 投影4*4矩阵
    参数4: 颜⾊值
    */
    GLShaderManager::UserStockShader(GLT_SHADER_DEFAULT_LIGHT,GLfloat 
    mvMatrix[16],GLfloat pMatrix[16],GLfloat vColor[4]);
    

    5、点光源着色器

    GLT_SHADER_POINT_LIGHT_DIEF

    /*
    使⽤场景: 在绘制图形时, 可以应⽤变换(模型/投影变化) 这种着⾊器会使绘制的图形产⽣
    阴影和光照的效果.它与默认光源着⾊器⾮常类似,区别只是光源位置可能是特定的.
    
    参数1: 存储着⾊器种类-点光源着⾊器 GLT_SHADER_POINT_LIGHT_DIEF
    参数2: 模型4*4矩阵
    参数3: 投影4*4矩阵
    参数4: 点光源的位置
    参数5: 颜⾊值
    */
    GLShaderManager::UserStockShader(GLT_SHADER_POINT_LIGHT_DIEF,GLfloat 
    mvMatrix[16],GLfloat pMatrix[16],GLfloat vLightPos[3],GLfloat vColor[4]); 
    

    6、纹理替换矩阵着色器

    GLT_SHADER_TEXTURE_REPLACE

    /*
    使⽤场景: 在绘制图形时, 可以应⽤变换(模型/投影变化)这种着⾊器通过给定的模
    型视图投影矩阵.使⽤纹理单元来进⾏颜⾊填充.其中每个像素点的颜⾊是从纹理中获取
    
    参数1: 存储着⾊器种类-纹理替换矩阵着⾊器 GLT_SHADER_TEXTURE_REPLACE
    参数2: 模型4*4矩阵
    参数3: 纹理单元
    */
    GLShaderManager::UserStockShader(GLT_SHADER_TEXTURE_REPLACE,GLfloat 
    mvMatrix[16],GLint nTextureUnit); 
    

    7、纹理调整着色器

    GLT_SHADER_TEXTURE_MODULATE

    /*
    使⽤场景: 在绘制图形时, 可以应⽤变换(模型/投影变化)这种着⾊器通过给定的模
    型视图投影矩阵. 着⾊器将⼀个基本⾊乘以⼀个取⾃纹理单元nTextureUnit 的纹理.将颜⾊与纹理进⾏颜⾊混合后才填充到⽚段中.
    
    参数1: 存储着⾊器种类-纹理调整着⾊器 GLT_SHADER_TEXTURE_MODULATE
    参数2: 模型4*4矩阵
    参数3: 颜⾊值
    参数4: 纹理单元
    */
    GLShaderManager::UserStockShader(GLT_SHADER_TEXTURE_MODULATE,GLfloat 
    mvMatrix[16],GLfloat vColor[4],GLint nTextureUnit);
    
    

    8、纹理光源着色器

    GLT_SHADER_TEXTURE_POINT_LIGHT_DIEF

    /*
    使⽤场景: 在绘制图形时, 可以应⽤变换(模型/投影变化)这种着⾊器通过给定的模 逻辑教育 型视图投影矩阵. 着⾊器将⼀个纹理通过漫反射照明计算进⾏调整(相乘).
    
    参数1: 存储着⾊器种类-纹理光源着⾊器 GLT_SHADER_TEXTURE_POINT_LIGHT_DIEF
    参数2: 模型4*4矩阵
    参数3: 投影4*4矩阵
    参数4: 点光源位置
    参数5: 颜⾊值(⼏何图形的基本⾊) 
    参数6: 纹理单元
    */
    GLShaderManager::UserStockShader(GLT_SHADER_TEXTURE_POINT_LIGHT_DIEF,G
    Lfloat mvMatrix[16],GLfloat pMatrix[16],GLfloat vLightPos[3],GLfloat 
    vBaseColor[4],GLint nTextureUnit);
    
    

    还有一些可编程管线下的着色器:顶点着色器、片元着色器、细分着色器

    四、常见图元连接方式

    1、分类

    image.png
    image.png

    2、点和线

    //1.最简单也是最常⽤的 4.0f,表示点的⼤⼩
    glPointSize(4.0f); 
    //2.设置点的⼤⼩范围和点与点之间的间隔
    GLfloat sizes[2] = {2.0f,4.0f}; 
    GLfloat step = 1.0f; 
    //3.获取点⼤⼩范围和最⼩步⻓
    glGetFloatv(GL_POINT_SIZE_RANGE ,sizes); 
    glGetFloatv(GL_POINT_GRAULARITY ,&step); 
    //4.通过使⽤程序点⼤⼩模式来设置点⼤⼩
    glEnable(GL_PROGRAM_POINT_SIZE); 
    //5.这种模式下允许我们通过编程在顶点着⾊器或⼏何着⾊器中设置点⼤⼩。着⾊器内建变量:
    gl_PointSize(内建变量),并且可以在着⾊器源码直接写
    gl_PointSize = 5.0 
    //6. 设置线段宽度
    glLineWidth(2.5f)
    

    3、三角形

    对于光栅化来说,最受欢迎的就是三角形。3个顶点构成一个三角形,并不是所有的三角形都是正三角形,也存在正面反面。

    image.png
    如图,在绘制第⼀个三⻆形时,线条是按照从V0-V1,再到V2。最后再回到V0的⼀个闭合三⻆形。 这个是沿着顶点顺时针⽅向。这种顺序与⽅向结合来指定顶点的⽅式称为环绕。在OpenGL里,逆时针方向的环绕的多边形为正面。相反顺时针为反面
    /*
    GL_CW:告诉OpenGL 顺时针环绕的多边形为正⾯;
    GL_CCW:告诉OpenGL 逆时针环绕的多边形为正⾯
    默认是GL_CW
    */
    glFrontFace(GL_CW);
    
    

    4、三角形带

    对于很多表⾯或者形状⽽⾔,我们会需要绘制⼏个相连的三⻆形. 这是我们可以使用GL_TRIANGLE_STRIP 图元绘制⼀串相连三⻆形,从⽽节省⼤量的时间


    image.png

    优点:
    1、⽤前3个顶点指定第1个三⻆形之后,对于接下来的每⼀个三⻆形,只需要再指定1个顶点。需要绘制⼤量的三⻆形时,采⽤这种⽅法可以节省⼤量的程序代码和数据存储空间
    2、提供运算性能和节省带宽。更少的顶点意味着数据从内存传输到图形卡的速度更快,并且顶点着⾊器需要处理的次数也更少了。

    5、三角形扇

    对于很多表⾯或者形状⽽⾔,我们会需要绘制⼏个相连的三⻆形. 这是我们可以使⽤GL_TRIANGLE_FAN 图元绘制⼀组围绕⼀个中⼼点相连的三⻆形


    image.png

    五、OpenGL ⼯具类 GLBatch

    GLBatch ,是在GLTools中包含的⼀个简单容器类

    /*
    参数1:图元
    参数2:顶点数
    参数3:⼀组或者2组纹理坐标(可选)
    */
    void GLBatch::Begain(GLeunm primitive, GLuint nVerts, GLuint nTexttureUnints = 0); 
    
    //复制顶点数据(⼀个由3分量x,y,z顶点组成的数组) 
    void GLBatch::CopyVerterxData3f(GLfloat *vVerts); 
    //复制表⾯法线数据
    void GLBatch::CopyNormalDataf(GLfloat *vNorms); 
    //复制颜⾊数据
    void GLBatch::CopyColorData4f(GLfloat *vColors); 
    //复制纹理坐标数据
    void GLBatch::CopyTexCoordData2f(GLFloat *vTextCoords, GLuint uiTextureLayer); 
    //结束数据复制
    void GLBatch::End(void); 
    //绘制图形
    void GLBatch::Draw(void);
    

    相关文章

      网友评论

          本文标题:OpenGL-07-OpenGL渲染架构、投影、着色器分类及图元

          本文链接:https://www.haomeiwen.com/subject/xrkjhktx.html