IPhone SDK: how to draw a rounded rectangle with semi-transparent gradient and drop shadow

I am experimenting with drawing on the iPhone, manually creating UI parts for my application (graph in this case). Basically I want to draw a rounded rectangle, shadow and semi-transparent gradient like filling the rectangle. Here is a screenshot of my photoshop layout: alt text http://img36.imageshack.us/img36/6097/picture1nvf.png

I got it the same way as creating a solid rounded rectangle with shadow cloth using CALayer, but in order to get the shape and shadow for the bubble, I have to set a background color that prevents me from having my semi-transparent gradient as the only fill on the layer.

I did a bit of work on this, and read the Core Animation programming guide, but I made no further progress. I feel like the answer is right under my nose.

What am I missing?

PSI know I could possibly use an image file for this, but I'm trying to do it this way because I want to learn and someday I will want to do some cool animation stuff with that.

0


a source to share


1 answer


  • Fill the rounded rectangle with shadow. Make it fill with 100% opacity - you will make it transparent in the next step.
  • Fill the same rounded rectangle with no drop shadow using Destination Out Blending Mode at (1.0 is the desired opacity). For example, if you want 40%, do a Destination-Out draw at 60%. Think about it as you subtract this from the opacity of the image.


+5


a source







All Articles