图形绘制基础

前言

本文介绍的是在Unity中绘制图形的相关知识, 并介绍了OpenGL的图形渲染管线流程, 并总结了几个初学者常见的问题.

---

Unity中绘制一个简单的三角形

只需要以下步骤:

1. 新建VertexHelper, 生成一个顶点缓冲对象
2. VertexHelper.AddVertr往缓冲内添加顶点数据
3. VertexHelper.AddTriangle往缓冲内添加三角形顶点索引数据
4. 新建一个Mesh, 使用VertexHelper.FillMesh填充
5. 将Mesh指定到MeshFilter中

以下是相关概念的介绍:

Mesh

• 继承自Object的类, 它允许从脚本创建或修改网格. 网格包含顶点数组和多个三角形数组。
• 顶点数组:
  • 每个顶点最多有四种顶点数据: 顶点坐标, 两个纹理坐标, 法线, 切线;
  • 每种顶点数据都存储在相同大小的单独数组中
• 三角形顶点索引数组中指定了每个三角形的顶点绘制顺序
• 注意: 三角形的顶点顺序, 顺时针表示正面，逆时针表示背面，而Unity在渲染时默认只渲染正面，背面是看不见的

VertexHelper.AddVert

• 可以添加一个顶点对象到缓存中
• 方法签名为:
  • public void AddVert(Vector3 position, Color32 color, Vector2 uv0, Vector2 uv1, Vector3 normal, Vector4 tangent);
  • public void AddVert(Vector3 position, Color32 color, Vector2 uv0);
  • public void AddVert(UIVertex v);

VertexHelper.AddTriangle

• 添加一个三角形到缓冲中, 指定了顶点数组中顶点的渲染顺序
• 方法签名:
  • public void AddTriangle(int idx0, int idx1, int idx2);

VertexHelper.FillMesh

• 将流数据(就是之前添加的顶点数组和三角形数组)填充到指定的网格
• 方法签名:
  • public void FillMesh(Mesh mesh);

---

在OpenGL学习网站中, [你好, 三角形]这一篇, 详细介绍了使用OpenGL绘制一个三角形所需的知识点和步骤. 以下是相关知识点的提取和总结:

图形渲染管线的流程

图形渲染管线接受一组3D坐标，然后把它们转变为你屏幕上的有色2D像素输出。图形渲染管线可以被划分为几个阶段，每个阶段将会把前一个阶段的输出作为输入。

抽象展示为

具体流程为:

输入:

• 一组3D坐标以数组的形式传递3D坐标. 这个数组叫做顶点数据(Vertex Data)
• 顶点数据是一系列顶点的集合。一个顶点(Vertex)是一个3D坐标的数据的集合。
• 顶点数据是用顶点属性(Vertex Attribute)表示的

顶点着色器(Vertex Shader)

• 它把一个单独的顶点作为输入
• 顶点着色器主要的目的是把3D坐标转为另一种3D坐标
• 允许我们对顶点属性进行一些基本处理

图元装配(Primitive Assembly)

• 将顶点着色器输出的所有顶点作为输入, 并所有的点装配成指定图元的形状, 比如一个三角形

几何着色器(Geometry Shader)

• 几何着色器把图元形式的一系列顶点的集合作为输入，它可以通过产生新顶点构造出新的（或是其它的）图元来生成其他形状
• 几何着色器将决定输出的图元类型和个数

光栅化阶段(Rasterization Stage)

• 把图元映射为最终屏幕上相应的像素，生成供片段着色器使用的片段(Fragment)

片段着色器(Fragment Shader)

• 主要目的是计算一个像素的最终颜色
• 在片段着色器运行之前会执行裁切(Clipping)。裁切会丢弃超出你的视图以外的所有像素，用来提升执行效率
• 通常，片段着色器包含3D场景的数据（比如光照、阴影、光的颜色等等），这些数据可以被用来计算最终像素的颜色

测试混合阶段(Tests and Blending)

• 这个阶段检测片段的对应的深度值
• 检查alpha值并对物体进行混合(Blend)

---

常见问题:

顶点数据可以有什么? 作用是什么?

• 顶点坐标
• 顶点颜色
• 顶点对应的纹理坐标值
• 顶点法线
• 顶点的切线

啥作用咧?

可以用来计算光照, 常见的光照模型有冯氏光照模型(Phong Lighting Model)。冯氏光照模型的主要结构由3个分量组成：环境(Ambient)、漫反射(Diffuse)和镜面(Specular)光照

• 环境光照(Ambient Lighting)：模拟环境光照常量，它永远会给物体一些颜色。
• 漫反射光照(Diffuse Lighting)：模拟光源对物体的方向性影响(Directional Impact)。物体的某一部分越是正对着光源，它就会越亮。
• 镜面光照(Specular Lighting)：模拟有光泽物体上面出现的亮点

公式为:

参数说明:

• La 环境光强度(Ambient light intensity)
• Ka 材质环境光反射率 / 材质环境光反射系数(Ambient reflectivity)
• Ld 漫射光强度 / 散射光强度(Diffuse light intensity)
• Kd 材质漫反射率 /材质漫反射系数(Diffuse reflectivity)
• s 顶点 / 曲面点 到光源方向的单位向量(Direction from the surface point to the light source)
• n 顶点 / 曲面点 的法线单位向量(Normal vector at the surface point)
• Ls 镜面光强度 / 全反射光强度(Specular light intensity)
• Ks 材质镜面反射率 / 材质镜面反射系数(Specular reflectivity) r 完全反射向量( the vector of perfect reflection)
• v 顶点 / 曲面点 到摄像机方向的向量( the vector towards the viewer)
• f 镜面高光(specular highlights)，值范围在1到200之间，值越小，镜面亮点越大

在哪里实现光照模型呢?

• 在顶点着色器中实现的冯氏光照模型叫做Gouraud着色(Gouraud Shading)
• 在片段着色器中实现的冯氏光照模型叫做冯氏着色(Phong Shading)(计算基于每像素的与表面相交的法向量的插值过程)
• 关于Flat Shading， Gouraud Shading， Phong Shading的文章: Shading中的插值技术

如何计算顶点法线呢？

• 法向量是一个垂直于顶点表面的（单位）向量,
• 顶点法线可以由要计算的顶点所在的三角形的两条边的叉乘，求出垂直于该三角形所在平面的向量，再将之单位化，即为我们所求的顶点法线，当然，如果这个顶点同时在多个三角形上，要对各个三角形的法向量计算结果求均值。

更多

• ADS光照模型实例(GLSL实现)