庄懂的TA笔记（十二）＜Dota2实现思路，混合实践＞

思路，混合实践＞"/>

庄懂的TA笔记（十二）＜Dota2实现思路，混合实践＞

庄懂的TA笔记（十二）＜Dota2实现思路，混合实践＞

一、作业展示，答疑：

1、作业：

2、答疑：

二、作业示范，分析：

1、文档分析：

2、资源分析：

3、资源优化：

4、光照模型分析：

镜面反射 = (主光Phong)+(环境Cubemap+fresnelSpecWarp) + Attenuation自阴影；

漫反射 =（主光HalfLambert+WarpTex/Lambert）+（环境3CutCol）+ AO；

问：为什么这里要从 镜面反射，和漫反射入手，而不是和OldSchoolPro一样从环境光，和 主光去分支，和分析？

答：1、因为对漫反射和镜面反射的颜色做了处理，所以需要先分出 镜面反射，和漫反射。

疑问处：(什么颜色效果？，这里后文代码中展示)

引用第十课PPT中 OldSchoolPro 实现的 脑图

对漫反射的处理：

金属部分的漫反射，压黑（金属的是金属本色，非金属的是白色，灰色），所以这里是通过染色后的黑白灰Mask贴图，对镜面反射做lerp处理lerp（金属参数，非金属参数，Mask贴图）。

对镜面反射的处理：

通过灰的图片lerp.

三、作业示范，准备工作：

准备1：

准备2：

准备3：

1、这里我们需要主备好5个 向量：

1、nDirWS = 法线方向 向量

2、vDirWS = 视方向 向量

3、vrDirWS = 视方向的反射 向量

4、lDirWS = 灯光方向 向量

5、lrDirWS = 灯光方向的反射 向量

2、三个点积结果、中间量：

1、ndotl = Lambert

2、ndoth = phong

3、ndotv = Fresnel

4、vdotlr = phong 的高光 (视方向的灯光反射) ？？

准备4：

PS: CubeMap 的UV是==float4. 四维向量

texCubelod(_CubeMap , float4(vrDirWS,lerp(8,0,var_MaskTex.a))).rgb;

CubeMap四维UV中,前三维是RGB色彩，A控制清晰模糊度.(数值越大越光滑，越小越粗糙).

这里通过var_MaskTex中a通道的高光次幂，进行lerp插值变化处理。

四、作业示范，光照模型：

1、DiffCol Specol:

1、这里的diffCol 的意思为：

基础色 和 0 0 0 (黑)，通过 金属度 贴图，进行贴图中，金属区域的 区分。

漫反射与金属区域

2、这里的specCol 的意思为：

基础图 和 (0.3，0.3，0.3)灰，通过反射图 的 黑白灰 进行 反射区域高亮区分，

反射区域和非反射区域

3、specCol * specInt = 高光色彩图：

基础镜面反射 * var_Mask.r = 高光颜色图

高光颜色图

PS：这里学习 得到一个 通识 ：

你可以吧你提取出的任何贴图下任何贴图信息，贴图通道信息，与 任何 贴图信息，通道信息，相，加 减 乘 除 ，这是灵活自主 开发的重要认识。

Diffus 与 baseCol 实际上是 有 区别的。

Diffuse 与 金属属性相关，会暗一些。

baseCol 与兰伯特相关，并不会很暗。

2、Fresnel:

这里的解释为，先吧fresnel贴图用 金属度贴图，lerp了，然后在分别取R，G，B通道下的ramp图(也就是 渐变长度图 )，这样就不用每个都lerp一遍了。

FrisnelWarp (下列三个元素，本质上是 菲涅尔 通过 Warp 弥散三个状态)

fresnelCol = R : 菲涅尔弥散 这里 无实际用途

fresnelRim = G : 菲涅尔边缘

fresnelSpec = B : 菲涅尔反射

3、DirDiff`主光漫反射：

这里意为，声明一个可调节的面板主灯光色，然后通过rampTex 或 var_DiffWarpTex这个图(参数给个halfLambert的uv)，主光漫反射 = diffCol漫反射色彩 * rampTex渐变图 *_LightCol光色彩混合出主光漫反射。

4、DirSpec`主光镜面反射：

5、EnvDiff`环境漫反射：

6、EnvSpec`环境镜面反射：

7、RimLight`轮廓光：

//轮廓光(菲涅尔) ndirWS： R:左右 G:上下 B:前后

这里如果_RimCol定义为[HDR]则，可以少一个滑条，不乘 _RimInt。

float3 rimLight = _RimCol * fresnelRim * rimInt * max(0,ndirWS.g)*_RimInt;

8、Emission`自发光：

9、最终混合：

五、透明剪切 + 双面显示

1、透明剪切：

2、透明剪切投影修正：

3、双面显示：

4、效果完成：

示例代码模板：

Shader "Unlit/Sc012Dota02"
{Properties{//1、_MainTex            RGB:颜色贴图   A:透贴遮罩//2、_NormalTex          RGB:法线贴图//3、_MateInessMaskTex   RGB:金属度贴图遮罩//4、_MaskTex            R:高光强度 G:边缘光强度 B:高光染色 A:高光次幂//5、_FresnelWarpMask    R:漫反射Warp G:边缘Warp B:高光次幂warp   (本质上是菲涅尔的 三种通过Warp 弥散方式)//6、_DiffWarpTex        RGB:皮肤渐变图（次表面散射图）//7、_EmissionTex        RGB:自发光贴图遮罩//8、_CubeTex            RGB:天空盒贴图_MainTex ("MainCol RGB:主色图 A:透贴", 2D) = "white" {}_NormalTex("Normal 法线图",2D)="bump"{}_MateInessTex("Mateiness RGB:金属度贴图",2D)="black"{}_SpecMaskTex("MaskTex R:高光强度 G:边缘光强度 B:高光染色 A:高光次幂",2D)="white"{}_FresnelWarpTex("FresnelWarp R:漫反射Warp G:边缘Warp B:高光次幂warp",2D)="gray"{}_DiffWarpTex("DiffWarp RGB:皮肤渐变图（次表面散射图）",2D)="gray"{}_EmissionTex("Emission RGB:自发光贴图遮罩",2D)="black"{}_CubeTex("SkyBox天空盒",cube)="_Skybox"{}_SpecularPow("高光次幂",Range(0,90))=30_LightCol("灯光色彩",color)=(1,1,1,1)_SpecInt("高光强度",Range(0,90))=1_SpecPow("高光次幂",Range(0,90))=1_EvnCol("环境光色彩",color)=(1,1,1,1)_EvnSpecInt("环境反射强度",Range(0,90))=1[HDR]_RimCol("边缘色彩",color)=(1,1,1,1)_EmitInt("自发光强度",Range(0,10))=1[HideInInspector]_Cutoff("透明裁切",Range(0,1))=0.5}SubShader{Tags { "RenderType"="Opaque" }LOD 100Pass {Name "FORWARD"Tags {"LightMode"="ForwardBase"}Cull Off    //双面显示CGPROGRAM#pragma vertex vert#pragma fragment frag#pragma multi_compile_instancing#include "UnityCG.cginc"#include "AutoLight.cginc"#include "Lighting.cginc"#pragma multi_compile_fwdbase_fullshadows#pragma target 3.0UNITY_INSTANCING_BUFFER_START( Props )// UNITY_DEFINE_INSTANCED_PROP( float4, _Color)UNITY_INSTANCING_BUFFER_END( Props )uniform sampler2D _MainTex;uniform sampler2D _NormalTex;uniform sampler2D _MateInessTex;uniform sampler2D _SpecMaskTex;uniform sampler2D _FresnelWarpTex;uniform sampler2D _DiffWarpTex;uniform sampler2D _EmissionTex;uniform samplerCUBE _CubeTex;uniform float _SpecularPow;uniform float3 _LightCol;uniform float _SpecInt;uniform float _SpecPow;uniform float3 _EvnCol;uniform float _EvnSpecInt;uniform float3 _RimCol;uniform float _EmitInt;uniform float _Cutoff;//输入结构struct VertexInput{float4 vertex : POSITION;float2 uv0 : TEXCOORD0;float4 normal : NORMAL;float4 tangent : TANGENT;};//顶点输出结构struct VertexOutput {float4 pos : SV_POSITION;float2 uv0 : TEXCOORD0;float3 posWS : TEXCOORD1;float3 nDirWS : TEXCOORD2;float3 tDirWS : TEXCOORD3;float3 bDirWS : TEXCOORD4;LIGHTING_COORDS(5,6)};//输出结构>>>顶点shader>>>输出结构VertexOutput vert (VertexInput v) {VertexOutput o = (VertexOutput)0;o.uv0 = v.uv0;o.pos = UnityObjectToClipPos(v.vertex);o.posWS = mul(unity_ObjectToWorld,v.vertex);o.nDirWS = UnityObjectToWorldNormal(v.normal);o.tDirWS = normalize(mul(unity_ObjectToWorld,float4(v.tangent.xyz,0)).xyz);o.bDirWS = normalize(cross(o.tDirWS,o.nDirWS)*v.tangent.w);TRANSFER_VERTEX_TO_FRAGMENT(o)return o ;}//色彩输出结构float4 frag(VertexOutput i) : COLOR {//1、向量准备float3 var_NormalTex = UnpackNormal(tex2D(_NormalTex,i.uv0)).rgb;float3x3 TBN = float3x3(i.tDirWS,i.bDirWS,i.nDirWS);float3 ndirWS = normalize(mul(var_NormalTex,TBN));float3 ldirWS = _WorldSpaceLightPos0.xyz;float3 vdirWS = normalize(_WorldSpaceCameraPos.xyz - i.posWS);float3 hdirWS = normalize(vdirWS + ldirWS);float3 vrdirWS = reflect(-vdirWS,ndirWS);float3 lrdirWS = reflect(-ldirWS,ndirWS);//2、点积结果float3 ndotl = dot(ndirWS,ldirWS);//lambertfloat3 ndoth = dot(ndirWS,hdirWS);//blinPhngfloat3 vdotr = dot(vdirWS,lrdirWS);//phongfloat3 ndotv = dot(ndirWS,vdirWS);//fresnelfloat lambert = max(0,ndotl);float blinPhong = pow(max(0,ndoth),_SpecularPow);//3、贴图采样float4 var_mainTex = tex2D(_MainTex,i.uv0);float var_mateinessTex = tex2D(_MateInessTex,i.uv0).r;float4 var_maskTex = tex2D(_SpecMaskTex,i.uv0);float3 var_fresnel = tex2D(_FresnelWarpTex,ndotv);float3 var_diffWarpTex = tex2D(_DiffWarpTex,float2(lambert,0.2));float var_emissTex = tex2D(_EmissionTex,i.uv0).r;float3 var_cubeTex = texCUBElod(_CubeTex,float4(vrdirWS,lerp(0,8,var_maskTex.a))).rgb;//信息提取//一、_MainTex//1、baseCol        = RGB:    颜色图//2、opacity        = A  :    透贴遮罩图 //二、NormalTex//3、Normal         = RGB:    法线贴图//三、_MateInessMaskTex   //4、_MatellicTex       = RGB:    金属度遮罩//四、_SpecMaskTex//5、specInt        = R  :    高光强度//6、specRimInt     = G  :    边缘光强度//7、specTint       = B  :    高光染色//8、specPow        = A  :    高光次幂//五、_FresnelWarpMask  (本质上菲涅尔 通过 Warp 弥散三个状态)//9、fresnelColDiff = R  :    菲涅尔弥散无实际用途 //10、fresnelRim    = G  :    菲涅尔边缘//11、fresnelSpec   = B  :    菲涅尔次幂//六、_DiffWarpTex//12、diffCol       = RGB:    颜色Warp图 //七、_EmissionTex//13、EmissTex      = RGB:    自发光贴图//八、_CubeTex//14、cubeTex       = RGB:    环境球贴图//_MainTexfloat3 baseCol = var_mainTex.rgb;float  opacity = var_mainTex.a;//_MateInessMaskTexfloat3 matellic = var_mateinessTex;//_SpecMaskTexfloat specInt = var_maskTex.r;      //高光强度float specRimInt = var_maskTex.g;   //边缘光强度float specTint = var_maskTex.b;     //高光染色float specPow = var_maskTex.a;      //高光次幂//_FresnelWarpMaskfloat3 fresnel = lerp(var_fresnel,0,matellic);float fresnelColDiff = var_fresnel.r;//菲涅尔颜色  无实际用途float fresnelRim = var_fresnel.g;    //菲涅尔边缘float fresnelSpec = var_fresnel.b;   //菲涅尔反射//_DiffWarpTexfloat3 diffCol = lerp(baseCol,float3(0,0,0),matellic);//baseCol 继承了 DiffwarpTex//diffCol是=用matellic黑白图，来lerp 出 基础色(白) 和 金属(黑)的mask//_EmissionTexfloat emitInt = var_emissTex;//_CubeTexfloat3 evnCube = var_cubeTex;//Shadowfloat attenuation = LIGHT_ATTENUATION(i);//光照模型(直接光照)//光源漫反射float3 dirDiff = diffCol * var_diffWarpTex * _LightCol;//光源镜面反射float3 specCol = lerp(baseCol,float3(0.3,0.3,0.3),specTint)*specInt;float phong = pow(max(0.0,vdotr),specPow * _SpecPow);float spec = phong * lambert;spec = max(spec,fresnelSpec)*_SpecInt;float3 dirSpec = specCol * spec * _LightCol;//光照模型(环境光照)//环境漫反射float3 evnDiff = diffCol * _EvnCol;//环境镜面反射float  reflectInt = max(fresnelSpec,matellic)*specInt;float3 evnSpec = specCol * reflectInt * var_cubeTex * _EvnSpecInt;//轮廓光（菲涅尔）        ndirWS： R:左右   G:上下   B:前后float3 rimmLight = fresnelRim * max(0,ndirWS.g) * _RimCol * specRimInt;//自发光float3 emission = diffCol * emitInt * _EmitInt;//合并效果float3 finalRGB = (dirDiff + dirSpec)*attenuation + evnDiff+evnSpec + rimmLight+emission;//透明裁切clip(opacity-_Cutoff);//返回输出//return float4(1,1,1,1.0f);//输出最终颜色return float4(finalRGB,1.0f);//输出最终颜色//return attenuation;}ENDCG}}//FallBack "Diffuse"//裁切改善FallBack "Legacy Shader/Transparent/Cutout/VertexLit"
}

六、情报-开源shader来源：

1、SD,SP shader参考路径：

2、八猴 shader参考 路径：