Unity3d shader之卡通着色Toon Shading(unity shader lod)

编辑：rootadmin

推荐整理分享Unity3d shader之卡通着色Toon Shading(unity shader lod)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:unity3d的shader,unity shader lerp,unity shader discard,unity shader lerp,unity shader lod,unity shader discard,unity shader lab,unity shader cull off,内容如对您有帮助，希望把文章链接给更多的朋友！

卡通着色的目的是为了让被着色物体显得过渡的不那么好，明暗交界线很明显，等等卡通风&#;的一系列特征，

也叫Non-photorealisticrendering非真实渲染

重点要做到两点：

1. 描边

2. 着色

另：本片中cg函数均用绿色标明，想了解函数作用和函数内部构成请看这篇文章 NVIDIA CG语言函数之所有数学类函数(Mathematical Functions)

就从最初的描边开始

首先声明变量_Outline挤出描边的粗细_Factor挤出多远

我们的挤出操作在第一个pass中进行Cull Front 裁剪了物体的前面（对着相机的），把背面挤出ZWrite On 像素的深度写入深度缓冲，如果关闭的话，物体与物体交叠处将不会被描边，因为此处无z&#;后渲染的物体会把此处挤出的描边“盖住”在处理顶点的函数vert中把点挤出dir=normalize(v.vertex.xyz);建立一个float3方向变量dir把该点的位置作为距离几何中心的方向的单位向量float3 dir2=v.normal;建立一个float3方向变量dirdir2为法线方向D=dot(dir,dir2);D为计算该点位置朝向和法线方向的点积，通过正负&#;可以确定是指向还是背离几何中心的，正为背离，负为指向dir=dir*sign(D);乘上正负&#;，真正的方向&#;dir=dir*_Factor&#;dir2*(1-_Factor);把该点位置朝向与法线方向按外部变量_Factor的比重混合，来控制挤出多远v.vertex.xyz&#;=dir*_Outline;把物体背面的点向外挤出顶点函数结束，接下来为描边上色在frag函数中挤出轮廓的颜色，此处颜色随意

效果如下：

清楚地描出了轮廓，可以在材质中改变_Outline的&#;来改变粗细

描边shader如下：

开始卡通着色旅程

描边之后就是重头戏着色了

简单的举几个例子

说明一下卡通着色

把diffuse漫反射颜色变成了很明显的几个色阶（本例为四个）

普通的diffuse漫反射龙，没有色阶层，颜色过渡的很好，没有卡通的感觉

普通的漫反射材质

上图的可爱的大河酱就是由二阶颜色着色而成，再加上边缘黑色的描边，这个是真正的卡通，不是渲染出来的= =

《深渊传说》是传说系列的早期作品之一，用的也是卡通渲染

感觉大部分都是卡通式纹理贴图在出力

《仙乐传说》的战斗结束画面

有明显的明暗交界线（两个色阶），并随摄像头（view direction）的变化而变化，人物有明显的描边处理，卡通着色起了很大作用

《无尽传说2》，是传说系列比较近的作品，画面明显比前做好了许多，但万变不离其宗，还是用的卡通着色，（= =没玩过这作）

Unity3d shader之卡通着色Toon Shading(unity shader lod)

人物有着明显的描边处理

另外我感觉泛光的效果很好啊，应该是bloom或者是hdr之类的，跑题了= =

开始动手操刀卡通着色

第一个pass就是上面的描边pass对漫反射的卡通着色在第二个pass中先声明变量_Color物体的颜色_Outline挤出描边的粗细_Factor挤出多远_ToonEffect卡通化程度（二次元与三次元的交界线）_Steps色阶层数

卡通着色主要在着色函数frag中进行float diff=max(0,dot(N,i.lightDir));求出正常的漫反射颜色

diff=(diff&#;1)/2;做亮化处理

&#;diff=smoothstep(0,1,diff);使颜色平滑的在[0,1]范围之内

&#;float toon=floor(diff*_Steps)/_Steps;把颜色做离散化处理，把diffuse颜色限制在_Steps种（_Steps阶颜色），简化颜色，这样的处理使色阶间能平滑的显示

diff=lerp(diff,toon,_ToonEffect);根据外部我们可控的卡通化程度&#;_ToonEffect，调节卡通与现实的比重

c=_Color*_LightColor0*(diff);把最终颜色混合第二个pass结束，

第三个pass就是在第二个pass的基础之上加上离散化的高光建立float变量dist为求出距离光源的距离floatfloat atten=1/(dist);根据距光源的距离求出衰减；漫反射部分与第二个pass相同；half3 h = normalize (lightDir &#; viewDir);求出半角向量float nh = max (0, dot (N, h));float spec = pow (nh, .0);求出正常情况下的高光强度&#;float toonSpec=floor(spec*atten*2)/ 2;把高光也离散化&#;spec=lerp(spec,toonSpec,_ToonEffect);调节卡通与现实高光的比重就可以得到这种卡通效果：

shader如下：

这样已经能做出很好的卡通效果了，各位可以在此基础上研制加强版

加强版1：

加上了边缘光Rim

漂亮的水蓝色星球（= =；纹理）

就是在第二个pass中加上rim&#;添加的外部变量; _RimPower边缘光亮度程度 _ToonRimStep边缘光色阶数在frag函数中float rim = 1.0 - saturate(dot(N,normalize (viewDir)));求出正常的边缘光程度rim = rim&#;1;使之加亮 rim = pow(rim, _RimPower);外部变量_RimPower控制边缘光亮度大小 float toonRim = floor(rim * _ToonRimStep) / _ToonRimStep;再对边缘光进行离散化 rim = lerp(rim, toonRim, _ToonEffect);调节卡通与现实的比重 c=_Color*_LightColor0*(diff) * rim * mc*2;

进行最终颜色混合

活在三次元世界的3d布料和活在二次元世界的3d布料

加强版2：

带纹理贴图版

加强版3：

带纹理贴图Rim版

带纹理贴图Rim版变种

不建议把纹理贴图也离散化，效果实在是不好，= =；

接下来就有待各位看官们继续开发了，有什么更好的效果一定要告诉我

-----------------------by

unity手游<少侠历险记>（2）人物攻击动画判定和怪物AI 前言本文由作者@zx一路飞奔出品，转载请注明出处文章地址：

Unity3D 属性类（Attribute）整理（待续） ContextMenu用法：[ContextMenu(Hello)]voidHello(){Debug.Log(ThisistestforContextMenu);}用处：使用当前脚本时候可以用右键菜单触发开发环境中运行的函数---------------------

刨根问底U3D---Mono的配置 Mono是什么Mono是Unity3D的内置脚本编辑器,在Win上面可以用VS替代不过Mac上只能老老实实的用这个了.编辑器属性调整修改代码外观Preferences-SyntaxHighlighting-Obl

标签: unity shader lod

本文链接地址:https://www.jiuchutong.com/biancheng/378830.html 转载请保留说明！

上一篇：NGUI(n归档是什么软件)

下一篇：unity手游<少侠历险记>（2）人物攻击动画判定和怪物AI(unity 游戏)