UIImage vs. CIImage vs. CGImage

As someone coming from a web development background, learning iOS development can a bit challenging. One concept I’ve seen those who are new to iOS get confused with is the difference between UIImage, CIImage, and CGImage.

From a high level view, there is a difference because all of UIKit, CoreImage, and CoreGraphics does fundamentally different things that there can not be a unified image format. These frameworks, however, work together well. The conversion are optimized and as fast as possible.

UIImage

Apple describes a UIImage object as a high-level way to display image data. You can create images from files, from Quartz image objects, or from raw image data you receive. They are immutable and must specify an image’s properties at initialization time. This also means that these image objects are safe to use from any thread.

Typically you can take NSData object containing a PNG or JPEG representation image and convert it to a UIImage. To create a new UIImage, for example:

var newUIImage = UIImage(data: data)
//where data is a NSData

CIImage

A CIImage is a immutable object that represents an image. It is not an image. It only has the image data associated with it. It has all the information necessary to produce an image.

You typically use CIImage objects in conjunction with other Core Image classes such as CIFilter, CIContext, CIColor, and CIVector. You can create CIImage objects with data supplied from variety of sources such as Quartz 2D images, Core Videos image, etc.

It is required to use the various GPU optimized Core Image filters. They can also be converted to NSBitmapImageReps. It can be based on the CPU or the GPU. To create a new CIImage, for example:

var newCIImage = CIImage(image: image)
//where image is a UIImage

CGImage

A CGImage can only represent bitmaps. Operations in CoreGraphics, such as blend modes and masking require CGImageRefs. If you need to access and change the actual bitmap data, you can use CGImage. It can also be converted to NSBitmapImageReps. To create a new UIImage from a CGImage, for example:

var aNewUIImage = UIImage(CGImage: imageRef)
//where imageRef is a CGImage

Conclusion

Hopefully this clears up any confusion on when to use UIImage, CIImage, and CGImage.

Show your support

Clapping shows how much you appreciated Randall Leung’s story.