Sumit Sumit - 6 months ago 49
Objective-C Question

Setting auto layout constraints programmatically on two views in ViewController

I am trying to add two UIView on ViewController. One of them is plain UIView and other is UITableView. I am not quite sure how to set height constraint on them in such away that UITableView will be of height required for its content and other view can resize itself based on UITableView height.

Below is the simple sketch and code I am using for setting up those constraints.

enter image description here

NSDictionary *views = NSDictionaryOfVariableBindings(_infoView,_infoTableView);

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"[_infoView]"
options:0
metrics:nil
views:views]];

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[_infoView]-[_infoTableView]"
options:0
metrics:nil
views:views]];

// Width constraint
[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.infoView
attribute:NSLayoutAttributeWidth
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeWidth
multiplier:1.0
constant:0]];

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.infoTableView
attribute:NSLayoutAttributeWidth
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeWidth
multiplier:1.0
constant:0]];

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.infoView
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:0]];

[self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.infoTableView
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:0]];


Any comments / feedback would be highly appreciated.
Thanks.

Answer

You are on the right track. The trick here is that you need to dynamically update the height of tableView to its contentSize.height so infoView will know it should either be vertically expanded or shrunk:

First you define a property that will hold the height constraint:

@property (nonatomic, strong) NSLayoutConstraint *tableViewHeightConstraint;

- (void)viewDidLoad {
  ...
  self.tableViewHeightConstraint = [NSLayoutConstraint constraintWithItem:self.tableView
                                                                attribute:NSLayoutAttributeHeight
                                                                relatedBy:NSLayoutRelationEqual
                                                                   toItem:nil
                                                                attribute:NSLayoutAttributeNotAnAttribute
                                                               multiplier:0.0
                                                                 constant:350.0];
}

Then you can update the height constraint right after tableView knows its contentSize (ex: viewDidAppear:animated):

- (void)viewDidAppear:(BOOL)animated {
  [super viewDidAppear:animated];

  self.tableViewHeightConstraint.constant = self.tableView.contentSize.height;
  [self.view layoutIfNeeded];
}  

I created a sample project for you so you can play around with it to have a better understanding about what I intend to do.

enter image description here