iOS / GLES2: How to achieve Glow Effect

2020-04-19 08:46发布

问题:

I have a compass style needle, free to spin.

I need it to glow when it approaches a certain orientation, say 55 degrees.

I want to have NeedleView subclass UIView, so I can manipulate (NeedleView*)needleView as if it was a UIView, just have a couple of extra methods - (void) feedAngle: (float) theta; - (void) feedGlow: (float) glow_01;

doing a bit of research, I have found that the common technique is to take a greyscale copy of the needle's image, blur it, save it as a GL texture, and then wrap it onto a quad that sits behind the actual needle's quad.

then I am a bit woolly....

I guess I set the RGBA on the corner points to be (r,g,b) of my desired glow colour, a=glowFactorForThisFrame

and then I set glBlendmode to something appropriate

and then I draw the textured quad for the blur

what I want is something where Alpha is 1 everywhere on the original needle, but it bleeds gradually to complete transparency as we move further away

...

for a start, I would like to find some code that takes care of blurring a greyscale bitmap, I would rather do this from code than in photo shop. (I realize this would take a lot of time on an actual device, so maybe I can calculate it the first time the app is run, save it to file, and subsequently just load from file)

secondly, I'm very sketchy on the precise details of what I have to do.

could someone help me in on either of these points?

回答1:

If you use drawRect for your drawing your needle you could possible do something like this:

Is there an easy way or library available to let text glow?



回答2:

You could create the glow around the needle's image in Photoshop. Just replace the image in the app at runtime when glow is turned on.



回答3:

I experimented with a lot of approaches here.

basically I neeed two images; one glowing and one not.

then I can draw them as CALayers on top of one another, and hijack CADisplayLink, setting

glowLayer.opacity = glowFac;
dullLayer.opacity = (1 - glowFac);

I also played with fiddling around in GL shaders, passing the glow factor as a uniform, but this is a ton of code to do basically the same thing.

NB I needed to find a graphic artist to 'glow' the image