what you see, is there a square rendered to a secondary texture, then that texture has an effect applied to it that creates the outline and glow around the squared, using a specific color.
[HLSL] - whats the best way to get this effect
Author
rendering a texture and post processing aren't my concerns im more interested in how to write the shader to accomplish this.
using VS/PS 2 give me some hints on how to accomplish this, and is it possible using one pass?
what you see, is there a square rendered to a secondary texture, then that texture has an effect applied to it that creates the outline and glow around the squared, using a specific color.
what you see, is there a square rendered to a secondary texture, then that texture has an effect applied to it that creates the outline and glow around the squared, using a specific color.
Author
Still trying to figure this out, I was trying to use multiple passes, it just doesn't look right, and I end up useing anywhere from 6-12 passes just to make the glow part big enough.
this is the pass that draws the outline, and changes the squares color. I do this pass last.
in prior passes to generate the glow layers, just do the same exact thing, excet, I don't draw anything when the alpha is about 0.9, so float4(0, 0, 0, 0) is what I output, and then if the alpha is lower, I sample, two pixels away from the current and if that alpha is there, I out put float4(1, 0, 0, 0.75), each pass uses less and less alpha and sample further and further away.
The further away it samples, the closer to being the first pass. so pass one samples 4 pixels away, and pass two sample 3 pixels away, so on and so on?
Any of you gurus can give me some ideas?
this is the pass that draws the outline, and changes the squares color. I do this pass last.
PS_OUTPUT PSOutline(float2 UV : TEXCOORD0){ PS_OUTPUT Out; // sample the original color. float2 UV1 = UV; float2 UV2 = UV; float2 UV3 = UV; float2 UV4 = UV; Out.Color = tex2D(coloredtexture, UV); if (Out.Color.a > 0.9) { Out.Color = float4(0, 0, 0, 0.75); } else { UV1.x += TexScale.x; UV2.x -= TexScale.x; UV3.y += TexScale.y; UV4.y -= TexScale.y; Out.Color = tex2D(coloredtexture, UV1); Out.Color += tex2D(coloredtexture, UV2); Out.Color += tex2D(coloredtexture, UV3); Out.Color += tex2D(coloredtexture, UV4); if (Out.Color.a > 0.9) Out.Color = float4(1, 0, 0, 1); } return Out;}in prior passes to generate the glow layers, just do the same exact thing, excet, I don't draw anything when the alpha is about 0.9, so float4(0, 0, 0, 0) is what I output, and then if the alpha is lower, I sample, two pixels away from the current and if that alpha is there, I out put float4(1, 0, 0, 0.75), each pass uses less and less alpha and sample further and further away.
The further away it samples, the closer to being the first pass. so pass one samples 4 pixels away, and pass two sample 3 pixels away, so on and so on?
Any of you gurus can give me some ideas?
This should help you out a lot: Glow but is in assembly (but all the theory is there).
There was also this example on Ziggyware that implements that Glow which is in HLSL and and C#.
The only thing is that the blurring is in both directions, outward from the object and in toward the centre of the object. From the screen shot you took, it seems that you only want that glow to go outward from the object, and not in towards the object. Is that right? So with the technique in those links, the glow would be inside the object as well, but you just need to modify it slightly to match your screen shot.
If so, the only thing I can think is this way (you can do a vertical then horizontal blur, the order doesn't matter) This is basically what both the links present (except I modified the fourth pass to match your screen shot):
First pass: render the scene normally to a texture (probably down sampled to 1/2 or even 1/4 the regular size to save on the total number of pixels operated on. This also affects the glow radius)
Second Pass: Do a separable horizontal Gaussian blur on the texture from the first pass, save to texture
Third Pass: Do a separable vertical Gaussian blur on the texture from the second pass, save to texture
Fouth Pass (Combine results): Add the first and third passes together, but multiply the third pass (blurred texture) by 1 minus the first pass alpha channel (so the glow doesn't go inward) So "(1 - firstPass.a) * thridPass;" So when the glow reaches the object, the alpha channel will be 1 in the first pass, so the added colour will be 0, which will make the glow stop at the boundary of the object.
Hope that helps.
[Edit] some spelling mistakes
There was also this example on Ziggyware that implements that Glow which is in HLSL and and C#.
The only thing is that the blurring is in both directions, outward from the object and in toward the centre of the object. From the screen shot you took, it seems that you only want that glow to go outward from the object, and not in towards the object. Is that right? So with the technique in those links, the glow would be inside the object as well, but you just need to modify it slightly to match your screen shot.
If so, the only thing I can think is this way (you can do a vertical then horizontal blur, the order doesn't matter) This is basically what both the links present (except I modified the fourth pass to match your screen shot):
First pass: render the scene normally to a texture (probably down sampled to 1/2 or even 1/4 the regular size to save on the total number of pixels operated on. This also affects the glow radius)
Second Pass: Do a separable horizontal Gaussian blur on the texture from the first pass, save to texture
Third Pass: Do a separable vertical Gaussian blur on the texture from the second pass, save to texture
Fouth Pass (Combine results): Add the first and third passes together, but multiply the third pass (blurred texture) by 1 minus the first pass alpha channel (so the glow doesn't go inward) So "(1 - firstPass.a) * thridPass;" So when the glow reaches the object, the alpha channel will be 1 in the first pass, so the added colour will be 0, which will make the glow stop at the boundary of the object.
Hope that helps.
[Edit] some spelling mistakes
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement
