OpenGL/OpenGL ES (二) —— 渲染架构、图元、着色器、投影

OpenGL/OpenGL ES (一) —— 专业名词快速了解
OpenGL/OpenGL ES (二) —— 渲染架构、图元、着色器、投影
OpenGL/OpenGL ES (三) —— 绘制甜甜圈
OpenGL/OpenGL ES (四) —— 纹理
OpenGL/OpenGL ES (五) —— 纹理翻转策略
OpenGL/OpenGL ES (六) —— 立方体旋转
OpenGL/OpenGL ES (七) —— 初探
OpenGL/OpenGL ES (八) —— 如何加载一张图片
OpenGL/OpenGL ES (九) —— 光照

OpenGL渲染流程
图片来自于网络.png

看图说话渲染分为两部分组成,一部分是客户端,另一部分是服务器端。 服务器端由四个大的阶段组成

  • 顶点着色器(Vertex Shader):处理从客户端输入的数据、应用变换、进行其他的类型的数学运算来计算光照效果、位移、颜色值等。为了渲染共有3个顶点的三角形,Vertex Shader将执行3次,也就是为了每个顶点执行一次。

  • 图元装配 :通过glDraw***提供的顶点交到顶点着色器执行,顶点着色器变换的每个顶点包括描述顶点(x,y,z,w)值的顶点位置。图元类型和顶点确定将被渲染的单独图元,对于每个单独图元及对应的顶点将执行。顶点着色器输出-->裁剪-->透视分割-->透视变化-->再到下一个阶段光栅化。

  • 光栅化:对来自图元装配的图元进行光栅化处理,把它转换为二维片段,输出成屏幕的坐标、颜色属性、纹理坐标等交给片元着色的阶段处理。这就是光栅化的过程。

  • 片元着色器 (Fragment Shader):对来自光栅化的每个片段通过执行Fragment Shader进行填充。Fragment Shader会输出我们将屏幕上看到的最终颜色值。

  • 渲染:(Render):将图形/图像数据转换成3D空间图像。

在可编程管线中,我们能够编码的就是Vertex Shader(顶点着色器) 和 Fragment Shader(片元着色器)。
可以通过三种方式:
1、属性 (Attributes):就是一个对每个顶点都要作改变的数据元素。实际上,顶点位置本身就是一个属性。属性可以是浮点数、整数或布尔数据。
2、Uniform值 :通常设置Uniform变量就紧接着发出渲染一个图元批次的命令。可以无限制的使用。设置一个应用于整个表面的单个颜色值,还可以设置一个时间值。可以是浮点数、整数或布尔数据。

3、纹理(Texture Data): Vertex Shader和Fragment Shader都可以对纹理值进行采样和筛选。纹理数据的作用并不仅仅是表现图形(后期详解)

Attributes不能够直接传递给Fragment Shader,如果需要传递给Fragment Shader,则需要通过Vertex Shade间接的传递过去。而 UnifromTexture Data可以直接传递给Vertex Shader和Fragment Shader`具体怎么传递,依需求而定。

投影

正投影
正投影.png
透视投影
透视投影.png

GLFrustum类通过setPerspective 方法为我们构建一个平截头体。

参数:
fFov:垂直方向上的视场角度
fAspect:窗口的宽度与高度的纵横比
fNear:近裁剪⾯面距离
fFar:远裁剪面距离
纵横⽐比 = 宽(w)/高(h)

CLFrustum::SetPerspective(float fFov , float fAspect ,float fNear ,float fFar);

固定存储着色器的分类

存储着色器的使用

GLShaderManager的初始化

// GLShaderManager初始化
GLShaderManager shaderManager;
shaderManager.InitializeStockShaders();
1、单位(Identity)着色器

单位着色器:只是简单地使用默认笛卡尔坐标系(范围-1.0~1.0)。所有的片段都应用同一种颜色,几何图形为实心和未渲染的。
参数1:存储着色器种类 - 单元着色器
参数2:颜色

GLShaderManager::UseStockShader(GLT_SHADER_IDENTITY, GLfloat vColor[4]);
2、平面(Flat)着色器

平面着色器:将统一着色器进行了扩展,允许为几何图形变换指定一个4x4变换矩阵。在绘制时,可以应用变换(模型/投影变化)。
参数1:存储着色器种类 - 平面着色器
参数2:允许变化的4x4矩阵
参数3:颜色

GLShaderManager::UseStockShader(GLT_SHADER_FLAT, FLfloat mvp[16], GLfloat vColor[4]);
3、上色(Shaded)着色器

上色着色器:这种着色器唯一的uniform值就是在几何图形种应用的变换矩阵。GLT_ATTRIBUTE_VERTEX(顶点分量)和GLT_ATTRIBUTE_COLOR(颜色分量)在这种着色器中都会使用。颜色值将被平滑地插入顶点之间(称为平滑着色)。
参数1:存储着色器种类 - 上色着色器
参数2:允许变化的4x4矩阵

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

4、默认光源着色器

默认光源着色器:使对象产生阴影和光照的效果。需要设置存储着色器的GLT_ATTRIBUTE_VERTEX(顶点分量)和GLT_ATTRIBUTE_NORMAL(表面法线)。
参数1:存储着色器种类 - 默认光源着色器
参数2:模型4x4矩阵
参数3:投影4x4矩阵
参数4:颜色

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

5、点光源着色器

点光源着色器:点光源着色器和默认光源着色器很相似,但是光源位置可能是特定的。同样需要设置存储着色器的GLT_ATTRIBUTE_VERTEX(顶点分量)和GLT_ATTRIBUTE_NORMAL(表面法线)。
参数1:存储着色器种类 - 点光源着色器
参数2:模型4x4矩阵
参数3:投影4x4矩阵
参数4:点光源的位置
参数5:颜色

GLShaderManager::UseStockShader(GLT_SHADER_POINT_LIGHT_DIFF, FLfloat mvMatrix[16],GLfloat pMatrix[16],GLfloat vLightPos[3], GLfloat vColor[4]);

6、纹理替换矩阵着色器

纹理替换矩阵着色器:通过给定的模型视图投影矩阵,使绑定到nTextureUnit指定的纹理单元的纹理对几何图形进行变换。片段颜色时直接从纹理样本中直接获取的。所需的属性有GLT_ATTRIBUTE_VERTEX(顶点分量)和GLT_ATTRIBUTE_NORMAL(表面法线)。
参数1:存储着色器种类 - 纹理替换矩阵着色器
参数2:模型4x4矩阵
参数3:纹理单元。

GLShaderManager::UseStockShader(GLT_SHADER_TEXTURE_REPLACE, GLfloat mvpMatrix[16], GLint nTextureUnit);

7、纹理调整着色器

纹理调整着色器:将一个基本色乘以一个取自纹理单元nTextureUnit的纹理。所需的属性有GLT_ATTRIBUTE_VERTEX(顶点分量)和GLT_ATTRIBUTE_TEXTURE0(纹理坐标)。

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

GLShaderManager::UseStockShader(GLT_SHADER_TEXTURE_MODULATE, GLfloat mvpMatrix[16], GLfloat vColor, GLint nTextureUnit);

8、纹理光源着色器

纹理光源着色器:将一个纹理通过漫反射照明计算进行调整(相乘),广西在视觉空间中的位置是给定的,这种着色器接受5个Uniform值,即模型视图矩阵、投影矩阵、视觉空间中的光源位置、几何图形的基本色和将要使用的纹理单元。
所需的属性有GLT_ATTRIBUTE_VERTEX(顶点分量)、GLT_ATTRIBUTE_TEXTURE0(纹理坐标)和GLT_ATTRIBUTE_NORMAL(表面法线)。
参数1:存储着色器种类 - 纹理光源着色器
参数2:模型4x4矩阵
参数3:投影4x4矩阵
参数4:点光源位置
参数5:颜色值(几何图形的基本色)
参数6:纹理单元

GLShaderManager::UseStockShader(GLT_SHADER_TEXTURE_POINT_LIGHT_DIFF, GLfloat mvMatrix, GLfloat pMatrix[16], GLfloat vLightPos[3], GLfloat vBaseColor[4], GLint nTextureUnit);

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,290评论 4 363
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,399评论 1 294
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,021评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,034评论 0 207
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,412评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,651评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,902评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,605评论 0 199
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,339评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,586评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,076评论 1 261
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,400评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,060评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,083评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,851评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,685评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,595评论 2 270

推荐阅读更多精彩内容