OpenGL ES Shader for highlighting 2D images

Question

I am working on a 2D iOS game using OpenGL 2.0, and I am wondering if it is possible to write a shader that will display images with radiance. All images are two-dimensional sprites. The examples of shaders that I saw for selection are for 3D objects, so I'm not sure if this is possible for 2D images.

Answer 1

Do you accept an edge detection filter (like Sobel) by creating an image similar to the one shown in the Wikipedia article , followed by a Gaussian blur on the results of this, to soften the edges and give it more glow, then connect this image to your scene?

In practice, you could probably just reuse the three-dimensional shaders you saw, although theoretically you could check the number of depths (with some advanced efforts in ES), each of those that I have ever seen was only 2 effect on the captured image.

EDIT: upon further consideration, the Laplacians may be a little easier to apply than Sobel, because it can be done as simple convolutional shaders (as described in sections like this ). Although, to be safe on your mobile phone, you might want to stick to 3x3 cores more and write different shaders for each effect, rather than doing it with data. So, for example, a coarse Gaussian blur written out in length:

void main() { mediump vec4 total = vec4(0.0); mediump vec4 grabPixel; total += texture2D(tex2D, texCoordVarying + vec2(-1.0 / width, -1.0 / height)); total += texture2D(tex2D, texCoordVarying + vec2(1.0 / width, -1.0 / height)); total += texture2D(tex2D, texCoordVarying + vec2(1.0 / width, 1.0 / height)); total += texture2D(tex2D, texCoordVarying + vec2(-1.0 / width, 1.0 / height)); grabPixel = texture2D(tex2D, texCoordVarying + vec2(0.0, -1.0 / height)); total += grabPixel * 2.0; grabPixel = texture2D(tex2D, texCoordVarying + vec2(0.0, 1.0 / height)); total += grabPixel * 2.0; grabPixel = texture2D(tex2D, texCoordVarying + vec2(-1.0 / width, 0.0)); total += grabPixel * 2.0; grabPixel = texture2D(tex2D, texCoordVarying + vec2(1.0 / width, 0.0)); total += grabPixel * 2.0; grabPixel = texture2D(tex2D, texCoordVarying); total += grabPixel * 4.0; total *= 1.0 / 16.0; gl_FragColor = total; } 

And the discovery of the Laplacian region ends similar, but with different constants.

As an optimization, you should work out your relative sampling points in the vertex shader, and not in the fragment shader, as much as possible, given the restriction on changes, since this will avoid dependent texture readings.