HLSL:高斯模糊效应

时间:2016-03-30 08:50:41

标签: directx hlsl pixel-shader post-processing

我正在尝试使用后期处理来实现高斯模糊。我有两个渲染通道;第一遍渲染场景,第二遍用于效果。

这是我的像素着色器代码:

const float offset[] = {
    0.0, 1.0, 2.0, 3.0, 4.0
    };
    const float weight[] = {
      0.2270270270, 0.1945945946, 0.1216216216,
      0.0540540541, 0.0162162162
    };
    ppColour = SceneTexture.Sample(PointSample, ppIn.UV) * weight[0];
    float3 FragmentColor = float3(0.0f, 0.0f, 0.0f);

    for (int i = 1; i < 5; i++) {
        // Horizontal-pass
        FragmentColor +=
            SceneTexture.Sample(PointSample, ppIn.UV + float2(0.0f, offset[i]))*weight[i] +
            SceneTexture.Sample(PointSample, ppIn.UV - float2(0.0f, offset[i]))*weight[i];      
            // Vertical-pass
        FragmentColor +=
            SceneTexture.Sample(PointSample, ppIn.UV + float2(offset[i], 0.0f))*weight[i] +
            SceneTexture.Sample(PointSample, ppIn.UV - float2(offset[i], 0.0f))*weight[i];
        }
ppColour += FragmentColor;
return (ppColour,1.0);

我看到了一个字符串,如图所示: enter image description here

我做错了什么?

1 个答案:

答案 0 :(得分:3)

我认为您需要使用下面的着色器代码分别渲染水平和垂直传递,但方向不同(请参阅dir统一变量)。所以你需要3个步骤

  • 使用默认着色器
  • 将场景渲染为纹理A.
  • 使用高斯模糊着色器水平渲染纹理A到纹理B(dir = {1.0,0.0})
  • 使用垂直相同的高光模糊着色器将纹理B渲染到屏幕(dir = {0.0,1.0})
uniform vec2 dir;

const float offset[] = {0.0, 1.0, 2.0, 3.0, 4.0};
const float weight[] = {
  0.2270270270, 0.1945945946, 0.1216216216,
  0.0540540541, 0.0162162162
};
ppColour = SceneTexture.Sample(PointSample, ppIn.UV) * weight[0];
float3 FragmentColor = float3(0.0f, 0.0f, 0.0f);

//(1.0, 0.0) -> horizontal blur
//(0.0, 1.0) -> vertical blur
float hstep = dir.x;
float vstep = dir.y;

for (int i = 1; i < 5; i++) {
    FragmentColor +=
        SceneTexture.Sample(PointSample, ppIn.UV + float2(hstep*offset[i], vstep*offset[i]))*weight[i] +
        SceneTexture.Sample(PointSample, ppIn.UV - float2(hstep*offset[i], vstep*offset[i]))*weight[i];      
    }
ppColour += FragmentColor;
return (ppColour,1.0);

请参阅Efficient Gaussion Blur with Linear Sampling