Norway


Topics

Topics

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 .

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()

- 246 1 - #245: Masking Views with Text Using CATextLayer 📖 – Little Bites of Cocoa – Tips and techniques for iOS and Mac development

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 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  of "

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

imageView.layer.mask = textLayer

- 246 2 - #245: Masking Views with Text Using CATextLayer 📖 – Little Bites of Cocoa – Tips and techniques for iOS and Mac development

!

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



Source link

LEAVE A REPLY

Please enter your comment!
Please enter your name here