LayoutConstraints - 无法同时满足约束

Question

I have an app, when I click on my profile page, I kept getting these errors in my console

I have tried

This is the entire constraint that I have on my profile page

I kept getting

john
jane
andrew
2018-07-31 11:58:46.821640-0400 tableInTabbed[4355:5682078] [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:0x604000281130 UIImageView:0x7ff91cf1d030.width == 70   (active)>",
    "<NSLayoutConstraint:0x6040002812c0 UIImageView:0x7ff91cf1d030.width == UIImageView:0x7ff91cf1d030.height   (active)>",
    "<NSLayoutConstraint:0x604000280d20 UITableViewCellContentView:0x7ff91cf1c7f0.bottomMargin == UIImageView:0x7ff91cf1d030.bottom + 52.67   (active)>",
    "<NSLayoutConstraint:0x6040002815e0 UIImageView:0x7ff91cf1d030.top == UITableViewCellContentView:0x7ff91cf1c7f0.topMargin + 29.33   (active)>",
    "<NSLayoutConstraint:0x60c000290040 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7ff91cf1c7f0.height == 168   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x6040002812c0 UIImageView:0x7ff91cf1d030.width == UIImageView:0x7ff91cf1d030.height   (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.
2018-07-31 11:58:46.822304-0400 tableInTabbed[4355:5682078] [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:0x604000280d20 UITableViewCellContentView:0x7ff91cf1c7f0.bottomMargin == UIImageView:0x7ff91cf1d030.bottom + 52.67   (active)>",
    "<NSLayoutConstraint:0x6040002815e0 UIImageView:0x7ff91cf1d030.top == UITableViewCellContentView:0x7ff91cf1c7f0.topMargin + 29.33   (active)>",
    "<NSLayoutConstraint:0x604000281310 UIImageView:0x7ff91cf1d030.height == 70   (active)>",
    "<NSLayoutConstraint:0x60c000290040 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7ff91cf1c7f0.height == 168   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x604000281310 UIImageView:0x7ff91cf1d030.height == 70   (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.
2018-07-31 11:58:46.822846-0400 tableInTabbed[4355:5682078] [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:0x60c00028fa00 UIImageView:0x7ff91cc140c0.width == 70   (active)>",
    "<NSLayoutConstraint:0x60c00028ff00 UIImageView:0x7ff91cc140c0.width == UIImageView:0x7ff91cc140c0.height   (active)>",
    "<NSLayoutConstraint:0x60c00028a8c0 UITableViewCellContentView:0x7ff91cc13cb0.bottomMargin == UIImageView:0x7ff91cc140c0.bottom + 52.67   (active)>",
    "<NSLayoutConstraint:0x60c000289b50 UIImageView:0x7ff91cc140c0.top == UITableViewCellContentView:0x7ff91cc13cb0.topMargin + 29.33   (active)>",
    "<NSLayoutConstraint:0x60c000290900 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7ff91cc13cb0.height == 168   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x60c00028ff00 UIImageView:0x7ff91cc140c0.width == UIImageView:0x7ff91cc140c0.height   (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.
2018-07-31 11:58:46.823293-0400 tableInTabbed[4355:5682078] [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:0x60c00028a8c0 UITableViewCellContentView:0x7ff91cc13cb0.bottomMargin == UIImageView:0x7ff91cc140c0.bottom + 52.67   (active)>",
    "<NSLayoutConstraint:0x60c000289b50 UIImageView:0x7ff91cc140c0.top == UITableViewCellContentView:0x7ff91cc13cb0.topMargin + 29.33   (active)>",
    "<NSLayoutConstraint:0x60c00028fb90 UIImageView:0x7ff91cc140c0.height == 70   (active)>",
    "<NSLayoutConstraint:0x60c000290900 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7ff91cc13cb0.height == 168   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x60c00028fb90 UIImageView:0x7ff91cc140c0.height == 70   (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.
2018-07-31 11:58:46.823961-0400 tableInTabbed[4355:5682078] [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:0x60c000290ae0 UIImageView:0x7ff91cc16a40.width == 70   (active)>",
    "<NSLayoutConstraint:0x60c000290b30 UIImageView:0x7ff91cc16a40.width == UIImageView:0x7ff91cc16a40.height   (active)>",
    "<NSLayoutConstraint:0x60c000290cc0 UITableViewCellContentView:0x7ff91cc16840.bottomMargin == UIImageView:0x7ff91cc16a40.bottom + 52.67   (active)>",
    "<NSLayoutConstraint:0x60c000290d60 UIImageView:0x7ff91cc16a40.top == UITableViewCellContentView:0x7ff91cc16840.topMargin + 29.33   (active)>",
    "<NSLayoutConstraint:0x6040002822b0 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7ff91cc16840.height == 168   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x60c000290b30 UIImageView:0x7ff91cc16a40.width == UIImageView:0x7ff91cc16a40.height   (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.
2018-07-31 11:58:46.824333-0400 tableInTabbed[4355:5682078] [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:0x60c000290cc0 UITableViewCellContentView:0x7ff91cc16840.bottomMargin == UIImageView:0x7ff91cc16a40.bottom + 52.67   (active)>",
    "<NSLayoutConstraint:0x60c000290d60 UIImageView:0x7ff91cc16a40.top == UITableViewCellContentView:0x7ff91cc16840.topMargin + 29.33   (active)>",
    "<NSLayoutConstraint:0x60c000290b80 UIImageView:0x7ff91cc16a40.height == 70   (active)>",
    "<NSLayoutConstraint:0x6040002822b0 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7ff91cc16840.height == 168   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x60c000290b80 UIImageView:0x7ff91cc16a40.height == 70   (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.

This is what I have

//
//  ProfileViewController
//  tableInTabbed
//
//  Copyright © 2018 LR Web Design. All rights reserved.
//

import UIKit

class ProfileViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

    let profiles = ["john", "jane", "andrew"]
    let devicesInProfile = ["3", "5", "10"]

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return (profiles.count)
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! ViewControllerTableViewCell
        cell.profileImg.image = UIImage(named: profiles[indexPath.row] + ".jpg")
        cell.profileName.text = profiles[indexPath.row]

        print(profiles[indexPath.row])

        return cell

    }

    override func viewDidLoad() {
        super.viewDidLoad()
    }

} 

I just want to get rid of the error message.

Update

@Sandeep, after trying your answer, I ended up with this final constraint

This is the result

Can you please suggest a bit more ?

Answer 1

Step 1:

Drag a View to your cell and apply horizontally and vertically center constraints to to your view (This will show few constraint breaks but hang on a bit)

Step 2:

Drag imageView to view and apply height constraint/ aspect ratio/ leading / height and bottom constraint as shown

Step 3:

Drag UILabel to View preferably right side of ImageView and apply trailing constraint and leading constraint to label. Leading constraint will be to content view of cell while leading constraint to UIImageView.

Trailing Constraint to Label

Now add Leading constraint to UIImageView (Control drag from label to imageView and select horizontal spacing)

Finally control drag from label to imageView again and select center vertically

That should be it :)

If everything is fine final constraints should look like

Hope this helps

Answer 2

What have you did in your code seems to be fine, but it has nothing to do with what have you seen in the console.

First, you should know that red constraints means that there is something wrong, more specifically it means that the interface builder is unable to recognize what to achieve because there is at least one constraint missed (and that's why you are seeing these complains on the console).

Therefore, I would highly recommend to avoid following the approach of "Adding Missing Constraints" or "Reset to Suggested Constraints" , it is not an elegant option to deal with constraints; Most of the time, even if they didn't add red (missing) constraints, it won't leads to the expected result, which seems to be logical because it can't be so magical to read your mind thoughts and translate it, they could be more than just one aspect for determining the way of how to setup the constraints! Instead, do it by your self, that's the good approach for achieving what's exactly it should look/behave. Keep in mind that it is not just one static way to do it, after getting understanding the that Auto Layout works you figure that there is more than one way to achieve it.

In general, the expected result is to see blue lines (constraints) instead of red or orange.

Now, because it might be broad to describe how to setup your constraints (Auto Layout), I would suggest to check: Understanding Auto Layout from Apple, it is a very good place to start with.

Answer 3

1- Make sure that only one path of elements from top to bottom is hooked to the contentView , if you see red lines , disconnect bottom constraint and change middle items constraints , then re-hook it again

2- Set bottom most constraint priority to 999

3- Set leading to the imageView and only the bottom - most element should be hooked to the contentView's bottom

//

Blue lines here should only be constraints with img width&height

//

Set this in viewDidLoad

tableView.estimatedRowHeight = 200;

tableView.rowHeight = UITableViewAutomaticDimension;