Turn square image into round rect button with shine [Objective C]

Question

In this picture you will see several TV show images that have been put into a rounded rect button with the same gloss/shine that an iphone app button usually has.

In one of the icons you even see a ribbon saying "On air".

I'm wondering; how do you replicate this effect?

My guess is the programmer masked an image on top of the square image.

I'm aware that this answer covers turning square images into rounded ones.

However, how do you add the shine; and how would you add the ribbon?

In terms of memory management, is it better to create a new image that has the contents of an image + gloss + ribbon?

Answer 1

You need to apply a mask. This blog post has a PNG or PSD that you could adapt

http://surgeworksmobile.com/iphone/iphone-icons-how-to-preview-the-glossy-effect

You could apply the mask with ImageMagick.

http://www.imagemagick.org/Usage/channels/#masking

If you need to do it on the phone, you'd have to link to a static lib version of ImageMagick or try to figure out how to mask it with CoreImage.