zoukankan      html  css  js  c++  java
  • 玻璃效果 四

     

    其实这可以做为通用的折射物体渲染的一种思路:

     

    1. 把场景画到RTT上, 如果需要后处理正好就有现成的RTT

    2. 绘制需要折射的物体, 把法线投影后的xy坐标做为纹理坐标的偏移系数

    3. 把场景的RTT做为物体的纹理, 根据上一步得到的纹理坐标进行寻址, 产生折射效果

     

    虽说这样的计算并不是根据物理定律来进行的, 但是它很高效, 只需要在VS中进行纹理坐标的计算, 可以不使用PS. 如果需要对折射后的效果再进行扰动, 产生类似于毛玻璃效果的话, PS就不可避免了.

     

    RM工程:

    效果, 可以调节折射率(fScaler):

    代码, 只给出最后一个pass的vs:

    1. float4x4 matViewProjection;  
    2. float2 fInverseViewportDimensions;  
    3. float fScaler;  
    4.   
    5. struct VS_INPUT   
    6. {  
    7.    float4 Position : POSITION0;  
    8.    float3 Normal   : NORMAL0;  
    9. };  
    10.   
    11. struct VS_OUTPUT   
    12. {  
    13.    float4 Position : POSITION0;  
    14.    float2 TexCoord : TEXCOORD0;  
    15. };  
    16.   
    17. VS_OUTPUT vs_main( VS_INPUT Input )  
    18. {  
    19.    VS_OUTPUT Output;  
    20.   
    21.    Output.Position = mul( Input.Position, matViewProjection );  
    22.   
    23.    // transform to texture space   
    24.    Output.TexCoord.x = 0.5f + 0.5f * ( Output.Position.x / Output.Position.w );  
    25.    Output.TexCoord.y = 0.5f - 0.5f * ( Output.Position.y / Output.Position.w );  
    26.      
    27.    // refract   
    28.    float2 displace = mul( Input.Normal, matViewProjection ).xy;  
    29.    displace.x = -displace.x;  
    30.    Output.TexCoord += displace * fInverseViewportDimensions * fScaler;  
    31.      
    32.    return( Output );  
    33. }  
    1. float4x4 matViewProjection;  
    2. float2 fInverseViewportDimensions;  
    3. float fScaler;  
    4.   
    5. struct VS_INPUT   
    6. {  
    7.    float4 Position : POSITION0;  
    8.    float3 Normal   : NORMAL0;  
    9. };  
    10.   
    11. struct VS_OUTPUT   
    12. {  
    13.    float4 Position : POSITION0;  
    14.    float2 TexCoord : TEXCOORD0;  
    15. };  
    16.   
    17. VS_OUTPUT vs_main( VS_INPUT Input )  
    18. {  
    19.    VS_OUTPUT Output;  
    20.   
    21.    Output.Position = mul( Input.Position, matViewProjection );  
    22.   
    23.    // transform to texture space  
    24.    Output.TexCoord.x = 0.5f + 0.5f * ( Output.Position.x / Output.Position.w );  
    25.    Output.TexCoord.y = 0.5f - 0.5f * ( Output.Position.y / Output.Position.w );  
    26.      
    27.    // refract  
    28.    float2 displace = mul( Input.Normal, matViewProjection ).xy;  
    29.    displace.x = -displace.x;  
    30.    Output.TexCoord += displace * fInverseViewportDimensions * fScaler;  
    31.      
    32.    return( Output );  
    33. }  

     

    如果要实现遮挡的话, 需要深度信息, 可以把RTT的DepthBuffer再设回去(仅仅是一个思路, 还没验证)

  • 相关阅读:
    实现h5中radio单击取消与选中
    小程序中的组件化理解
    阿里字体css代码引入方法
    前端布局心得小结
    Python学习资源汇总,转载自他人
    史上最全 原生javascript的知识总结,适合新手及查资料用!
    windows Python 3.4.3 安装图文
    PyInstaller编译python3时使用的详细参数介绍
    PyInstaller 安装方法 及简单的编译exe (python3)
    Windows 安装 GTK+ 图文说明
  • 原文地址:https://www.cnblogs.com/sier/p/5676518.html
Copyright © 2011-2022 走看看