不知道如何防止约束被打破

Question

我是 iOS 开发的新手。我正在创建一个带有自动布局的聊天应用程序，但是每当我在我的应用程序中打开 collectionview 时，我都会“打破约束”。 这是我得到的错误

2017-11-06 07:34:52.838630+0530 ChatHub[4083:306096] [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:0x6040002989c0 BubbleView.width == 205.938   (active, names: BubbleView:0x7ffde3611880 )>",
    "<NSLayoutConstraint:0x604000298600 ProfileImageView.width == 32   (active, names: ProfileImageView:0x7ffde3611a60 )>",
    "<NSLayoutConstraint:0x60400028d890 H:|-(8)-[ProfileImageView](LTR)   (active, names: ProfileImageView:0x7ffde3611a60, '|':ChatHub.ChatMessageCell:0x7ffde360e670 )>",
    "<NSLayoutConstraint:0x6040002988d0 H:[ProfileImageView]-(8)-[BubbleView](LTR)   (active, names: BubbleView:0x7ffde3611880, ProfileImageView:0x7ffde3611a60 )>",
    "<NSLayoutConstraint:0x604000298880 BubbleView.right == ChatHub.ChatMessageCell:0x7ffde360e670.right - 8   (active, names: BubbleView:0x7ffde3611880 )>",
    "<NSLayoutConstraint:0x6000004870d0 'UIView-Encapsulated-Layout-Width' ChatHub.ChatMessageCell:0x7ffde360e670.width == 375   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x6040002989c0 BubbleView.width == 205.938   (active, names: BubbleView:0x7ffde3611880 )>

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.
2017-11-06 07:34:53.041831+0530 ChatHub[4083:306096] [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:0x600000485c30 BubbleView.width == 205.938   (active, names: BubbleView:0x7ffde345dfb0 )>",
    "<NSLayoutConstraint:0x600000485aa0 ProfileImageView.width == 32   (active, names: ProfileImageView:0x7ffde345e190 )>",
    "<NSLayoutConstraint:0x600000485a00 H:|-(8)-[ProfileImageView](LTR)   (active, names: ProfileImageView:0x7ffde345e190, '|':ChatHub.ChatMessageCell:0x7ffde345b380 )>",
    "<NSLayoutConstraint:0x600000485b40 BubbleView.right == ChatHub.ChatMessageCell:0x7ffde345b380.right - 8   (active, names: BubbleView:0x7ffde345dfb0 )>",
    "<NSLayoutConstraint:0x600000485b90 H:[ProfileImageView]-(8)-[BubbleView](LTR)   (active, names: BubbleView:0x7ffde345dfb0, ProfileImageView:0x7ffde345e190 )>",
    "<NSLayoutConstraint:0x60400029a810 'UIView-Encapsulated-Layout-Width' ChatHub.ChatMessageCell:0x7ffde345b380.width == 375   (active)>"
)

Will attempt to recover by breaking constraint 
<NSLayoutConstraint:0x600000485c30 BubbleView.width == 205.938   (active, names: BubbleView:0x7ffde345dfb0 )>

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.

我该如何解决这个问题。我从过去两天被困在这里..请帮助

我在上面的截图中得到错误，但我没有在下面得到一个

Answer 1

据我所知，您对该单元格的水平约束如下所示。

H:|-8-[ProfileImageView(=32)]-8-[BubbleView(=206)]-8-|

当您的视图的宽度等于其所有子视图的宽度和它们周围的空间的总和（即 254）时，您的布局几乎没有问题。当单元格变宽（或变窄）时，麻烦就开始了。

在这里您可以看到您配置的宽度与单元格的封装宽度（为 375）冲突。

<NSLayoutConstraint:0x6000004870d0 'UIView-Encapsulated-Layout-Width' ChatHub.ChatMessageCell:0x7ffde360e670.width == 375   (active)>

如果您想保持个人资料图像和气泡视图的宽度固定。我建议您将下面的约束符号 (BubbleView.right) 设置为大于或等于。

<NSLayoutConstraint:0x604000298880 BubbleView.right == ChatHub.ChatMessageCell:0x7ffde360e670.right - 8   (active, names: BubbleView:0x7ffde3611880 )>

另一种选择是确保单元格的宽度始终等于 254，这有点难以实现。

Answer 2

根据错误信息，您似乎并排创建了一个BubbleView 和一个ProfileImageView。自动布局约束是

(left edge)| - (8) - Profile(32) - (8) -- Bubble -- (8)| (cell right edge)

注意，只要确定了单元格的宽度，就可以通过cell.width - 8 - 32 - 8 - 8自动计算出Bubble size。所以气泡宽度的约束是多余的。只需将其删除。