Friday, October 02, 2015

Changing UITextView's textContainer.layoutManager.delegate to your UIViewController Swaps Line Break from Word to Character Wrap

TL;DR Don’t assign UITextView.textContainer.layoutManager.delegate to your UIViewController, bad things happen. 
Versions: OS X 10.10, 10.11 Xcode 7.0.x iOS SDK 8, 9 

Some of the highlight WWDC 2013 sessions for me where those about Text Kit. That was largely because I was working at Dow Jones on The Wall Street Journal and Barron’s iOS apps which had native text layout code. It worked extremely well, but it was largely Core Text, and it wasn’t the easiest to maintain. I thought we might be able to replace a lot with Text Kit. Unfortunately I never got the chance, but I was always curious to try Text Kit’s capabilities.

Fast forward a few years and I got my change this past week. Designers handed me a screen that looks like this:

Text Kit Design

What I always remembered about Text Kit was the easy way to exclude paths from the layout for things like images and the text could flow around it.

To refresh my memory on how to do that, I did some searching and came across Ray Wenderlich’s Text Kit Tutorial, Updated with Swift. Great, read the article, downloaded the sample, and started using the UIBezierPath calculation stuff in my real project.

That’s where things went off the rails but I didn’t realize it until today. You see the tutorial had this:

let exclusionPath = timeView.curvePathWithOrigin(timeView.center)
textView.textContainer.exclusionPaths = [exclusionPath]

The method curvePathWithOrigin was calculating a round UIBezierPath because the tutorial was inserting a round graphic into the UITextView. I needed to create a rectangular UIBezierPath (see orange box in above image), but didn’t know you could do. Maybe it was the pain from a hand injury, maybe just ignorance or I forgot, but I didn’t get it.

Of course the round bezier path from the tutorial was not flowing text around the rectangle image correctly. It all seems to obvious in hindsight.

I tried many things to fix this issue. One of those was crawling down UITextView’s internal object tree and setting textContainer.layoutManager.delegate to my UIViewController instance. I usually never do things like this but again I probably wasn’t thinking very clearly.

Setting the delegate appeared to make the text flow better because character wrapping became the default, so I left the delegate assignment in. What a mistake!

When I realized how stupid I was being with UIBezierPath and used a rectangular exclusionPath, UITextView was defaulting to character wrapping instead of word wrapping.

Of course I was going through the Six Stages of Debugging:

I finally got to Stage 5 when I built up a sample line by line until I figured out setting the textContainer.layoutManager.delegate to my UIViewController instance was a really dumb idea.

Sometimes when writing code, you make bad choices and it takes a while to figure that out...