OpenGL（十四）环境反射环境折射的shader实现

程序员文章站 2022-06-11 07:59:32

...

在上一节我们讲解了如何制作天空盒，本篇文章介绍它的一个衍生功能——在物体上叠加环境反射。

核心原理

核心很简单，在天空盒中，视线照射到天空盒上的区域即需要绘制的部分。在环境反射中，需要绘制的区域变成了视线在物体表面的反射光线，反射光线照射到天空盒的位置即要绘制的部分。

环境反射

按照上面的说法，将法线方向传入shader中，具体编写如下：

//vs
attribute vec3 pos;
attribute vec2 texcoord;
attribute vec3 normal;
uniform mat4 M;
uniform mat4 P;
uniform mat4 V;
uniform mat4 NM;
varying vec4 V_WorldPos;
varying vec3 V_Normal;
void main()
{
    V_WorldPos=M*vec4(pos,1.0);
    V_Normal=mat3(NM)*normal;
    gl_Position=P*V*M*vec4(pos,1.0);
}
//fs
varying vec4 V_WorldPos;
varying vec3 V_Normal;
uniform samplerCube U_MainTexture;
void main()
{
    vec3 eyeVec=normalize(V_WorldPos.xyz-vec3(0.0));
    vec3 n=normalize(V_Normal);
    vec3 r=reflect(eyeVec,n);
    vec4 color=textureCube(U_MainTexture,r);
    gl_FragColor=color;
}

环境折射

环境折射实现原理与环境反射相同，只不过在计算射出光线时使用折射函数：

//fs
varying vec4 V_WorldPos;
varying vec3 V_Normal;
uniform samplerCube U_MainTexture;
void main()
{
    vec3 eyeVec=normalize(V_WorldPos.xyz-vec3(0.0));
    vec3 n=normalize(V_Normal);
    vec3 r=refract(eyeVec,n,1.0/2.4);
    vec4 color=textureCube(U_MainTexture,r);
    gl_FragColor=color;
}