UITableViewCell automatic height management

We all know that iOS8 brought in really nice changes. Well, it be will be too long post to describe all of them. But I will talk about one of my most favorite features Apple added into this release.

Automatic height management for UITableViewCell with Autolayout

Yes, you can fit any arbitrary text into UITableViewCell without having to explicitly calculate the estimated height of content. Just few autolayout constraints, UILabel settings and you are all up.

Besides UILabel, this trick works with UITextView too as I recently observed.

Suppose you have UITableView inside your UIViewController and UITableView has custom cell whose owner is custom subclass of UITableViewCell. We have added UILabel (Or any other UIView subclass whose content can be dynamically switched). Now, however, the text which goes on the UILabel could be arbitrary. We want to setup the flow in such a way that UITableViewCell can adjust its height based on the content so that no portion of content will be truncated.

UITableView setup

Let us say tableView is an instance of UITableView on which you want to display content.

We will assume that you already setup datasource and delegate for this tableView. Also all necessary UITableView protocol methods are also implemented.

First off you will have to setup following two properties on UITableView instance.

self.tableView.rowHeight = UITableViewAutomaticDimension
self.tableView.estimatedRowHeight = <estimated_row_height>

where estimated_row_height is the general or average height of the UITableViewCell you think is going to be. If you think most of the cells are going to be of the height of x pixels, you can set it to value of x. It's value is highly subjective and depends on your application. But make sure not to deviate value too much from your estimated value since it can impact the performance

UILabel setup

Let's say label is an instance of UILabel which you are trying to setup. Also, label is a subclass of contentView of our custom UITableViewCell class.

set number of lines for label to value of 0

label.numberOfLines = 0

Also, when you set constraint for views on UITableViewCell subclass, make sure to set the constraint to both top and bottom of views' superclass. (This is a contentView which acts as a superview to all UITableViewCell subviews)

To make things more clear, here are few images on how you should setup constraints on UITableViewCell subclasses from top and bottom of a superView

With single UILabel

With UILabel and UIImageView

So far so good. Now you can try to assign text of arbitrary length to this UILabel on the UITableViewCell and label will automatically adjust in height.

If you are looking for extra breathing space on top and bottom of cell, try adding more padding around. The beauty is that, this padding will still be maintained no matter how big text gets. The only thing that gets changed is UILabel height.

Caveat : Since you are looking for label to be of variable size, make sure you do not add constraint for its height. Only add constraints relative to top and bottom of adjacent views. Everything else will be taken care of by the autolayout.

I have also created a sample GitHub Automatic row dimension demo project for this feature. Please have a look at it and try to follow an example if something doesn't look quite alright. Feel free to send merge requests if you are looking to add new features.

As always, feedback, critic, suggestions are welcome. I am looking forward to hear from you. Happy Coding!