CODEWITHSUNDEEP
iosswiftxcodeuitableviewconstraints
LilMoke
LilMoke

Reputation: 3454

xcode swift constraint issue with tableview and uilabel resting

I have posted this earlier but could not get an answer as to how to solve my issue so I am trying again. Hopefully someone with better knowledge than me when it comes to constraints can help.

Briefly, I have a UIViewController with a UITableView. One of the cells contains to UILabels. I am trying to figure out how to may the second UILabel resize when the text is wrapped.

Here is screenshot: enter image description here

I have tried, and it was explained to me, to have four constraints on the LabelBio.

  1. Leading to superview - I have tried both margin and superview
  2. Trailing to superview
  3. Top to LabelSellerInfo
  4. Height >=

But these do not seem to solve the issue. I am sure I am doing something wrong, but I am at a loss as to what I am missing. Someone also suggested to have a LabelBio to superview bottom but that did not work as well.

With the attached screenshot, here is my result:

enter image description here

I am new to constraints and do not really understand what is wrong. Is someone able to articulate a solution to me so I can understand how to make this work. Everything I read about constraints makes me believe this should work but it does not.

I also have tried both defining the method heightForRowAt and retiring UITableViewAutomaticDimension and I have tried setting .rowHeight = UITableViewAutomaticDimension.

If any more info is needed to help me to solve my problem please let me know.

My other post is here: Automatically increase/decrease UILabelView Height in UITableViewCell?

Thanks for any help!!

Upvotes: 0

Views: 588

Answers (2)

Alan Kantz
Alan Kantz

Reputation: 365

Let’s divide this into three problems:

  1. Make a UILabel expand vertically to hold arbitrary text
  2. Make a TableViewCell subclass expand vertically to hold arbitrary content
  3. Make both work together

Make UILabel expand vertically to hold arbitrary text

When you define your UILabel, make sure to do something like:

label.numberOfLines = 0
label.lineBreakMode = .byWordWrapping

This will tell your label not to use an explicitly-provided number of lines and to break the provided text naturally at word boundaries. Combined with a fixed or maximum width, this will create an implicit number of lines (and thus implicit height) for your label.

Check the UILabel documentation for more.

Make a TableViewCell subclass expand vertically to hold arbitrary content

Apple includes a special section on self-sizing table view cells in the Auto Layout Guide. The important part is to set these two properties in your table view (not in the table view cell):

tableView.estimatedRowHeight = // Pick an appropriate value
tableView.rowHeight = UITableViewAutomaticDimension

Once both properties are set, your table view cells will use auto layout to determine their height.

Make both work together

Your table view cells are now looking to their contents to provide an implicit height. You need to create an unbroken chain of constraints from the top of the cell to the bottom to push them apart to the correct height. In the example from your images:

  • Constrain LabelSellerInfo top to superview top margin
  • Constrain LabelSellerInfo bottom to LabelBio top (plus any margin)
  • Constrain LabelBio bottom to superview bottom margin

You should also constrain the width or leading and trailing edges of LabelBio in some way; what you show in your image is fine. Taken together, these settings and constraints will create self-resizing table view cells containing a LabelBio that changes height based on its text.

Upvotes: 1

Puneet Sharma
Puneet Sharma

Reputation: 9484

You have already done most of the work.
Adding bottom constraint of Labelbio to contentView should be enough to enable contentView to calculate its height.

Upvotes: 1

Related Questions