Buddybuild is a CI, CD and user feedback platform built for mobile development teams - sign up for free and start building better apps!

Core Graphics and Core Animation are incredibly powerful tools with lots of useful components. Today we'll try out one of them, CATextLayer, and learn how it can help us create some fun and interesting visuals. Let's get started.

First, we'll need a view to mask. We'll create a UIImageView and use this great looking Apple TV marketing image to test things out.

let imageView = UIImageView(
  UIImage(named: apple-tv-color-bars.png)
)

imageView.sizeToFit()

Then, we'll need a CATextLayer. We'll configure it to so it has the same size as our imageView, and do some Core Graphics housekeeping:

let textLayer = CATextLayer()

textLayer.frame = imageView.bounds
textLayer.rasterizationScale = UIScreen.mainScreen().scale
textLayer.contentsScale = UIScreen.mainScreen().scale

Next, we'll configure the text layer to look the way we want. We'll set a font, alignment, and wrapping/truncation settings:

textLayer.alignmentMode = kCAAlignmentCenter
textLayer.fontSize = 42.0
textLayer.font = UIFont(name: "TrebuchetMS-Bold", size: 42.0)
textLayer.wrapped = true
textLayer.truncationMode = kCATruncationEnd

We'll give it some content to display:

textLayer.string = "Little Bites of Cocoa"

Finally, we'll set the text layer as the mask of our imageView's layer.

imageView.layer.mask = textLayer

Success!

Looking for a library that does all this for you (plus a bit more)? Check out Translucid by Lucas Ortis.