How to draw a 2d shadow like css3?

beginners
#1

I was tried to draw a rounded rect’s shadow.

How can I achieve this effect like css3? It’s similar to the Windows 7’s window.

Does the ofFbo might help? I truly don’t have any concept about it.

#2

To achieve this programmatically, I would do something like the following:

Create an ofFbo with an alpha channel and draw the rounded rect to it in black.
Use a blur shader to add a feathered edge to the rect - Have a look at Kyle McDonald’s ofxBlur addon here.
Draw the fbo.
Draw the blue rounded rect over it.

If you’re unfamiliar with FBOs have a look at the documentation. There’s also plenty of info on the forum.

1 Like
#3

Awesome! I‘ve tried to written a blur addon before, but it’s too slow.This addon really helps!