GLSL实现Glow效果 【转】

http://blog.csdn.net/a3070173/article/details/3220940

1. Glow即辉光效果现在已成为3D图形中一个引人注目的特效.本文主要介绍如何使用GLSL实现一个典型的GLow效果.
2. 实现步骤:1.渲染整个场景到一个祯缓冲区中
3. 2.将场景中需要进行GLow处理的物体绘制第二个FBO纹理A中
4. 3.在FBO纹理A和B之间进行横和纵"高斯"过滤
5. 4.将进行过GLow处理后的FBO纹理A与祯缓冲区中的场景图像以glBlendFunc(GL_ONE, GL_ONE)方式进行混合处理
6. GLSL文件功能简介:
7. FullScreen.vert - 用于绘制覆盖整个视口的四边形以进行Glow效果的高斯过滤
8. Filter.frag - 用于横和纵的高斯过滤
9. Blend.frag - 用于处理过的GLowFBO纹理与原始场景图像进行混合
10. 为了直接进行生成Glow效果的介绍,这里假设程序已正确处理了OpenGL和GLSL的初始化.
11. void RenderOrigionalScene()
12. {
13. if (g_bUseFillRender)
14. {
15. glPolygonMode(GL_FRONT, GL_FILL);
16. }
17. else
18. {
19. glPolygonMode(GL_FRONT, GL_LINE);
20. }
21. RenderObject();
22. }
23. 首先让我们绘制原始场景,由于本Demo未绘制除辉光物体外的其它事物,所以此处就直接绘制为进行具有辉光效果的物体.
24. void RenderGlowObject()
25. {
26. // 设置视口
27. glViewport(0, 0, g_uiTextureWidth, g_uiTextureHeight);
28. // 将原始场景绘制到第二个FBO
29. glBindFramebufferEXT(GL_FRAMEBUFFER_EXT, g_uiFboColorOne);
30. // 清除第一个FBO颜色和深度缓存
31. glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
32. // 绘制辉光物体
33. RenderObject();
34. }
35. 然后设置绘制目标到FBO纹理A并将欲进行Glow处理的物体绘制到上面来,这里需要注意的是必须根据FBO纹理的尺寸设置一个
36. 视口使其跟FBO纹理一样大,以使物体能够准确地映射到整个FBO纹理上.清除FBO颜色缓冲区和绘制深度缓冲区是必要的,因为
37. 每次绘制到FBO纹理中的图像都不一样.
38. void FilterGlowObject()
39. {
40. glPolygonMode(GL_FRONT, GL_FILL);
41. // 将水平过滤后的图像绘制第二个FBO
42. glBindFramebufferEXT(GL_FRAMEBUFFER_EXT, g_uiFboColorTwo);
43. // 清除第二个FBO颜色
44. glClear(GL_COLOR_BUFFER_BIT);
45. // 重新设置片元着色器
46. glUseProgram(g_ProgramObjectOne);
47. // 设置水平过滤标志
48. GLint iUniformIndex = glGetUniformLocation(g_ProgramObjectOne, "g_bFiterMode");
49. glUniform1i(iUniformIndex, 1);
50. // 设置纹理
51. glBindTexture(GL_TEXTURE_2D, g_uiIDOne);
52. // 绘制
53. RenderFullScreen();
54. // 将竖直过滤后的图像绘制第一个FBO
55. glBindFramebufferEXT(GL_FRAMEBUFFER_EXT, g_uiFboColorOne);
56. // 清除第一个FBO颜色和深度缓存
57. glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
58. // 设置竖直过滤标志
59. iUniformIndex = glGetUniformLocation(g_ProgramObjectOne, "g_bFiterMode");
60. glUniform1i(iUniformIndex, 0);
61. // 设置纹理
62. glBindTexture(GL_TEXTURE_2D, g_uiIDTwo);
63. // 绘制
64. RenderFullScreen();
65. }
66. 下面到Glow效果处理的重头戏,是否能生成完美的辉光效果关键就在于此步的处理.但其实也很简单,主要就是为Filter着色器设
67. 置进行合适横,纵两次过滤的标志和绘制目标,然后绘制全视口四边形,剩下的过滤工作则由GLSL的高斯过滤着色器全权负责.
68. void RenderToScreen()
69. {
70. // 恢复视口
71. glViewport(0, 0, g_uiCurrentWindowWidth, g_uiCurrentWindowHeight);
72. // 恢复绘制目标为祯缓冲区
73. glBindFramebufferEXT(GL_FRAMEBUFFER_EXT, NULL);
74. // 启动混合
75. glEnable(GL_BLEND);
76. glBlendFunc(GL_ONE, GL_ONE);
77. // 绑定纹理
78. glBindTexture(GL_TEXTURE_2D, g_uiIDOne);
79. // 重新设置片元着色器
80. glUseProgram(g_ProgramObjectTwo);
81. // 绘制
82. RenderFullScreen();
83. // 恢复固定功能管线
84. glUseProgram(0);
85. // 关闭混合
86. glDisable(GL_BLEND);
87. }
88. 最后一步无非就是将过滤好的Glow纹理与原始场景图像进行混合,当然使用OpenGL固定功能管线或GLSL都可以轻易实现,但首先必
89. 须把视口设置回原来的状态.
90. 以下是高斯过滤的GLSL着色器代码,粘贴于此以方便读者查阅.
91. 顶点着色器:
92. void main()
93. {
94. gl_TexCoord[0] = gl_MultiTexCoord0;
95. gl_Position = gl_Vertex;
96. }
97. 高斯过滤着色器:
98. const int g_iFilterTime = 9; // 过滤次数
99. const float g_fGene = (1.0/(1.0 + 2.0*(0.93 + 0.8 + 0.7 + 0.6 + 0.5 + 0.4 + 0.3 + 0.2 + 0.1))); // 衰减因子
100. uniform sampler2D g_Decal;
101. uniform bool g_bFiterMode;
102. uniform float g_fGlowGene;
103. uniform vec2 g_vec2HorizontalDir; // 水平过滤方向
104. uniform vec2 g_vec2VerticalDir;  // 竖直过滤方向
105. uniform float g_fFilterOffset; // 过滤偏移
106. void main()
107. {
108. float aryAttenuation[g_iFilterTime];
109. aryAttenuation[0] = 0.93;
110. aryAttenuation[1] = 0.8;
111. aryAttenuation[2] = 0.7;
112. aryAttenuation[3] = 0.6;
113. aryAttenuation[4] = 0.5;
114. aryAttenuation[5] = 0.4;
115. aryAttenuation[6] = 0.3;
116. aryAttenuation[7] = 0.2;
117. aryAttenuation[8] = 0.1;
118. // 采样原始颜色
119. vec2 vec2Tex0 = gl_TexCoord[0].st;
120. vec4 vec4Color = texture2D(g_Decal, vec2Tex0)*g_fGene;
121. // 计算过滤方向
122. vec2 vec2FilterDir = g_vec2HorizontalDir + vec2(g_fFilterOffset, 0.0); // 水平过滤
123. if (!g_bFiterMode)
124. {
125. vec2FilterDir = g_vec2VerticalDir + vec2(0.0, g_fFilterOffset); // 竖直过滤
126. }
127. // 进行过滤
128. vec2 vec2Step = vec2FilterDir;
129. for(int i = 0; i< g_iFilterTime; ++i)
130. {
131. vec4Color += texture2D(g_Decal, vec2Tex0 + vec2Step)*aryAttenuation[i]*g_fGene;
132. vec4Color += texture2D(g_Decal, vec2Tex0 - vec2Step)*aryAttenuation[i]*g_fGene;
133. vec2Step += vec2FilterDir;
134. }
135. if (g_bFiterMode)
136. {
137. gl_FragColor = vec4Color*g_fGlowGene;
138. }
139. else
140. {
141. gl_FragColor = vec4Color;
142. }
143. }
144. 混合着色器:
145. uniform sampler2D g_Decal;
146. void main()
147. {
148. gl_FragColor = texture2D(g_Decal, gl_TexCoord[0].st);
149. }
150. Demo效果图:

1. 参考资料:Nvidia OpenGL SDK 10.5 Simple Glow
2. exe文件:http://www.fileupyours.com/view/219112/GLSL/Glow%20Demo.rar