美文网首页
5、OpenGL初探之OpenGL渲染基础(OpenGL图元/固

5、OpenGL初探之OpenGL渲染基础(OpenGL图元/固

作者: 溪浣双鲤 | 来源:发表于2019-08-21 22:52 被阅读0次

初识OpenGL的开发者需要先要学会固定管线的渲染流程和思路,为之后学习可编程管线以及编写GLSL着色器程序打好基础,固定管线和可编程管线的区别只在于着色器程序的区别,其他的业务逻辑基本一致,好了,解释完了,开始上干货概念部分

1、OpenGL固定管线下的多种存储着色器介绍
2、OpenGL图元
3、OpenGL点/线/三角形
4、OpenGL工具类GLBatch的使用

一、OpenGL固定管线的存储着色器介绍


固定管线下,我们需要使用到一个类GLShaderManager(着色器管理者),下面我们来学习一下GLShaderManager的初始化

//定义全局变量
GLShaderManager shaderManager;

//在OpenGL环境配置完成后开始初始化
shaderManager.InitializeStockShaders();

介绍完GLShaderManager初始化之后,我们来学习一下固定管线下的存储着色器,使用固定管线下的存储着色器的时候,你不需要知道哪些工作是顶点着色器来完成,哪些工作是由片元着色器完成,该使用哪个通道进行传值,你只需要学会使用对应的API把需要的入参传入进去就行了,剩下的交给它,它已经封装好了这些功能。

先说明一下,在OpenGL里面我们使用任何固定管线,都是使用这一个函数,不同的着色器类型,仅仅是对应着色器的参数不相同而已

shaderManager.UseStockShader(<#GLT_STOCK_SHADER nShaderID, ...#>)

接下来我们开始着色器的学习:

1、单元着色器

使用场景:绘制默认OpenGL坐标系(-1,1)下的图形,图形的所有片段都会以一种颜色填充

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_IDENTITY,GLfloat vColor[4]);

参数1:存储着色器种类-单元着色器GLT_SHADER_IDENTITY
参数2:一维颜色数组,下标分别对应RGBA

2、平面着色器

使用场景:在绘制图形时,可以应用变换,例如仿射变换(投影/模型)变化

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_FLAT,GLfloat mvp[16],GLfloat vColor[4]);

参数1:存储着色器种类-平面着色器GLT_SHADER_FLAT
参数2:允许变化的4*4矩阵
参数3:一维颜色数组,下标分别对应RGBA

3、上色着色器

使用场景:在绘制图形时,可以应用变化(仿射变换,例如投影/模型变化)颜色将会平滑的插入到顶点之间称为平滑着色.

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_SHADED,GLfloat mvp[16]);

参数1:存储着色器种类-上色着色器GLT_SHADER_SHADED
参数2:允许变化的4*4矩阵

4、默认光源着色器

使用场景:在绘制图形时,可以应用变化(仿射变换,例如投影/模型变化)这种着色器会使绘制的图形产生阴影和光照效果(平行光)。

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_DEFAULT_LIGHT,GLfloat mvMatrix[16],GLfloat pMatrix[16],GLfloat vColor[4]);

参数1:存储着色器种类-默认光源着色器GLT_SHADER_DEFAULT_LIGHT
参数2:模型4*4矩阵
参数3:投影4*4矩阵
参数4:颜色值(注意:绘制这个图形的颜色,不是光的颜色)

5、点光源着色器

使用场景:在绘制图形时,可以应用变化(仿射变换,例如投影/模型变化)这种着色器会使绘制的图形产生阴影和光照效果(平行光)。它与默认光源着色器非常类似,区别只是光源的位置可能是特定的。

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_POINT_LIGHT_DIEF,GLfloat mvMatrix[16],GLfloat pMatrix[16],GLfloat vLightPos[3],GLfloat vColor[4]);

参数1:存储着色器种类-点光源着色器GLT_SHADER_POINT_LIGHT_DIEF
参数2:模型4*4矩阵
参数3:投影4*4矩阵
参数4:点光源的位置(x,y,z)因为光源不需要w(奇次坐标,通俗称缩放因子)
参数5:漫反射颜色值

6、纹理替换矩阵着色器

使用场景:在绘制图形时,可以应用变化(投影/模型变化)这种着色器通过给定的模型视图投影矩阵.使用纹理单元来进行颜色填充,其中每一个像素点的颜色值是从纹理中获取.

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_TEXTURE_REPLACE,GLfloat mvMatrix[16],GLint nTextureUnit);

参数1:存储着色器种类-纹理替换矩阵着色器GLT_SHADER_TEXTURE_REPLACE
参数2:模型4*4矩阵
参数3:纹理单元

7、纹理调整着色器

使用场景:在绘制图形时,可以应用变化(投影/模型变化)这种着色器通过给定的模型视图投影矩阵.着色器将一个基本色乘以一个取自纹理单元nTextureUnit的纹理,将颜色与纹理进行颜色混合后才填充到片段中.

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_TEXTURE_MODULATE,GLfloat mvMatrix[16],GLfloat vColor[4],GLint nTextureUnit);

参数1:存储着色器种类-纹理调整着色器GLT_SHADER_TEXTURE_MODULATE
参数2:模型4*4矩阵
参数3:颜色值
参数4:纹理单元

8、纹理光源着色器

使用场景:在绘制图形时,可以应用变化(投影/模型变化)这种着色器通过给定的模型视图投影矩阵.着色器将一个纹理通过漫反射照明计算进行调整(相乘).

API函数:

GLShaderManager::UserStockShader(GLT_SHADER_TEXTURE_POINT_LIGHT_DIEF,G Lfloat mvMatrix[16],GLfloat pMatrix[16],GLfloat vLightPos[3],GLfloat vBaseColor[4],GLint nTextureUnit);

参数1:存储着色器种类-纹理光源着色器GLT_SHADER_TEXTURE_POINT_LIGHT_DIEF
参数2:模型4*4矩阵
参数3:投影4*4矩阵
参数4:点光源的位置
参数5:颜色值(几何图形的基本色)
参数6:纹理单元

二、OpenGL基本图元


OpenGL常用的7种基本图元及图元描述分别如下表

OpenGL7种图元.png

其中最受欢迎的是三角形GL_TRIANGLES,因为三角形理论上是可以绘制任何图形的。

下面是这6种的示例图(备注:GL_POINTS点的就不画了)

OpenGL图元图示.png

三、OpenGL点/线/三角形及三角形的环绕方式


1、最简单也是最常用的方法glPointSize

glPointSize(<#GLfloat size#>);

参数1:表示点的大小

例如:
glPointSize(4.0f);

2、设置点的大小范围和点与点之间的间隔,获取点大小范围和最小步长

GLfloat sizes[2] = {2.0f, 8.0f};
GLfloat step = 1.0f;
    
glGetFloatv(GL_POINT_SIZE_RANGE, sizes);
glGetFloatv(GL_POINT_SIZE_GRANULARITY, &step);

3、通过使用程序点大小模式来设置点的大小,这种模式下允许我们通过编程在顶点着色器或者几何着色器中设置点的大小。着色器内建变量gl_PointSize,并且可以在着色器源码中直接写.

glEnable(GL_PROGRAM_POINT_SIZE);

gl_PointSize = 5.0

4、设置线段宽度

glLineWidth(<#GLfloat width#>)

参数1:线段宽度

例如:
glLineWidth(3.f);

5、对于OpenGL光栅化最受欢迎的就是三角形,3个顶点就能构成一个三角形,三角形的类型(形状)取决于3个顶点的连接方式和顶点坐标,例如并不是所有的三角形都是正三角形,三角形的连接方式是GL_TRIANGLES,可以参考图元那张图中的GL_TRIANGLES

6、三角形的环绕方式

参考上面OpenGL图元那张图中的GL_TRIANGLES

在绘制第一个三⻆角形时,线条是按照从A0->A1->A2->A0连接起来的,形成一个闭合三角形。 三角形A0A1A2这个是沿着顶点逆时针方向,而三角形A3A4A5这个三角形是颜色顶点顺时针方向的。这种顺序与方向结合来指定顶点的⽅式称为环绕。

默认情况下,OpenGL认为具有逆时针方向环绕的多边形为正面.这就意味着三角形A0A1A2是正面,而三角形A3A4A5这个是反面.

7、三角形带及三角形带的优点

对于很多表面或者形状而言,我们会需要绘制几个相连的三角形. 这时我们可以使用GL_TRIANGLE_STRIP 图元绘制⼀串串相连的三角形,从而节省大量的时间.如上面OpenGL图元图片中的GL_TRIANGLE_STRIP

三角形带的优点:

三角形带的优点:

1、用前3个顶点指定第1个三角形之后,对于接下来的每一个三角形,只需要再指定1个顶点。需要绘制⼤量的三角形时,采用这种⽅法可以节省大量的程序代码和数据存储空间

2、提供运算性能和节省带宽。更少的顶点意味着数据从内存传输到图形卡的速度更快,并且顶点着色器需要处理的次数也更少了。

8、三角形扇

对于很多表⾯或者形状而言,我们会需要绘制几个相连的三⻆形. 这时我们可以使⽤GL_TRIANGLE_FAN 图元绘制⼀组围绕⼀个中心点相连的三角形,如上面OpenGL图元图片中的GL_TRIANGLE_FAN

四、OpenGL工具类GLBatch的常用API的使用


GLBatch 俗称批次类,是在GLTools中包含的一个简单的容器类.常用的API如下:

1、设置图元,顶点数和纹理坐标(纹理坐标可选)

void GLBatch::Begain(GLeunm primitive,GLuint nVerts,GLuint nTexttureUnints = 0);

参数1:图元
参数2:顶点数
参数3:一组或者两组纹理坐标(可选参数)

2、复制顶点数据(一个由3分量x,y,z顶点组成的一维数组)

void GLBatch::CopyVerterxData3f(GLfloat *vVerts);

参数1:3分量顶点数组,代表(x,y,z)

3、复制表面法线数据

void GLBatch::CopyNormalDataf(GLfloat *vNorms);

参数1:法线

4、复制颜色数据

void GLBatch::CopyColorData4f(GLfloat *vColors);

参数1:RGBA颜色值数组

5、复制纹理坐标数据

void GLBatch::CopyTexCoordData2f(GLFloat *vTextCoords, GLuint uiTextureLayer);

6、结束数据复制

void GLBatch::End(void);

7、绘制图形

void GLBatch::Draw(void);

下一节,我们会使用固定存储着色器做一下多种图元组合实现,今天就到这里啦~

溪浣双鲤的技术摸爬滚打之路

相关文章

  • 5、OpenGL初探之OpenGL渲染基础(OpenGL图元/固

    初识OpenGL的开发者需要先要学会固定管线的渲染流程和思路,为之后学习可编程管线以及编写GLSL着色器程序打好基...

  • 离屏渲染与OpenGL渲染结构

    大纲 理解离屏渲染 OpenGL渲染结构 着色器 OpenGL 基础图元/基本图元连接 理解离屏渲染 正常渲染流程...

  • 简述OpenGL渲染架构流程、固定着色器、图元

    开场白 本文介绍内容 OpenGL渲染架构流程 OpenGL固定着色器 OpenGL基本图元连接方式 OpenGL...

  • OpenGL基础渲染

    第三章 基础渲染 本章内容 OpenGL渲染基础架构 如何使用7种OpenGL几何图元 如何使用存储着色器 如何使...

  • OpenGL基础渲染

    第三章 基础渲染 本章内容 OpenGL渲染基础架构 如何使用7种OpenGL几何图元 如何使用存储着色器 如何使...

  • OpenGL的绘制

    OpenGL渲染图像 OpenGL渲染图像需要执行的操作从OpenGL的几何图元中设置数据,用于构建形状。使用不同...

  • OpenGL-基础渲染

    目录 OpenGL渲染架构 投影方式设置 固定管线解析 OpenGL基本图元解析 图元绘制 GLBatch Ope...

  • OpenGL学习之路(2.0):OpenGL 基础渲染

    学习目标: OpenGL 渲染结构 如何使用7种OpenGL基础图元 如何使用储存着色器 如何使用Uniform属...

  • OpenGL基本图元

    OpenGL点/线 今天我们将从更底层更基础的角度来详细学习OpenGL图元渲染。点,是最简单的图像。每个特定的顶...

  • OpenGL 基础渲染(图元)

    图元 GL_POINTS每个顶点在屏幕上都是一个单独的点。 GL_LINES每一对顶点定义了一个线段 GL_LIN...

网友评论

      本文标题:5、OpenGL初探之OpenGL渲染基础(OpenGL图元/固

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