欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Unity Shader实现素描风格的渲染

程序员文章站 2022-05-14 22:16:06
本文实例为大家分享了unity shader实现素描风格的具体代码,供大家参考,具体内容如下原理使用6张素描纹理进行渲染,在渲染阶段,在顶点着色阶段计算逐顶点的光照,根据光照结果决定6张纹理的混合权重...

本文实例为大家分享了unity shader实现素描风格的具体代码,供大家参考,具体内容如下

原理

使用6张素描纹理进行渲染,在渲染阶段,在顶点着色阶段计算逐顶点的光照,根据光照结果决定6张纹理的混合权重,并传递给片元着色器。在片元着色器中根据这些权重来混合6张纹理的采样结果

shader实现

shader "hatching" 
{
 properties {
 _color ("color tint", color) = (1, 1, 1, 1)//颜色
 _tilefactor ("tile factor", float) = 1//纹理的平铺系数,数值越大素描线条越密
 _outline ("outline", range(0, 1)) = 0.1
 _hatch0 ("hatch 0", 2d) = "white" {}
 _hatch1 ("hatch 1", 2d) = "white" {}
 _hatch2 ("hatch 2", 2d) = "white" {}
 _hatch3 ("hatch 3", 2d) = "white" {}
 _hatch4 ("hatch 4", 2d) = "white" {}
 _hatch5 ("hatch 5", 2d) = "white" {}//对应的6张素描纹理
 }
 
 subshader {
 tags { "rendertype"="opaque" "queue"="geometry"}
 
 
 pass {
 tags { "lightmode"="forwardbase" }
 
 cgprogram
 
 #pragma vertex vert
 #pragma fragment frag 
 
 #pragma multi_compile_fwdbase
 
 #include "unitycg.cginc"
 #include "lighting.cginc"
 #include "autolight.cginc"
 #include "unityshadervariables.cginc"
 
 fixed4 _color;
 float _tilefactor;
 sampler2d _hatch0;
 sampler2d _hatch1;
 sampler2d _hatch2;
 sampler2d _hatch3;
 sampler2d _hatch4;
 sampler2d _hatch5;
 
 struct a2v {
 float4 vertex : position;
 float4 tangent : tangent; 
 float3 normal : normal; 
 float2 texcoord : texcoord0; 
 };
 
 struct v2f {
 float4 pos : sv_position;
 float2 uv : texcoord0;
 fixed3 hatchweights0 : texcoord1;//
 fixed3 hatchweights1 : texcoord2;// 6个混合权重,存在两个fixed3变量中
 float3 worldpos : texcoord3;
 shadow_coords(4)
 };
 
 v2f vert(a2v v) {
 v2f o;
 
 o.pos = unityobjecttoclippos(v.vertex);
 
 o.uv = v.texcoord.xy * _tilefactor;
 
 fixed3 worldlightdir = normalize(worldspacelightdir(v.vertex));
 fixed3 worldnormal = unityobjecttoworldnormal(v.normal);
 fixed diff = max(0, dot(worldlightdir, worldnormal));//漫反射系数
 
 o.hatchweights0 = fixed3(0, 0, 0);
 o.hatchweights1 = fixed3(0, 0, 0);
 
 float hatchfactor = diff * 7.0;//把diff缩放到[0,7]范围
 
 //纯白
 if (hatchfactor > 6.0) 
 {
 
 } else if (hatchfactor > 5.0) {
  o.hatchweights0.x = hatchfactor - 5.0;
 } else if (hatchfactor > 4.0) {
  o.hatchweights0.x = hatchfactor - 4.0;
  o.hatchweights0.y = 1.0 - o.hatchweights0.x;
 } else if (hatchfactor > 3.0) {
  o.hatchweights0.y = hatchfactor - 3.0;
  o.hatchweights0.z = 1.0 - o.hatchweights0.y;
 } else if (hatchfactor > 2.0) {
  o.hatchweights0.z = hatchfactor - 2.0;
  o.hatchweights1.x = 1.0 - o.hatchweights0.z;
 } else if (hatchfactor > 1.0) {
  o.hatchweights1.x = hatchfactor - 1.0;
  o.hatchweights1.y = 1.0 - o.hatchweights1.x;
 } else {
  o.hatchweights1.y = hatchfactor;
  o.hatchweights1.z = 1.0 - o.hatchweights1.y;
 }
 
 o.worldpos = mul(unity_objecttoworld, v.vertex).xyz;
 
 transfer_shadow(o);
 
 return o; 
 }
 
 fixed4 frag(v2f i) : sv_target 
 { //根据相应的权重进行采样
 fixed4 hatchtex0 = tex2d(_hatch0, i.uv) * i.hatchweights0.x;
 fixed4 hatchtex1 = tex2d(_hatch1, i.uv) * i.hatchweights0.y;
 fixed4 hatchtex2 = tex2d(_hatch2, i.uv) * i.hatchweights0.z;
 fixed4 hatchtex3 = tex2d(_hatch3, i.uv) * i.hatchweights1.x;
 fixed4 hatchtex4 = tex2d(_hatch4, i.uv) * i.hatchweights1.y;
 fixed4 hatchtex5 = tex2d(_hatch5, i.uv) * i.hatchweights1.z;
 fixed4 whitecolor = fixed4(1, 1, 1, 1) * (1 - i.hatchweights0.x - i.hatchweights0.y - i.hatchweights0.z - 
  i.hatchweights1.x - i.hatchweights1.y - i.hatchweights1.z);
 
 fixed4 hatchcolor = hatchtex0 + hatchtex1 + hatchtex2 + hatchtex3 + hatchtex4 + hatchtex5 + whitecolor;
 
 unity_light_attenuation(atten, i, i.worldpos);
  
 return fixed4(hatchcolor.rgb * _color.rgb * atten, 1.0);
 }
 
 endcg
 }
 }
 fallback "diffuse"
}

效果如下:

Unity Shader实现素描风格的渲染

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。