Adding placeholder support to UITextView

Oct 31, 2017 · Follow on Twitter and Mastodon swiftuikit

This post shows how to apply the UITextField placeholder behavior to a UITextView, which natively lacks this support.

I basically solved this by adding two extension functions to UITextView:

extension UITextView {
    
    func setupPlaceholder(text: String, textColor: UIColor) {
        guard self.text.isEmpty else { return }
        self.text = text
        self.textColor = color
    }
    
    func setupPlaceholderBeforeEditing(
        textColor: UIColor, 
        placeholderColor: UIColor) {
        guard self.textColor == placeholderColor else { return }
        self.text = ""
        self.textColor = textColor
    }
}

The placeholder text and color is customizable. I add app-specific extensions that call the functions with app-specific colors, so I don’t have to pass around colors.

When I create a text view, I run setupPlaceholder(...) to set up a standard placeholder. This operation will abort if the view already has text content.

When editing begins, I call setupPlaceholderBeforeEditing(...) to ensure the placeholder text is correctly removed.

To determine if a view currently displays a placeholder, we compare text and placeholder colors. However, this requires that we use different text colors for text and placeholder text.

When editing ends, I call setupPlaceholder(...) once again to re-apply the placeholder, if the user hasn’t entered any text.

Discussions & More

Please share any ideas, feedback or comments you may have in the Disqus section below, or by replying on Twitter or Mastodon.

If you found this text interesting, make sure to follow me on Twitter and Mastodon for more content like this, and to be notified when new content is published.

If you like & want to support my work, please consider sponsoring me on GitHub Sponsors.