UITableViewCell中的宽高比NSLayoutConstraint中断

Question

我正在尝试为UITableViewCell的UIImageView设置适当的NSLayoutConstraint 。 所需的约束如下：

• 长宽比为16：9
• 0领先
• 0尾随
• 11顶
• 11底

UIImageView是单元格contentView的唯一子视图。 我设置了tableView.rowHeight = UITableViewAutomaticDimension和tableView.estimatedRowHeight = 80

2018-03-28 15:52:30.454688-0400 TestApp[28844:694668] [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:0x604000486cc0 UIImageView:0x7f91cf670470.width == 1.77778*UIImageView:0x7f91cf670470.height   (active)>",
    "<NSLayoutConstraint:0x604000486e50 H:|-(0)-[UIImageView:0x7f91cf670470]   (active, names: '|':UITableViewCellContentView:0x7f91cf66f7e0 )>",
    "<NSLayoutConstraint:0x604000486ef0 H:[UIImageView:0x7f91cf670470]-(0)-|   (active, names: '|':UITableViewCellContentView:0x7f91cf66f7e0 )>",
    "<NSLayoutConstraint:0x604000486f40 V:|-(11)-[UIImageView:0x7f91cf670470]   (active, names: '|':UITableViewCellContentView:0x7f91cf66f7e0 )>",
    "<NSLayoutConstraint:0x604000486ea0 V:[UIImageView:0x7f91cf670470]-(11)-|   (active, names: '|':UITableViewCellContentView:0x7f91cf66f7e0 )>",
    "<NSLayoutConstraint:0x604000487530 'UIView-Encapsulated-Layout-Height' UITableViewCellContentView:0x7f91cf66f7e0.height == 233   (active)>",
    "<NSLayoutConstraint:0x6040004874e0 'UIView-Encapsulated-Layout-Width' UITableViewCellContentView:0x7f91cf66f7e0.width == 375   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x604000486cc0 UIImageView:0x7f91cf670470.width == 1.77778*UIImageView:0x7f91cf670470.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.

点击按钮“添加缺少的约束”不会添加任何新的约束。 值1.77778是我的宽高比的正确十进制表示形式。 我不确定为什么运行时需要打破此约束。

我也尝试过通过操作->调试器命令expr -l objc++ -O -- [[UIWindow keyWindow] _autolayoutTrace]为UIViewAlertForUnsatisfiableConstraints创建符号断点，并且在打印整个视图层次结构时，我发现打印输出没有帮助。 我不确定“ UILayoutGuide的布局不确定”与我的UITableView或单元格有什么关系...

•UIWindow:0x7f94bd466e60
|   UITransitionView:0x7f94bd64b860
|   |   •UIView:0x7f94bd468e70
|   |   |   *<UILayoutGuide: 0x6000007bdb20 - "UIViewSafeAreaLayoutGuide", layoutFrame = {{0, 44}, {375, 734}}, owningView = <UIView: 0x7f94bd468e70; frame = (0 0; 375 812); autoresize = W+H; layer = <CALayer: 0x600000822ec0>>>
|   |   |   *UILabel:0x7f94bd469050'Test App'
|   |   UILayoutContainerView:0x7f94bd610f50
|   |   |   UINavigationTransitionView:0x7f94bd488fa0
|   |   |   |   UIViewControllerWrapperView:0x7f94bd6129d0
|   |   |   |   |   •UIView:0x7f94bd61cea0
|   |   |   |   |   |   *<UILayoutGuide: 0x6040001b7840 - "UIViewSafeAreaLayoutGuide", layoutFrame = {{0, 0}, {375, 690}}, owningView = <UIView: 0x7f94bd61cea0; frame = (0 88; 375 724); autoresize = W+H; layer = <CALayer: 0x6040002370a0>>>
|   |   |   |   |   |   *UITableView:0x7f94be080800
|   |   |   |   |   |   |   FancySDK.ImageCell:0x7f94bf025600'5EC2187C-4839-47A3-83E9-C...'
|   |   |   |   |   |   |   |   •UITableViewCellContentView:0x7f94bd749410
|   |   |   |   |   |   |   |   |   *UIImageView:0x7f94bd749810
|   |   |   |   |   |   |   |   _UITableViewCellSeparatorView:0x7f94bd749a40
|   |   |   |   |   |   |   FancySDK.ArticleCell:0x7f94bd8d9600'18CCDA82-E137-496E-AB0C-5...'
|   |   |   |   |   |   |   |   •UITableViewCellContentView:0x7f94bd49a0a0
|   |   |   |   |   |   |   |   |   *UIView:0x7f94bd48cfa0
|   |   |   |   |   |   |   |   |   |   *UIImageView:0x7f94bd48d180
|   |   |   |   |   |   |   |   |   |   *ic_expand:0x7f94bd48d3b0
|   |   |   |   |   |   |   |   |   |   *UILabel:0x7f94bd49c210'Apple will unveil the nex...'
|   |   |   |   |   |   |   |   |   |   *UILabel:0x7f94bd4a20d0'Apple’s annual Worldwide ...'
|   |   |   |   |   |   |   |   |   |   *UILabel:0x7f94bd49ccd0'https://www.theverge.com/...'
|   |   |   |   |   |   |   |   _UITableViewCellSeparatorView:0x7f94bd4a3990
|   |   |   |   |   |   |   UIImageView:0x7f94bd62f410
|   |   |   |   |   |   |   UIImageView:0x7f94bd62fbf0
|   |   |   |   |   |   *UIView:0x7f94bd61ccc0
|   |   |   •Recommended for You:0x7f94bd611580
|   |   |   |   _UIBarBackground:0x7f94bd614750
|   |   |   |   |   UIImageView:0x7f94bd615000
|   |   |   |   _UINavigationBarLargeTitleView:0x7f94bd50ff60'Recommended for You'
|   |   |   |   |   UILabel:0x7f94bd4822f0
|   |   |   |   •_UINavigationBarContentView:0x7f94bd60ad60'Recommended for You'
|   |   |   |   |   *<UILayoutGuide: 0x6040001b7e60 - "BackButtonGuide(0x7f94bd60aa00)", layoutFrame = {{0, 0}, {16, 44}}, owningView = <_UINavigationBarContentView: 0x7f94bd60ad60; frame = (0 0; 375 44); layer = <CALayer: 0x604000235ee0>>>
|   |   |   |   |   *<UILayoutGuide: 0x6040001b7d80 - "LeadingBarGuide(0x7f94bd60aa00)", layoutFrame = {{16, 0}, {24, 44}}, owningView = <_UINavigationBarContentView: 0x7f94bd60ad60; frame = (0 0; 375 44); layer = <CALayer: 0x604000235ee0>>>
|   |   |   |   |   *<UILayoutGuide: 0x6040001b7ca0 - "TitleView(0x7f94bd60aa00)", layoutFrame = {{46, 0}, {321, 44}}, owningView = <_UINavigationBarContentView: 0x7f94bd60ad60; frame = (0 0; 375 44); layer = <CALayer: 0x604000235ee0>>>
|   |   |   |   |   *<UILayoutGuide: 0x6040001b7bc0 - "TrailingBarGuide(0x7f94bd60aa00)", layoutFrame = {{367, 0}, {0, 44}}, owningView = <_UINavigationBarContentView: 0x7f94bd60ad60; frame = (0 0; 375 44); layer = <CALayer: 0x604000235ee0>>>
|   |   |   |   |   *<UILayoutGuide: 0x6040001b7ae0 - "UIViewLayoutMarginsGuide", layoutFrame = {{16, 0}, {343, 44}}, owningView = <_UINavigationBarContentView: 0x7f94bd60ad60; frame = (0 0; 375 44); layer = <CALayer: 0x604000235ee0>>>
|   |   |   |   |   *_UIButtonBarStackView:0x7f94bd62d8d0
|   |   |   |   |   |   *<UILayoutGuide: 0x6040001b8020 - "UIButtonBar.flexibleSpaceEqualSizeLayoutGuide", layoutFrame = {{0, 0}, {8, 0}}, owningView = <_UIButtonBarStackView: 0x7f94bd62d8d0; frame = (16 0; 24 44); layer = <CALayer: 0x604000237f40>>>- AMBIGUOUS LAYOUT for UILayoutGuide:0x6040001b8020'UIButtonBar.flexibleSpaceEqualSizeLayoutGuide'.minX{id: 446}, UILayoutGuide:0x6040001b8020'UIButtonBar.flexibleSpaceEqualSizeLayoutGuide'.minY{id: 447}, UILayoutGuide:0x6040001b8020'UIButtonBar.flexibleSpaceEqualSizeLayoutGuide'.Width{id: 367}, UILayoutGuide:0x6040001b8020'UIButtonBar.flexibleSpaceEqualSizeLayoutGuide'.Height{id: 448}
|   |   |   |   |   |   *<UILayoutGuide: 0x6040001b81e0 - "UIButtonBar.minimumInterItemSpaceLayoutGuide", layoutFrame = {{0, 0}, {8, 0}}, owningView = <_UIButtonBarStackView: 0x7f94bd62d8d0; frame = (16 0; 24 44); layer = <CALayer: 0x604000237f40>>>- AMBIGUOUS LAYOUT for UILayoutGuide:0x6040001b81e0'UIButtonBar.minimumInterItemSpaceLayoutGuide'.minX{id: 449}, UILayoutGuide:0x6040001b81e0'UIButtonBar.minimumInterItemSpaceLayoutGuide'.minY{id: 450}, UILayoutGuide:0x6040001b81e0'UIButtonBar.minimumInterItemSpaceLayoutGuide'.Height{id: 451}
|   |   |   |   |   |   *<UILayoutGuide: 0x6040001b7a00 - "UIButtonBar.minimumInterGroupSpaceLayoutGuide", layoutFrame = {{0, 0}, {8, 0}}, owningView = <_UIButtonBarStackView: 0x7f94bd62d8d0; frame = (16 0; 24 44); layer = <CALayer: 0x604000237f40>>>- AMBIGUOUS LAYOUT for UILayoutGuide:0x6040001b7a00'UIButtonBar.minimumInterGroupSpaceLayoutGuide'.minX{id: 452}, UILayoutGuide:0x6040001b7a00'UIButtonBar.minimumInterGroupSpaceLayoutGuide'.minY{id: 453}, UILayoutGuide:0x6040001b7a00'UIButtonBar.minimumInterGroupSpaceLayoutGuide'.Height{id: 454}
|   |   |   |   |   |   *<UILayoutGuide: 0x6040001b74c0 - "UIViewLayoutMarginsGuide", layoutFrame = {{0, 0}, {24, 44}}, owningView = <_UIButtonBarStackView: 0x7f94bd62d8d0; frame = (16 0; 24 44); layer = <CALayer: 0x604000237f40>>>
|   |   |   |   |   |   *UIButton:0x7f94bd51de30
|   |   |   |   |   |   |   UIImageView:0x7f94bd6210f0
|   |   |   |   |   *UILabel:0x7f94bd6298a0'Recommended for You'
|   |   |   |   +_UINavigationBarModernPromptView:0x7f94bd488da0
|   |   |   |   |   *UILabel:0x7f94bd4893d0
|   |   |   UIActivityIndicatorView:0x7f94bd531500
|   |   |   |   UIImageView:0x7f94bd507950

Legend:
    * - is laid out with auto layout
    + - is laid out manually, but is represented in the layout engine because translatesAutoresizingMaskIntoConstraints = YES
    • - layout engine host

欢迎任何反馈。 谢谢

Answer 1

此问题背后的主要原因是，最初的自动布局为单元格的contentView假定了一个固定的高度（直到正在计算动态高度）约束（必需），该约束与您自己的约束冲突，并且在此处出现UIView-Encapsulated-Layout-Height ，您可以通过将imageView底部约束的优先级降低为999而不是1000来解决此问题（必需）

说明

您当前的宽度= 375，纵横比= 16/9

那么imageView的高度将为（375 * 9）/16.0 = 210.9

• 顶部11和底部11

总计= 211 + 11 + 11 = 233> 80（estimatedRowHeight）

Answer 2

问题在于，长宽比不会在您未评估为16：9时与您的其他约束发生冲突。 设置前约束和尾约束将评估为某个宽度，还将顶部和底部约束设定为某个高度。 宽高比必须与长宽比相同，以免产生冲突。

有几种解决方案。 您可能想要的一个是用水平中心约束替换前导约束和尾随约束。 这将使宽高比决定在单元格居中时视图的宽度。

更新：为了阐明长宽比约束是如何工作的，它充当了您的高度和宽度之间的锁定，强制它们在它们之间保持固定的比率。 因此，如果您设置了其中一个，则宽高比约束将为您有效地设置另一个。 因此，当您具有宽高比约束时，不应同时设置宽度和高度约束。