Auto layout issue inside table cell that has dynamic height UILabel and UIView(container)

Question

I am using dynamic height table cell with auto layout and inside the table cell, there are 1 dynamic height UILabel and 1 dynamic UIView which includes multiple UIImageViews.

Here is the layout: Storyboard screenshot

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
     tableView.estimatedRowHeight = 500;
    return UITableViewAutomaticDimension;
}

TableCell:

for(i=0; i<subviews.count; i++)

    UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"ic_image.png"]];

    [imgView setContentMode:UIViewContentModeScaleAspectFill];
    imgView.clipsToBounds = YES;

    [_viewAttaches addSubview:imgView];
    imgView.translatesAutoresizingMaskIntoConstraints = NO;

    if(i==0) {
        NSLayoutConstraint *top = [NSLayoutConstraint
                                       constraintWithItem:imgView
                                       attribute:NSLayoutAttributeTop
                                       relatedBy:NSLayoutRelationEqual
                                       toItem:_viewAttaches
                                       attribute:NSLayoutAttributeTop
                                       multiplier:1.0f
                                       constant:0.f];
        [_viewAttaches addConstraint:top];
     } else {
             UIImageView *prevView = subviews[i-1];
             NSLayoutConstraint *top = [NSLayoutConstraint
                                               constraintWithItem:imgView
                                               attribute:NSLayoutAttributeTop
                                               relatedBy:NSLayoutRelationEqual
                                               toItem:prevView
                                               attribute:NSLayoutAttributeBottom
                                               multiplier:1.0f
                                               constant:10.f];
              [_viewAttaches addConstraint:top];
           }

           NSLayoutConstraint *leading = [NSLayoutConstraint
                                               constraintWithItem:imgView
                                               attribute:NSLayoutAttributeLeading
                                               relatedBy:NSLayoutRelationEqual
                                               toItem:_viewAttaches
                                               attribute:NSLayoutAttributeLeading
                                               multiplier:1.0f
                                               constant:0.f];

            [_viewAttaches addConstraint:leading];

            NSLayoutConstraint *trailing = [NSLayoutConstraint
                                                constraintWithItem:imgView
                                                attribute:NSLayoutAttributeTrailing
                                                relatedBy:NSLayoutRelationEqual
                                                toItem:_viewAttaches
                                                attribute:NSLayoutAttributeTrailing
                                                multiplier:1.0f
                                                constant:0.f];

            [_viewAttaches addConstraint:trailing];


            NSLayoutConstraint *height = [NSLayoutConstraint constraintWithItem:imgView
                                                                              attribute:NSLayoutAttributeHeight
                                                                              relatedBy:NSLayoutRelationEqual
                                                                                 toItem:nil
                                                                              attribute:NSLayoutAttributeNotAnAttribute
                                                                             multiplier:1
                                                                               constant:160];
            [_viewAttaches addConstraint:height];


                if(i==nAttaches-1) {
                    NSLayoutConstraint *bottom = [NSLayoutConstraint
                                                  constraintWithItem:imgView
                                                  attribute:NSLayoutAttributeBottom
                                                  relatedBy:NSLayoutRelationEqual
                                                  toItem:_viewAttaches
                                                  attribute:NSLayoutAttributeBottom
                                                  multiplier:1.0f
                                                  constant:0.f];
                    [_viewAttaches addConstraint:bottom];
                }

                i++;
}

But I got this error:

[LayoutConstraints] Unable to simultaneously satisfy constraints.
    Probably at least one of the constraints in the following list is one you don't want. 
    Try this: 
        (1) look at each constraint and try to figure out which you don't expect; 
        (2) find the code that added the unwanted constraint or constraints and fix it. 

<NSLayoutConstraint:0x174288390 UILabel:0x101157580'Daniel'.height == 21   (active)>,
"<NSLayoutConstraint:0x174288cf0 UILabel:0x101158cb0'0 comments'.height == 21   (active)>",
"<NSLayoutConstraint:0x174288e80 UILabel:0x101157580'Daniel'.top == UITableViewCellContentView:0x101157130.topMargin + 2   (active)>",
"<NSLayoutConstraint:0x174288fc0 V:[UILabel:0x101157580'Daniel']-(-1)-[UILabel:0x1011469b0'I am currently in a happy...']   (active)>",
"<NSLayoutConstraint:0x1742890b0 V:[UILabel:0x1011469b0'I am currently in a happy...']-(0)-[UIView:0x101158b10]   (active)>",
"<NSLayoutConstraint:0x174289240 V:[UIView:0x101158b10]-(-1)-[UILabel:0x101158cb0'0 comments']   (active)>",
"<NSLayoutConstraint:0x1742892e0 UITableViewCellContentView:0x101157130.bottomMargin == UILabel:0x101158cb0'0 comments'.bottom + 1   (active)>",
"<NSLayoutConstraint:0x170284ec0 UIView:0x101158b10.height == 330   (active)>",
"<NSLayoutConstraint:0x17428a640 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x101157130.height == 89   (active)>"


Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x170284ec0 UIView:0x101158b10.height == 330   (active)>

Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKit/UIView.h> may also be helpful.

Please help me what I am missing. Thank you in advance.

http://stackoverflow.com/a/40035858/6656894 refer this answer @Daniel — Himanshu Moradiya, Feb 11 '17 at 05:10
then just give constrain that i give in my answer refer above link . — Himanshu Moradiya, Feb 11 '17 at 08:42
@HimanshuMoradiya Thanks, but the main issue on this is not multi line label. Constraints are breaking when inserting multi image views to container view. — Daniel, Feb 11 '17 at 10:45

dahiya_boy · Answer 1 · 2017-02-11T09:50:00.450

0

Your work done is almost correct keep this below change to solve this

1. Change view hierarchy inside UITableviewCell & create like this below .

-> Timeline TableView
  '-> postecell
     '-> content view
        '-> myView // I added this `UIview` & in this view add all you cell components
          '-> Img User
          '-> lbl Name
          :    :
          :    :

myView constraints :

top, bottom, leading, traling to superview.
edit - remove this below line
1. height with relationship greater than equal to (≥)

Note: be ensure every component in cell must have top bottom and fixed height with relationship = and label which is dynamic have relationship ≥.

2. You code for height is to be like this

- (CGFloat)tableView:(UITableView *)tableView    estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath {
     return 250; // it is the height of cell which is in the storyboard after creation of custom cell.
}   

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    return UITableViewAutomaticDimension; 
}

edit

View Hierarchy

Storyboard

Output:

edited Feb 11 '17 at 09:50

answered Feb 11 '17 at 05:19

dahiya_boy

9,298
1
30
51

I moved dynamic height label(top, leading, trailing, >=30 height constraints) into container View(myView in your example). The container View has >= 30 height constraints as well as top, leading, trailing constraints to superview. Below the dynamic label has added UIImageViews which has top(to upper view), leading and trailing(to superview) and static height constraints. Last UIImageView has bottom constraint to superview. But the issue is the same. – Daniel Feb 11 '17 at 07:50
Please send me your view hierarchy screenshot in Debug View Hierarchy that dynamic label, container view, image views constraints expanded in the tree. Or can you send me the same source you have? – Daniel Feb 11 '17 at 10:30
Give me your email id i will send you demo. and don't forget to accept and up-vote the answr. :) :p :p – dahiya_boy Feb 11 '17 at 10:48
daniel.pelto@yahoo.com is my email address. – Daniel Feb 11 '17 at 11:19
@Daniel check your email. If you have something to change then say. – dahiya_boy Feb 11 '17 at 11:23
This sample includes static views only, but I need random UIImageViews added in runtime. When I have static cells, it works fine. – Daniel Feb 11 '17 at 13:40
Then Create a cell which have only UIImge. And load this cells as how many uiimages you have for each username. – dahiya_boy Feb 11 '17 at 14:58

Auto layout issue inside table cell that has dynamic height UILabel and UIView(container)

1 Answers1