0

I have an image in my iOS app. I want to use css masking technique to achieve the same image but with colors. The 1st image is the original image and the 2nd image is the output image that is required. How can i achieve it in iOS :

Original Image

Output Image

Dhruv Jindal
  • 1,056
  • 10
  • 17

1 Answers1

2

The drawing system on iOS is called Quartz 2D. Here's the documentation:

https://developer.apple.com/library/ios/documentation/graphicsimaging/conceptual/drawingwithquartz2d/dq_overview/dq_overview.html

You will be able to use the shape of your image as a clipping path and then draw a gradient.

Alternatively, a simpler way is to draw a simple gradient with a CAGradientLayer and then mask the layer; see the documentation on CALayer and CAGradientLayer.

matt
  • 515,959
  • 87
  • 875
  • 1,141
  • can you send me sample code. I really have no idea where to start. I was not able to find topic in that site relating to my question. – Dhruv Jindal Jan 20 '14 at 15:23
  • 1
    Drawing in Quartz 2D: http://www.apeth.com/iOSBook/ch15.html#_paths_and_drawing Layers, including gradient layers and masking: http://www.apeth.com/iOSBook/ch16.html#_layers_that_draw_themselves – matt Jan 20 '14 at 18:11
  • You also have [the answer here](http://stackoverflow.com/a/15868472/608157) that draws a gradient inside a shape using Core Graphics / Quartz 2D (plus a drop shadow that you can ignore if you don't want) and shows how to do the same drawing using CALayers. – David Rönnqvist Jan 21 '14 at 08:56