其实上一篇文章,我是按照Shader1.0版本来基本流程和操作来讲解的,大概内容就是以Shader1.0的基础上,也就是fixed shader的基础上进行的渲染流程分析。接下里的部分我们开始shader2.0的讲解,固定管线渲染肯定是被淘汰掉了。而且Vertex and Fragment Shader更加常见一点。
Shader1.0和Shader2.0的区别:shader1.0称为固定管线渲染,顾名思义,就是固定这两个字,比如材质球中的灯光只能简单的乘法,而不能改变计算公式,但是Shder2.0就可以,也就是说Shder2.0可以实现个性化编辑,实现特定的计算顶点、像素灯光等计算方法。只是Shader1.0和Shader2.0都是遵循渲染管线的流程,这是计算机的工作流程,是不改变的方式。当然,两种shader的脚本格式和书写方式肯定是有区别,这里对于格式不在累述。后面一些代码案例当中会有体现。
还是在unity中Create一个顶点和片面着色器,进行一些代码备注
Shader2.0顶点着色器:
1、计算顶点的位置变换 2、计算顶点的颜色
规律:3D变换首先都是将物体坐标系变换到世界坐标系
位置变换Unity3d里面 矩阵是左乘:
1、将物体坐标系 变换到世界坐标系 P(世界)= M(物体到世界的)*P(物体)
2、将世界坐标变换到相机坐标 P(相机)= M(世界到相机的)*P(世界)
M ------ 物体坐标系变换到世界坐标系
V ------ 世界坐标变换到相机坐标
P ----- 将3D坐标系转换到屏幕2D坐标系(屏幕显示)
案例分析:
顶点坐标的偏移 y = Asin(wx+z)
z:决定波形与X轴位置关系或横向移动距离(左加右减)
w:决定周期(最小正周期 T = 2pi/|w|)
A: 决定峰值(即纵向拉伸压缩的倍数)
顶点坐标变换
Shader2.0片段着色器:
1、纹理寻址 2、灯光作用
纹理寻址就涉及到UV:根据笛卡尔坐标系,UV的取值是(0,1)
如果图片的Wrap mode模式设置成Repeat模式,且有一下代码
出现效果
出现图片滚动的效果
注意Wrap Mode中Repeat和Clamp的区别
Clamp;表示UV坐标超过1,永远取1这个值,UV坐标小于0,永远取0这个值
Repeat:表示UV坐标超过1,折重新开始从0开始取值,反复进行这样的操作。
风车旋转案例:纹理旋转(其实就是UV旋转)
旋转策略:采用矩阵的方式
具体步骤:1、在做任何矩阵旋转的时候,需要把物体的中心设置到原点处
2、实现旋转
3、把物体平移到原来的位置
具体代码如下:
实现效果:(应该上gif图的,但是没有,抱歉)
以上就是Vertex and Fragment Shader的基础,进行了一些简单案例的讲解。可能后续会补两个案例。
描边效果的实现OutLine
实现这个有两种方式:第一种方式就是两个pass通道大的是轮廓,直接返回一个颜色。第二种方式是直接找到边缘。我们通过法线的计算,物体越是边缘,法线和视线的夹角越大。
具体实现步骤:渲染一个物体
1,找到边缘 2、给边缘着色 3、非边缘地带正常采样
我们用第一种方式进行实现:
以上是求取边缘的,第二个pass通道我们进行正常计算,但是
ZTest Always检测通道要打开。
效果如下:
Cube在贴取纹理的情况下,外边框显示红色。
其实这样表现效果还是挺费的。