Inner Shadow Effect for line drawn to screen?

Go To StackoverFlow.com

0

I've made an iOS program that allows the user to draw a line on the screen with their finger. I used the touchesBegan, touchesMoved, and touchesEnded methods, along with creating a CGContext and drawing my line that way. I want the line to look as though it is beveled into the screen, almost as if it was carved. How would this be possible?

2012-04-04 22:29
by Kyle Beard


0

You can achieve a simple bevel by stroking your lines three times:

  1. first, with a color brighter than the background at points p(x-1, y-1) relative to the actual line
  2. then, your line color at the actual line position, points p(x, y)
  3. then, brighter than the line color, but darker than the background at p(x+1, y+1)

You can think of this as a light shining onto your lines from above and to the left, making the lower coordinates brighter, passing over the bevel and having a little shadow cast on the higher coordinates.

Once you get the hang of thinking through the pseudo-3D geometry this way, you can create prettier bevels, including details inside the line. Those will take more strokes.

2012-04-05 00:03
by danh
Ads