UnityShader（四）一个最简单的顶点/片元着色器

目录

顶点/片元着色器的基本结构：

简单的例子

增加模型数据

顶点着色器和片元着色器之间的通信

---

顶点/片元着色器的基本结构：

Shader "MyShaderName"{
    Properties{
        //属性
    }
    SubShader{
        //针对显卡A的SubShader
        Pass{
            //设置渲染状态和标签

            //开始Cg代码片段
            CGPROGRAM
            //该代码片段的编译指令，例如：
            #pragma vertex vert
            #pragma fragment frag

            //Cg代码写在这里

            ENDCG
            
            //其他设置
        }
        //其他需要的Pass
    }
    SubShader{
      //针对显卡B的SubShader
    }

    Fallback "VertexLit"
}

它包含了Shader、Properties、SubShader、Fallback等语义块。

其中最重要的部分就是Pass语义块，绝大部分的代码都是写在这个语义块中的。

简单的例子

Unity版本2021.3.12

创建一个新的场景，去除天空盒（菜单栏中，选择Window->Rendering->Lighting->-Environment>SkyboxMaterial，把该项设置为空）

创建一个UnityShader【Unlit Shader】并取名SimpleShader

创建一个材质并重命名为SimpleShaderMat，赋予SimpleShader

创建一个球体并将SimpleShaderMat材质赋给它

打开SimpleShader并删除所以代码，编写以下代码

Shader "Unity Shaders Book/Simple Shader"{
    SubShader{
        Pass{
            CGPROGRAM

            #pragma vertex vert
            #pragma fragment frag

            float4 vert(float4 v: POSITION):SV_POSITION{
                return mul(UNITY_MATRIX_MVP,v);
            }

            float4 frag():SV_Target{
                return fixed4(1.0,1.0,1.0,1.0);
            }
            
            ENDCG
        }
    }
}

效果：

代码解释：

在第一行通过Shader语义定义了这个Shader的名字，保持良好的命名习惯可以帮助我们在为材质球选择Shader时快速找到自定义的Shader。

需要注意的是我们并没有使用Properties语义，因为这不是必需的。

然后我们声明了SubShader和Pass语义块，在这个例子中我们不需要进行任何渲染设置和标签设置，因此SubShader将使用默认的渲染设置和标签设置。在SubShader中我们定义了一个Pass，这个Pass里我们同样没有设置任何的渲染设置和标签设置。

接着就是CGPROGRAM和ENDCG所包围的CG代码，这里有两个非常重要的编译指令：

#pragma vertex vert

#pragma fragment frag

它们将告诉Unity哪个函数包含了顶点着色器的代码，哪个函数包含了片元着色器的代码。

通用的编译指令如下：

#pragma vertex name

#pragma fragment name

其中name就是我们指定的函数名，这个函数名不一定是vert和frag，它们可以是任意自定义的函数名（一般我们使用vert和frag这两个函数名，因为它们很直观，但这不是必须的)

我们看一下vert函数的定义：

    float4 vert ( float4 v: POSITION ):SV_POSITION {
                return UnityObjectToClipPos(v);
            }

这是我们在这个例子中使用的顶点着色器代码，它是逐顶点执行的。vert函数的输入v包含了这个顶点的位置，这是我们通过POSITION语义指定的。它的返回值是一个float4类型的变量，它是该顶点在裁剪空间中的位置，POSITION和SV_POSITION都是Cg/HLSL中的语义。

在这个例子中，POSITION将告诉Unity把模型的顶点坐标填充到输入v中，SV_POSITION将告诉Unity顶点着色器的输出是裁剪空间中的顶点坐标。

如果没有这些语义来限定输入和输出参数，渲染器就完全不知道用户的输入和输出是什么，就会得到错误的效果。

顶点着色器只包含了一行代码，这一步就是把顶点坐标从模型空间转换到裁剪空间中，UNITY_MATRIX_MVP矩阵是Unity内置的模型.观察.投影矩阵。

我们再看一下frag函数的定义：

   float4 frag():SV_Target{
                return fixed4(1.0,1.0,1.0,1.0);
            }

在这个例子中，frag函数没有任何的输入，它的输出是一个float4类型的变量，并且使用了SV_Target语义进行限定。

SV_Target是HLSL中的一个系统语义，等同于告诉渲染器，把用户的输出颜色存储到一个渲染目标中，这里将输出到默认的帧缓存中。

片元着色器返回一个表示白色的fixed4类型的变量，片元着色器输出的颜色的每个分量范围在[0,1]，其中（0，0，0）表示黑色，（1，1，1）表示白色。

注：

编写完代码后，高版本会出现警告和以下修改建议，会自动修改可不管，代码会自动修改成UnityObjectToClipPos（*）的格式

// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)'

增加模型数据

模型数据从哪里来的？

在上面的例子中，顶点着色器我们使用了POSITION语义得到了模型的顶点位置，如果需要增加更多的模型数据该如何操作呢？

比如现在我们想要得到模型上每个顶点的纹理坐标和法线方向（这个需求很常见，我们需要使用纹理坐标来访问纹理，法线可以用来计算光照），我们可以使用一个结构体来重新定义我们的输入参数v。

修改代码如下：

Shader "Unity Shaders Book/Simple Shader"{
    SubShader{
        Pass{
            CGPROGRAM

            #pragma vertex vert
            #pragma fragment frag

            //使用一个结构体来定义顶点着色器的输入
            struct a2v{
                //POSITION语义告诉Unity用模型空间的顶点坐标填充vertex变量
                float4 vertex:POSITION;
                //NORMAL语义告诉Unity用模型空间的法线方向填充normal变量
                float3 normal:NORMAL;
                //TEXCOORF0语义告诉Unity用模型的第一套纹理坐标填充texcoord变量
                float4 texcoord:TEXCOORD0;
            };

            float4 vert(a2v v: POSITION):SV_POSITION{
                return mul (UNITY_MATRIX_MVP,v.vertex);
            }

            float4 frag():SV_Target{
                return fixed4(1.0,1.0,1.0,1.0);
            }
            
            ENDCG
        }
    }
}

在上面的代码中我们声明了一个新的结构体av2，它包含了顶点着色器所需要的模型数据。

在结构体中我们用到了其他的Unity支持的语义，当它们作为顶点着色器的输入时都是有特定含义的，因为Unity会根据这些语义来填充这个结构体，对于顶点着色器的输入，Unity支持的语义有：POSITION，TANGENT，NORMAL，TEXCOORD0，TEXCOORD1，TEXCOORD2，TEXCOORD3，COLOR等。

为了创建一个新的结构体，必须使用下面的格式定义它：

struct StructName{

        Type Name:Semantic;

        Type Name:Semantic;

        ......

};

其中Semantic（语义）是不能够省略的。

在上面的代码中我们还修改了vert函数的输入参数类型，通过修改为我们自定义的结构体类型我们就可以在顶点着色器中访问模型数据了。

（扩展阅读：填充到POSITION，NORMAL，这些语义中的数据是由使用了该材质的Mesh Render组件提供的。在每帧调用Draw Call时，Mesh Render组件会把它负责渲染的模型数据发送个UnityShader。一个模型通常包含了一组三角面片，每个三角面片由三个顶点构成，而每个顶点又包含了一些数据【比如顶点位置，法线，切线，纹理坐标，顶点颜色等】） 

顶点着色器和片元着色器之间的通信

在实践中，我们往往希望从顶点着色器输出一些数据（比如模型的法线，纹理坐标等）传递给片元着色器，这就涉及到顶点着色器和片元着色器之间的通信。

为此我们需要定义一个新的结构体，修改代码如下：

Shader "Unity Shaders Book/Simple Shader"{
    SubShader{
        Pass{
            CGPROGRAM

            #pragma vertex vert
            #pragma fragment frag

                        //使用一个结构体来定义顶点着色器的输入
            struct a2v {
                //POSITION语义告诉Unity用模型空间的顶点坐标填充vertex变量
                float4 vertex:POSITION;
                //NORMAL语义告诉Unity用模型空间的法线方向填充normal变量
                float3 normal:NORMAL;
                //TEXCOORF0语义告诉Unity用模型的第一套纹理坐标填充texcoord变量
                float4 texcoord:TEXCOORD0;
            };

            //使用一个结构体来定义顶点着色器的输入
            struct v2f{
            //SV_POSITION语义告诉Unity，pos里包含了顶点在裁剪空间中的位置信息
            float4 pos:SV_POSITION;
            //COLOR0语义可以用于存储颜色信息
            fixed3 color:COLOR0;
            };

            v2f vert(a2v v){
            //声明输出结构
                v2f o;
                o.pos=mul(UNITY_MATRIX_MVP,v.vertex);
            //v.normal包含了顶点的法线方向，其分量范围在【-1.0，1.0】
            //下面的代码把分量范围映射到了[0.0,1.0]
            //存储到o.color中传递给片元着色器
               o.color=v.normal*0.5+fixed3(0.5,0.5,0.5);
               return o;

            }

            float4 frag(v2f i):SV_Target{
            //将插值后的i.color显示到屏幕上
                return fixed4(i.color,1.0);
            }
            
            ENDCG
        }
    }
    }

效果如下：

代码解释：

上面代码中我们声明了一个新的结构体v2f，用于在顶点着色器和片元着色器之间传递信息。同样结构体v2f也需要指定每个变量的语义。我们使用了SV_POSITION和COLOR0语义。

顶点着色器的输出结构中，必须包含一个变量，它的语义时SV_POSITION，否则渲染器将无法得到裁剪空间中的顶点坐标，也就无法将顶点渲染到屏幕上。COLOR0语义中的数据可以由用户自行定义，但一般都是存储颜色（例如逐顶点的漫反射颜色或者逐顶点的高光反射颜色）。

需要注意的是，顶点着色器时逐顶点调用，而片元着色器是逐片元调用，片元着色器中的输入实际上是把顶点着色器的输出进行插值后得到的结果。