Text is a huge part of iOS apps. Today we'll look at one way we can polish up the text in our apps, by allowing it to naturally "flow" around objects. Let's begin.
We'll start with a "before" picture. Here we've got a basic setup with some text and an image in the top right corner. Nothing too fancy here, just a regular UITextView and UIImageView:
let imageView = UIImageView(image: UIImage(named: "steve"))
let textView = UITextView(frame: .zero)
textView.text = "Here's to the crazy ones..."
This looks fine. But our text is needlessly narrow. It'd be great if we could make the text expand to the full width of the device. We'll change our Text View's layout so it does:
Well, we're getting closer. Now we just need a way to make the text "flow" or "wrap" around our image. We'll start by getting the frame of the image view, then we'll create a path from it:
let imagePath = UIBezierPath(rect: imageView.frame)
Finally, we'll set our new path as one of the exclusionPaths
of our Text View's textContainer
:
textView.textContainer.exclusionPaths = [imagePath]
Success! Since exclusionPaths
is an Array, we can flow text around as many shapes as we want!