shader 实现ps的叠加怎么实现lol 人物在草从的半隐效果

2492人阅读
Direct3D/OpenGL(50)
Shader(20)
模仿草的运动 & GPU(Pixel Shader & Vertex Shader)实现
&&&&&& 随着硬件的不断更新模仿草的运动不在需要循环播放一个重复的动画了,GPU的强大性能使得模仿更真实的草的运动得以实现。所以(^_^ )下面介绍做一模仿草的运动的Demo。
1.泰勒级数的定义:
&&&&&&&&&&&&&&&&&&& 图1:泰勒级数公式
&&&&&&&&&&&&&
2.&&& 泰勒级数在幂级数展开中的应用:
&&&&&&&&&&&&&&&&&&&&& 图2:泰勒级数在幂级数中的展开
3.&&& 波动:
&&&&&& 草的波浪起伏运动用一个Vertex Shader完成。草片纹理是一个四方行(如图2),草的渲染可以通过随机放置交叉的草片纹理。对草片纹理通过Alpha测试(Alpha Test)处理让草片纹理上面黑色部分象素不能通过。草的运动通过给草片纹理所贴的四边形上面两点混合四个正弦波(Sinusoidal),正弦波通过泰勒级数来逼近(泰勒级数如图1、泰勒级数展开如图2),用不同频率产生混合正弦波所形成的草的自然波就不像固定动画那样死板。
图2:草片纹理
&&&&&&&&&&&
4.&&& 光照模型
&&&&&& 草片纹理在风中飘动,它将会改变方向,随着太阳产生不同的颜色,面向太阳时草片的颜色比背向太阳时草片的颜色会亮一些。本例是通过一个草片纹理产生不同方向和位置的草片,所以不可能通过改变单个草片的光照来改变整个场景的草的颜色。而草片颜色的改变是发生在草片的运动过程中,所以可以通过正弦波来产生颜色,同一个正弦波根据光照方向可以产生两个颜色,通过改变绿通道的颜色使得草片颜色在微黄色和褐色之间变更(如图3、4)。
&&&&&&&&&&&&&&&&& 图3:面向太阳的微黄色的草
&&&&&&&&&&&&&&&&&&& 图4:背向太阳的褐色的草
1.& Vertex Shader
&Sinusoidal vertex motion for waving grass
&pos + sumOverI(wavedirI * texcoordy * sin( xdirI * (xpos+time)) + ydirI * (ypos+time)))
& v0 - Vertex Position
& v7 - Vertex Texture Data u,v
& c0 - commonConst ( 0.0, 0.5, 1.0, 2.0);
& c1 - appConst( time, 0.0, 0.0, 0.0);
& c4 - Composite World-View-Projection Matrix
& c8 - sin9 ( -1/3!, 1/5!, -1/7!, 1/9! )
&c10 - frcFixup ( 1.07, 0.0, 0.0, 0.0)
&c11 - waveDistortx ( 3.0, 0.4, 0.0, 0.3)
&c12 - waveDistorty ( 3.0, 0.4, 0.0, 0.3)
&c13 - waveDistortz ( -1.0, -0.133, -0.333, -0.10)
&c14 - waveDirx ( -0.006, -0.012, 0.024, 0.048)
&c15 - waveDiry ( -0.003, -0.006, -0.012, -0.048)
&c16 - waveSpeed ( 0.3, 0.6, 0.7, 1.4)
&c17 - piVector (4.0, pi/2, pi, pi*2)
&c18 - lightingWaveScale ( 0.35, 0.10, 0.10, 0.03);
&c19 - lightingScaleBias ( 0.6, 0.7, 0.2, 0.0);
// vs.2.x for grass
dcl_position v0
dcl_texcoord v7
mul r0, c14, v0.x&&&&& // use vertex pos x as inputs to sinusoidal warp
mad r0, c15, v0.y, r0& // use vertex pos y as inputs to sinusoidal warp
mov r1, c1.x&&&&&&&&&& // get current time
mad r0, r1, c16, r0&&& // add scaled time to move bumps according to speed
frc r0.xy, r0&&&&&&&&& // take frac of all 4 components
frc r1.xy, r0.zwzw&&&& //
mov r0.zw, r1.xyxy&&&& //
mul r0, r0, c10.x&&&&& // multiply by fixup factor (due to inaccuracy of taylor series)
sub r0, r0, c0.y&&&&&& // subtract 0.5
mul r1, r0, c17.w&&&&& // r0 *= 2pi coords range from(-pi to pi)
mul r2, r1, r1&&&&&&&& // (wave vec)^2
mul r3, r2, r1&&&&&&&& // (wave vec)^3
mul r5, r3, r2&&&&&&&& // (wave vec)^5
mul r7, r5, r2&&&&&&&& // (wave vec)^7
mul r9, r7, r2&&&&&&&& // (wave vec)^9
mad r0, r3, c8.x, r1&& // (wave vec) - ((wave vec)^3)/3!
mad r0, r5, c8.y, r0&& //& + ((wave vec)^5)/5!
mad r0, r7, c8.z, r0&& //& - ((wave vec)^7)/7!
mad r0, r9, c8.w, r0&& //& + ((wave vec)^9)/9!
dp4 r3.x,& r0, c11
dp4 r3.y,& r0, c12
dp4 r3.zw, r0, c13
sub r4, c0.z, v7.y
mul r4, r4, r4&&&&&&
mul r3, r3, r4&&&&&&&& // attenuate sinusoidal warping by (1-tex0.y)^2&
mov r2.w, v0
add r2.xyz, r3, v0&&&& // add sinusoidal warping to grass position
m4x4 oPos, r2, c4
dp4& r1.x, r0, c18&&&& // scale and add sin waves together
mad& oD0, c19.xzxz, -r1.x, c19.y
mov& oT0, v7&&&&&&&&&& // scale and bias color values (green is scaled more than red and blue)&&&&&&&&
此段代码是用于渲染地面,如用上面的代码,那么地面也会跟着波动。
// vs.2.x for ground
dcl_position v0
dcl_texcoord v7
m4x4 oPos, v0, c4
mov& oT0, v7
mov& r0, c20
add& oD0, r0, c21
2.& Pixel Shader
// ps.1.4 for grass
texld& r0, t0
mul_x2 r0, r0, v0
感觉现在ps.3.x都出来了(虽然我的机器不支持),而我还用ps.1.4有点落后了,所以今天用ps.2.x重写了ps的渲染代码。
// ps.2.x for grass
texld r0, t0, s0
mul r0, r0, v0
add r0, r0, r0
mov oC0, r0
本文来自CSDN博客,转载请标明出处:
参考知识库
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
访问:458999次
积分:5827
积分:5827
排名:第3647名
原创:91篇
转载:186篇
评论:61条
(3)(1)(1)(2)(3)(2)(1)(2)(1)(3)(6)(1)(1)(5)(1)(4)(5)(1)(2)(3)(3)(3)(4)(3)(2)(1)(2)(2)(3)(1)(3)(3)(2)(2)(3)(2)(1)(3)(1)(1)(2)(26)(6)(1)(1)(2)(4)(4)(7)(2)(17)(1)(5)(3)(3)(5)(2)(1)(1)(4)(1)(8)(80)Unity shader 官网文档全方位学习(一) - lol霖 - 博客园
摘要: 这篇文章主要介绍Surface Shaders基础及Examples详尽解析
What?? Shader,看起来好高级的样子,是的,这是Unity中高级进阶的必备。因此,兄弟我就在此记下我学习官网的一些心得。
此为一。主要介绍些Surface Shaders的知识。具体的大家也可去官网(如下)学习。
/Documentation/Components/SL-SurfaceShaders.html
一、概念篇
1.基准:unity里的shader并不是一门独特的语言,而是一种代码生成方式,且可将低层次且复杂的shader编程进行简化。但同时你也还是得使用Cg/HLSL来写的。
2.原理:写一个函数,以UVs或者一些数据为入口,然后以SurfaceOutput为输出。同时在SurfaceOutput这个结构体里还有不同的属性。这样对于这个函数来说,他的执行过程会生成vertex和pixel的Shader,并且传递一些渲染的路径。
3.结构:输出结构:
struct SurfaceOutput {
Albedo,是漫反射的颜色值。Normal,法线坐标Emission,自发光颜色Specular,镜面反射系数Gloss,光泽系数Alpha,透明度系数
二、编程规则
1.要写在CGPROGRAM..ENDCG的SubShader的块里。不可写在Pass里。
2.shader的名字是可以重复的,重复后,以后来的shader为主。
3.指令详细:
#pragma surface surfaceFunction lightModel [optionalparams]
=&surfaceFunction,没什么好说,肯定是函数名了。
=&lightModel是所采用的光照模型。可以自己写也可使用内置如Lambert和BlinnPhong.
=&optionalparams:可选参数,一堆可选包括透明度,顶点与颜色函数,投射贴花shader等等。具体用到可以细选。
另外这里有一个功能。在Surface shader的CGPROGRAM里添加 #pragma debug [内容]。可在编译结果的文件中看到。写多少都行。但尝试在其他种shader下不行。
三、实例学习:
1.Simple:&
Shader "Example/Diffuse Simple" {
&&&& &&&&SubShader { &&&& &&&&Tags { "RenderType" = "Opaque" } &&& &&&&CGPROGRAM &&&&#pragma surface surf Lambert &&&& &&&&struct Input { &&&float4 color : COLOR; &&&&}; & &&&&void surf (Input IN, inout SurfaceOutput o) { &&& &&&&&&&o.Albedo = 1; && &&&} &&&& &&&&ENDCG && &&&&}&& &&&& &&&&Fallback "Diffuse" }
第一个。行行来:
第一行:写个名字。这也有讲究的。斜线左边为其父类的组,无则新增,有则累加,右边才是真正的名字。注意,这些shader名不像C#脚本,无需文件名与shader名相同。
第二、三行:接下来就在SubShader里添加内容,SubShader是可以有多个的。然后上一个Tags,此处只用到RenderType这种,另外的还有Rendering order, ForceNoShadowCasting..等。这些本阶段暂不研究。
第四行:上一条指令,里面指定响应方法为surf且采用Lambert的光照模型。这个必须有的。
第五行:这个结构体,记得名字不能改,只能为Input。里面一个四元素的颜色值(RGBA)。
第七到第九行:第一个参数,纯输入的上述结构体参数。第二个参数,inout标识,意思是可为输入参数也可为输出参数。Albedo根据前面介绍到的,是一个rgb的值,如果给一个1,其实就是float3(1,1,1),就是反射出来的颜色为白色,如果为100,则是加强反射强度,并不会改变其颜色。为0或为负数时道理类似。
最后Fallback,后方的是自带的shader,可以用自己自定义好的。这里这句的意思是,如果所有subshader在当前显卡都不支持,则默认返回自带的Diffuse。
2.Texture:
Shader "Example/Diffuse Texture"
{ &&&&Properties { _MainTex ("Texture", 2D) = "white" {} } &&&&SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert
struct Input { float2 uv_MainT }; &&&&&&sampler2D _MainT &&&&&&
&&&&&&void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex).rgb;
Fallback "Diffuse"
这个例子呢。其实只是第一个的基础上添加了一个2D属性显示名为Texture。以下解析:
第一个黑体:添加一个名叫_MainTex的属性,指定其为2D类型且显示为Texture。"white"那块可不是乱写的,是unity的build-in的一些textures的名称,而不是单纯颜色名字。意思是当默认时显示为名叫white的材质。如改成red(即使用名叫red的材质,如果有其他也可叫其名字),则效果如下:
第二个黑体:uv_MainTex。这其中大有玄机,uv开头指代后方材质的uv值,因此uv不变,后面的可以根据开头起的名字动态换。还有哦,这种类似于_MainTex的命名方式是CG推荐的,其实不用下划线也OK的。
第三个黑体:这个Sampler2D,可以理解为引用一个2D&Texture。因为下面的Tex2D函数需要这种类型。所以说这个后面的名字要与Properties里的对应一样才行。
第四个黑体:Tex2D,这玩意就是根据对应材质上所有的点找指定 2DSample上的Texture信息,此处需要其RGB信息,就打出来赋给了其反射值。所以对有材质图的情况下,要显示出图,还是要相应的反射其原图的rgb值。
3.Normal mapping
Shader "Example/Diffuse Bump" {
Properties {
_MainTex (
&&&&&&&&"Texture", 2D) = "white" {} &&&&& &&&&&&&&&_BumpMap ("Bumpmap", 2D) = "bump" {} &&
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert
struct Input {
float2 uv_MainT
float2 uv_BumpM
sampler2D _MainT &&&&&& &&&&&&sampler2D _BumpM &&&&&
&&&&&void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex). &&&&&& &&&&&&&&&&o.Normal = UnpackNormal (tex2D (_BumpMap, IN.uv_BumpMap)); &&&&
Fallback "Diffuse"
这个例子里加了个凹凸贴图,可实现类似一些很漂亮的凹凸效果。
第一个黑体:加一个2D类型的材质,默认为bump。(即带有凹凸效果的)。
第二个黑体:上一个采集器。采集下来上面的材质。
第三个黑体:有讲究,这个UnpackNormal是unity自带的标准解压法线用的,所谓解压,我暂时学习到的只是将法线的区间进行变换。由于tex2D(_BumpMap, IN.uv_BumpMap)取出的是带压缩的[0,1]之间,需要转成[-1,1]。这个函数会针对移动平台或OPENGL ES平台采用 RGB法线贴图,其他采用DXT5nm贴图。为此也可自己写。也在网上找到了一些资料,如下参考:
[转载自/thread--1.html]
4.Rim Lighting&
Shader "Example/Rim" {
Properties {
_MainTex ("Texture", 2D) = "white" {}
_BumpMap ("Bumpmap", 2D) = "bump" {} &&&&&&&_RimColor ("Rim Color", Color) = (0.26,0.19,0.16,0.0)//1 &&&&&& _RimPower ("Rim Power", Range(0.5,8.0)) = 3.0 //2 &&&&}
SubShader {
Tags { "RenderType" = "Opaque" }
sampler2D _MainT
sampler2D _BumpM &&&& float4 _RimC//4 &&&&&&float _RimP//5 void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex).
o.Normal = UnpackNormal (tex2D (_BumpMap, IN.uv_BumpMap)); &&&&&&&&&&&&half rim = 1.0 - saturate(dot (normalize(IN.viewDir), o.Normal));//6 &&&&&&&&o.Emission = _RimColor.rgb * pow (rim, _RimPower);//7 }
Fallback "Diffuse"
新增的一些东西,我都用数字标注了。以下进行详细解读:
第一处(//1):上一个Color类型的显示为Rim Color的变量。颜色值RGBA对应0.26,0.19,0.16,0.0
第二处(//2):这个Range类型的变量,结果还是一个float。只是这个float是在这个range之内。为什么这么定义呢。如果超多,或过小,则使用range内指明的值代替。
第三处(//3):viewDir 意为World Space View Direction。就是当前坐标的视角方向。这里有个从相关网上找的图:链接:/forum/read.php?tid=11367
第四、五处(//4,//5):定义两个变量对应properties里的值,取出使用。
第六、七处:最里层是Normalize函数,用于获取到的viewDir坐标转成一个单位向量且方向不变,外面再与点的法线做点积。最外层再用saturate算出一[0,1]之间的最靠近(最小值但大于所指的值)的值。这样算出一个rim边界。为什么这么做。原理以下解释:
=&这里o.Normal就是单位向量。外加Normalize了viewDir。因此求得的点积就是夹角的cos值。
=&因为cos值越大,夹角越小,所以,这时取反来。这样,夹角越大,所反射上的颜色就越多。于是就得到的两边发光的效果。哈哈这样明了吧。
这里介绍一下这个half。CG里还有类似的float和fixed。half是一种低精度的float,但有时也会被选择成与float一样的精度。fragment是一定会支持fixed类型,同时也会有可能将其精度设成与float一样,这个比较复杂,后面篇章学到fragment时再深入探讨。
以下为与3的对比,大家一下就知道谁是用了rim color的吧。对!下面那个盒子就是用些shader的效果。
5.Detail Texture
&Shader "Example/Detail" {
Properties {
_MainTex ("Texture", 2D) = "white" {}
_BumpMap ("Bumpmap", 2D) = "bump" {} &&&&&&_Detail ("Detail", 2D) = "gray" {} &&&&}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert
struct Input {
float2 uv_MainT
float2 uv_BumpM &&&&&&&&&& &&&&&&&&&&float2 uv_D &&&&&&
sampler2D _MainT
sampler2D _BumpM &&&&& &&&&&&sampler2D _D &&&&&
&&&&&void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex). &&&&&&&& &&&&&&&& o.Albedo *= tex2D (_Detail, IN.uv_Detail).rgb * 2; &&&&&&&&&&
&&&&&&&&&&o.Normal = UnpackNormal (tex2D (_BumpMap, IN.uv_BumpMap));
Fallback "Diffuse"
这个最好理解了。
前面三个一样。上一个2D Texture。
最后一个黑体:在原先的反射基础上,在加一层,Texture的反射。
就是这样啦。最后上几个截图,大家一定就明白。
6.Detail Texture in Screen Space
Shader "Example/ScreenPos" {
Properties {
_MainTex ("Texture", 2D) = "white" {}
_Detail ("Detail", 2D) = "gray" {}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert
struct Input {
float2 uv_MainT float4 screenP };
sampler2D _MainT
sampler2D _D
void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex). &&&&&&&& float2 screenUV = IN.screenPos.xy / IN.screenPos.w;
这个比较有趣,是从上个例子的基础上将第二层叠加上的2D Texture根据当前屏幕的UV进行叠加,而不是根据自身的UV。这样带有含此shader材质的物体的贴图就会跟着移动到的位置而变换图片。
这里只需要说三点:
1.关于screenPos:screenPos是一个三维点,但是用齐次坐标的形式表示出来就是(x,y,z,w),根据齐次坐标的性质。(x,y,z,w)的齐次坐标对应三维点(x/w,y/w,z/w)。因此把w值除掉可以看来是一种Normalize的作法,这样就取出了实际的屏幕xy的UV值。
2.对screenUV进行倍剩:此处剩float2(8,6)意为将原获取到屏幕尺寸进行拉大的倍数。即x轴拉大8倍,y轴拉大6倍。
3.如何就平铺了刚好一行8个,一列6个了呢? 原因我觉得是在于2d Texture自己是按Normalize后进行铺的,因此在//2(刚转完标准的)screenPos后,将其剩多少即便将原图铺多少张。
OK。明了。其实这个东西可以拿来做放大镜的应用。上图:
7. Cubemap reflection
Shader "Example/WorldRefl" {
Properties {
_MainTex (
&&&&&&&&"Texture", 2D) = "white" {} &&&&&&&&_Cube ("Cubemap", CUBE) = "" {} &&&&}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert
struct Input {
&&&float2 uv_MainT &&&&&&&&&&&float3 worldR &&&&&&};
sampler2D _MainT &&&&&&samplerCUBE _C &&&&&&void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex).rgb * 0.5; &&&&&&&&&&o.Emission = texCUBE (_Cube, IN.worldRefl). &&&&&&}
Fallback "Diffuse"
Shader "Example/WorldRefl Normalmap" {
Properties {
_MainTex ("Texture", 2D) = "white" {}
_BumpMap ("Bumpmap", 2D) = "bump" {}
_Cube ("Cubemap", CUBE) = "" {}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert
struct Input {
float2 uv_MainT
float2 uv_BumpM
float3 worldR INTERNAL_DATA };
sampler2D _MainT
sampler2D _BumpM
samplerCUBE _C
void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex).rgb * 0.5;
o.Normal = UnpackNormal (tex2D (_BumpMap, IN.uv_BumpMap));
o.Emission = texCUBE (_Cube, WorldReflectionVector (IN, o.Normal)).
Fallback "Diffuse"
这两段都是加一个cubemap的反射。第二段相比之下是在有normal反射的基础上加的。Cubemap这东西,可设置几种面的不能渲染图,这方面可用于做天空盒。因为这样可以从各个角度看过去以显示不同的渲染效果。
以下说明:
1. worldRefl:即为世界空间的反射向量。
2. texCUBE:将反射向量一个个的往_Cube反射盒上找出然后做为Emission反射出来。
3. 第二个例子只是将其用在Normal反射后,这样一定要多添加一个INTERNAL_DATA的属性,另外也需用到WorldReflectionVectore方法取其利用Normal后的反射向量值。
类似于的效果,可见官网中的。我这也有一个,有点像打了光的样子。
8.Slices via World Space Position
Shader "Example/Slices" {
Properties {
_MainTex ("Texture", 2D) = "white" {}
_BumpMap ("Bumpmap", 2D) = "bump" {}
SubShader {
Tags { "RenderType" = "Opaque" } &&&&& &&&& &Cull Off &&&&&
#pragma surface surf Lambert
struct Input {
float2 uv_MainT
float2 uv_BumpM &&&& &&&&&&&& float3 worldP &&&&&&
sampler2D _MainT
sampler2D _BumpM
void surf (Input IN, inout SurfaceOutput o) { &&&&&& &&&& &&&& clip (frac((IN.worldPos.y+IN.worldPos.z*0.1) * 5) - 0.5); &&&&&&&&& o.Albedo = tex2D (_MainTex, IN.uv_MainTex).
o.Normal = UnpackNormal (tex2D (_BumpMap, IN.uv_BumpMap));
Fallback "Diffuse"
在看完这段后,我自己另外又加一段,以作对比:
float3 _tWorldP
void surf (Input IN, inout SurfaceOutput o) {
_tWorldPos = IN.screenPos.xyz / IN.screenPos.w;
第二个黑体:frac是取小数的函数,如1.23 取出来是 0.23。clip函数用于清Pixel的,负值情况下才进行清pixel。且越小,即绝对值越大则清越多。&这里注意那个* 5,仔细一想,如果frac出来的值越大,-0.5值就越大,绝对值就越小,因此这样清掉的pixel越少,所以就可以间接的增加分段的次数。那为什么要+IN.worldPos.z*0.1呢,主要原因就是空开的断添加一个倾斜角度,可以用空间思想想下。
我的那段,就是将要clip的坐标换掉,换成屏幕的。这样你移动物体时,clip掉的部分会变化。
最后,上下效果图:
9.Normal Extrusion with Vertex Modifier
Shader "Example/Normal Extrusion" {
Properties {
_MainTex ("Texture", 2D) = "white" {} &&&& _Amount ("Extrusion Amount", Range(-1,1)) = 0.5 &&&&}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert vertex:vert //1
struct Input {
float2 uv_MainT
}; &&&&&&float _A
这是个自定义vertex的例子,效果可以实现点坐标的放大缩小,以形成肥仔与瘦棍的效果,哈哈。
第一个黑体(//1):添加一个可选参数为vertex,主要是为了给其添加一个函数vert。
第二个黑体(//2):这个_Amount对应开头的那个属性_Amount。具体是个Range值,可在shader界面外通过滑动条改变这个值。默认为0.5。
第三个黑体(//3):这里除了之前学过的东西外,多了个appdata_full的结构体。这里面的结构(载自UNITY官方论坛)如下:
struct&appdata_full&{
& & float4 vertex : POSITION;
& & float4 tangent : TANGENT;
& & float3&&: NORMAL;
& & float4 texcoord : TEXCOORD0;
& & float4 texcoord1 : TEXCOORD1;
& & fixed4 color : COLOR;
#if defined(SHADER_API_XBOX360)
& & half4 texcoord2 : TEXCOORD2;
& & half4 texcoord3 : TEXCOORD3;
& & half4 texcoord4 : TEXCOORD4;
& & half4 texcoord5 : TEXCOORD5;
第四个黑体(//4):就是像为个点,换当前法线向量的指定倍数进行扩展。
10.Custom data computed per-vertex
Shader "Example/Custom Vertex Data" {
Properties {
_MainTex ("Texture", 2D) = "white" {}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert vertex:vert &&&&
struct Input {
float2 uv_MainT &&&&&&&&&& &&&&&&&&&&float3 customC &&&&&) {
这个例子是用来渲染颜色的。我的分析如下:
第一处(//1):取一个颜色值,float3,对应RGB。
第二处(//2):较前个例子,多一个Input类型的参数,只为输出使用。
第三处(//3):UNITY_INITIALIZE_OUTPUT(type,name)这个函数大有用处,主要是将叫[name]的变量请空改成type类型。以下是从HLSLSupport.cginc里找到的定义:
#if defined(UNITY_COMPILER_HLSL)
#define UNITY_INITIALIZE_OUTPUT(type,name) name = (type)0;
#define UNITY_INITIALIZE_OUTPUT(type,name)
第四处(//4):RGB颜色值当然只能为正值,所以使用绝对值去取normal的值。
第五处(//5):在原先已经渲染上texture颜色值的基础上,加上这层自定义的颜色值。
11.Final Color Modifier
Shader "Example/Tint Final Color" {
Properties {
_MainTex (
&&&&&&&&"Texture", 2D) = "white" {}
&&&&&&&& _ColorTint ("Tint", Color) = (1.0, 0.6, 0.6, 1.0) &&&&&&}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert finalcolor:mycolor
&&&&&&struct Input {
float2 uv_MainT
}; &&&&&&fixed4 _ColorT &&&&&&void mycolor (Input IN, SurfaceOutput o, inout fixed4 color) {
&&&&&&&&&& color *= _ColorT &&&&&&}
sampler2D _MainT
void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex).
Fallback "Diffuse"
这个例子是跟上面例子的对比,前种使用普通反射进行叠加上颜色,此处则是直接使用finalcolor对其颜色进行处理,这种可以处理整个模型的固定颜色值的渲染。以下做简要的分析:
1.finalcolor:mycolor :这个是另一种可选参数,就是用户自定义的颜色处理函数。函数名为mycolor.
2.mycolor函数:注意到函数除了有surf的两个参数外,还多了个颜色参数,这个颜色参数就是当前模型上颜色对象,对他的更改将直接影响全部来自于lightmap,light probe和一些相关资源的颜色值。
12.Custom Fog with Final Color Modifier
Shader "Example/Fog via Final Color" {
Properties {
_MainTex ("Texture", 2D) = "white" {} &&&&&&_FogColor ("Fog Color", Color) = (0.3, 0.4, 0.7, 1.0) &&&&}
SubShader {
Tags { "RenderType" = "Opaque" }
#pragma surface surf Lambert finalcolor:mycolor vertex:myvert &&&&&&
&&&&&&struct Input {
float2 uv_MainT &&&&&&&& &&&&&&&&&& &&&&&
void myvert (inout appdata_full v, out Input data)
{ &&&&&&&& &&&&&&&&&&UNITY_INITIALIZE_OUTPUT(Input,data); &&&&&&&& &&&&&&&& float4 hpos = mul (UNITY_MATRIX_MVP, v.vertex); &&&&&&&&&&&&&&&& &&&&&&&&&&&& fogColor = 0; &&& //3&&&&&& &&&&&&&&&&&&#endif &&&&&&&&&//3 &&&&&&&&&&&&color.rgb = lerp (color.rgb, fogColor, IN.fog); //4 &&&&& }
sampler2D _MainT
void surf (Input IN, inout SurfaceOutput o) {
o.Albedo = tex2D (_MainTex, IN.uv_MainTex).
Fallback "Diffuse"
这个很高难度,里面还有些之前没用到过的函数,以下是我的理解:
第一处(//1):mul是矩阵相乘的函数。UNITY_MATRIX_MVP是model、view、projection三个矩阵相乘出来的4x4的矩阵。v.vertex是一个float4的变量,可理解成4x1的矩阵,两者相乘,则得出一个float4,这个值就是视角窗口的坐标值,这个坐标就跟camera的关联了。
第二处(//2):这个fog的浮点值就是其强度,范围一般在-1到1之间,说一般,只是我个人建议的值,设成其他也行,只是没多大意义。越负就越黑。再看后面这个点积,这个仔细一想,不难理解,其实就是为了达到一种扩散的效果,因此两个一样的向量相乘,其实就是直接对坐标做平方扩展,这样fog就更有雾的感觉。
第三处(//3):这个宏不好找,就看官方对这个例子的解释为正向渲染时的额外通道。字面不好理解,多多尝试过可以有所发现,其实就是在雾气渐渐消失处那块额外的渲染区。可以将fogColor = 0; 改成fogColor = fixed3(1,0,0)。外面雾气颜色再选成白色,效果则如下:雾气改成绿色后:效果如下:
第四处(//4):lerp函数是个有趣的函数。第一个参数是左边界,第二个参数是右边界,第三个相当于一个值介于0到1之间的游标。游标为0,则为左边界,为1为右边界,取中间值则是以此类推,取插值。其实也可以把它看成百分比。这里的fog则可以看来那个游标,值越大,则越接近fogColor,越小越接近原色。
原shader所出来的效果再来张:
13.Linear Fog
Shader "Example/Linear Fog"{
&&Properties {
_MainTex ("Base (RGB)", 2D) = "white" {}
SubShader {
Tags { "RenderType"="Opaque" }
这个官方只贴出了代码,无任何解释。网上也未曾看到有人解答,在此为大家分析下。其实这个与上面那个例子相比之下,采用的fog的源头变了,这里是获取rendersettings里的fog来设置Fog的颜色、强度与起点终点等。以下进行解析:
第一处(//1):LOD 200,200是个代号,设成此的目的就是限制shader级别只到200为止,高过200的不采用,即使显卡支持,也不会使用高过200的shader级别的渲染方式。官方的解释:/Documentation/Components/SL-ShaderLOD.html
第二处(//2):此处标记uniform的意图就是让Cg可以使用此变量。因此这三个uniform变量均来自于RenderSetting中。你可以预先设置好三个值。
第三处(//3):length函数用于取一个向量的长度,如果是float3则采取如下形式:
float length(float3 v)
return sqrt(dot(v,v));
就是点积取平方根。
第四处(//4):计算fog起终点间的反差。
第五处(//5):将4中算得的diff置反过来。
第六处(//6):则将算出来的离视角的距离与0到1之间进行比对,小于0则为0,大于1则为1,范围之内就是其原值,总的来说,利用clamp函数防止其出界。
分析下原理:咱们先将rendersetting里的颜色设成红色,fog start 设成0, fog end设成50。这时算出的diff = 50, invdiff = 1/50。将原fog的计算稍做简化,得出如下结果:
fog = clamp((1 - pos/50) , 0 , 1);这个式子很是明了,pos是距离,即距离越远,clamp里值越小,根据后面这句:
color.rgb = lerp (fogColor, color.rgb, IN.fog);
我们就可以判断出其越靠近fogColor,雾气就会越重。
最后上个效果图:这里选的是Linear的fog。
到此,所有的surface shader的官方例子都详细的介绍完了。哎,开源中国对cg无什么代码显示支持,大家要代码看不清,可以直接去官网上去面看。/Documentation/Components/SL-SurfaceShaderExamples.html
这里送上本文的项目工程:/s/1xindN
四、学习技巧
这里是我个人的一些观点:
1.遇问题先找官网,找官网论坛,找官网文档。
2.学会从软件根目录下的CGIncludes文件夹下找相关的函数宏定义。
3.积累相关线性代数与计算机图形学的知识,学习会更轻松些。
文中要有不对的地方,欢迎大家留言指正,其实与爱好Unity的人互相学习讨论!
下文将为大家送上对于官网的surface shader的其他方面的学习手记。敬请期待。。积极更新中。。
#本文系原创,全部解析内容来自自我学习的记录,请在转载时注明出处,谢谢#
随笔 - 107}

我要回帖

更多关于 shader实现扭曲效果 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信