How to place two UILabels in a row so that they center vertically based on the size of the text in iOS?

Question

I have a table row with a label and a button that should both be centered vertically based on the text displayed. That means that the height of the row should be based on which text is the largest. See the image below:

I have tried doing this by setting the line break to WordWrap and vertically centering both, however the UIButton on the right does not scale accordingly.

Constraints:

*label* top 5 to contentview
*label* bottom 5 to contentview
*label* leading 5 to contentview
*label* width 0.75 of contentview

*button* leading 5 to label
*button* trailing 5 to contentview
*button* bottom 5 to contentview
*button* top 5 to contentview                                  

Answer 1

try this setup

Right label

Left Label

Now Put Button over right label like this

Answer 2

After setting text to both the labels you can get endY of both labels and return the appropriate one's height+padding inside tableView delegate.

Answer 3

Don't set a height constraint on any of the views. Just set top and bottom constraints for both the label and the button, and the leading and trailing obviously.

You don't even need to make them centered vertically, the UITableViewCell will wrap them perfectly for you if they have the same top and bottom margins.