教程[AGAL海底波纹和反光特效]

AGAL海底波纹和反光特效

这是从HLSL转过来的效果,具体的AGAL我就不解释了,注释里有详细的说明,或者参考AGAL点光源和AGAL红蓝3D，里面对每一行的AGAL都有详细的解释,框架也是一样的。

那么要做这个效果你需要2个采样图,一个是海底的图片,一个是反光的图片,样图如下





AGAL代码如下:

 

//波动效果
/*float4 color = float4(0,0,0,0);
float2 backgroundUv = input.uv;

//mark #1
//当前像素点显示的纹理上的UV坐标
//是根据原始显示的纹理UV计偏移
//其实就是纹理上的点做园周运动
//原理：像素点x ,uv为(x,y)
//修改像素点显示的纹理
//uv => 新的uv为(x*(1+ sin(x * Increment)),y*(1+cos(y* Increment)));

backgroundUv.x += sin(times /500.f + backgroundUv.x *15) *0.005;
backgroundUv.y += cos(times /500.f + backgroundUv.y *15) *0.005;
color = tex2D(tex_sampler,backgroundUv);*/
var fragmentShader:Array =
[

//公式原理在上面,下面具体的内容就不解释了,只是把运算符号换做了AGAL而已。。 

"mov ft2,v0",
"mov ft0,fc1",

"div ft1.x,ft0.x,ft0.y",
"mul ft1.y,v0.x,ft0.z",

"add ft1.z,ft1.x,ft1.y",
"cos ft1.w,ft1.z",
"mul ft1.x,ft1.w,ft0.w",
"add ft2.x,ft2.x,ft1.x",

"div ft4.x,ft0.x,ft0.y",
"mul ft4.y,v0.y,ft0.z",
"add ft4.z,ft4.x,ft4.y",
"cos ft4.w,ft4.z",
"mul ft4.x,ft4.w,ft0.w",
"add ft2.y,ft2.y,ft4.x",

"mov ft5,ft2",

//获取ft5计算结果的像素,这里计算的是水波
"tex ft5, ft5, fs0 ",

"mov ft2,v0",
"mov ft0,fc2",

"div ft1.x,ft0.x,ft0.y",
"mul ft1.y,v0.x,ft0.z",
"add ft1.z,ft1.x,ft1.y",
"sin ft1.w,ft1.z",
"mul ft1.x,ft1.w,ft0.w",
"add ft2.x,ft2.x,ft1.x",

"div ft4.x,ft0.x,ft0.y",
"mul ft4.y,v0.y,ft0.z",
"add ft4.z,ft4.x,ft4.y",
"cos ft4.w,ft4.z",
"mul ft4.x,ft4.w,ft0.w",
"add ft2.y,ft2.y,ft4.x",

//以v0原始坐标开始计算,让ft2以圆周旋转,最后回去ft2的像素点,然后输出,这里计算的是海底的反光,海底的反光参数和水波的不一样,这样才能形成错开的感觉。
"tex ft6, ft2, fs1 ",

"mul ft6,ft6,ft5",
"mov oc, ft6"
];