スウィフトでのメッセージバブルの制約

Question

これはデバッグするのが難しい問題であることを知っています。私は説明しようとします、あなたはコメントセクションから質問をすることができます。

私のアプリでメッセージバブルを使いたいです。私は制約のためのいくつかのコードを書いたが、うまくいきません。

は、どのように私は赤のラインに青バブルの左端を置くことができますか？ここで

は私のコードです：

このメソッドが実行されているときにテーブルビューセルの負荷：

private func setup() { 
    bubbleImageView = UIImageView(image: bubbleImage.incoming, highlightedImage: bubbleImage.incomingHighlighed) 
    bubbleImageView.userInteractionEnabled = true 

    messageLabel = UILabel(frame: CGRectZero) 
    messageLabel.font = UIFont.systemFontOfSize(15) 
    messageLabel.numberOfLines = 0 
    messageLabel.userInteractionEnabled = true 
    selectionStyle = .None 
    contentView.addSubview(bubbleImageView) 
    bubbleImageView.addSubview(messageLabel) 
    messageLabel.translatesAutoresizingMaskIntoConstraints = false 
    bubbleImageView.translatesAutoresizingMaskIntoConstraints = false 
    contentView.addConstraint(NSLayoutConstraint(item: bubbleImageView, attribute: .Left, relatedBy: .Equal, toItem: contentView, attribute: .Left, multiplier: 1, constant: 10)) 
    contentView.addConstraint(NSLayoutConstraint(item: bubbleImageView, attribute: .Top, relatedBy: .Equal, toItem: contentView, attribute: .Top, multiplier: 1, constant: 4.5)) 
    bubbleImageView.addConstraint(NSLayoutConstraint(item: bubbleImageView, attribute: .Width, relatedBy: .Equal, toItem: messageLabel, attribute: .Width, multiplier: 1, constant: 30)) 
    contentView.addConstraint(NSLayoutConstraint(item: bubbleImageView, attribute: .Bottom, relatedBy: .Equal, toItem: contentView, attribute: .Bottom, multiplier: 1, constant: -4.5)) 

    bubbleImageView.addConstraint(NSLayoutConstraint(item: messageLabel, attribute: .CenterX, relatedBy: .Equal, toItem: bubbleImageView, attribute: .CenterX, multiplier: 1, constant: -2)) 

    bubbleImageView.addConstraint(NSLayoutConstraint(item: messageLabel, attribute: .CenterY, relatedBy: .Equal, toItem: bubbleImageView, attribute: .CenterY, multiplier: 1, constant: -0.5)) 
    messageLabel.preferredMaxLayoutWidth = 218 
    bubbleImageView.addConstraint(NSLayoutConstraint(item: messageLabel, attribute: .Height, relatedBy: .Equal, toItem: bubbleImageView, attribute: .Height, multiplier: 1, constant: -15)) 
} 

をあなたは私がテキストのバブルの背景とラベルを作成しています見ることができるように。

そして、第二の方法：

func setCell(message:Message) { 
    messageLabel.text="testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest" 
    var layoutAttribute: NSLayoutAttribute 
    var layoutConstant: CGFloat 
    if message.incoming { 
     bubbleImageView.image=bgImage.incoming 
     messageLabel.textColor = UIColor.blackColor() 
     layoutAttribute = .Left 
     layoutConstant = 10 
    }else{ 
     if message.isSent == 1 { 
      bubbleImageView.image = bgImage.outgoing 
     } 
     if message.isSent == 0 { 
      bubbleImageView.image = bgImage.notYetSent 
     } 
     messageLabel.textColor = UIColor.whiteColor() 
     layoutAttribute = .Right 
     layoutConstant = -10 
    } 

    contentView.addConstraint(NSLayoutConstraint(item: bubbleImageView, attribute: layoutAttribute, relatedBy: .Equal, toItem: contentView, attribute: layoutAttribute, multiplier: 1, constant: layoutConstant)) 

} 

私のコードの問題は何ですか？受信メッセージ（グレーバブル）にはうまくいき、送信メッセージ（ブルーバブル）にはうまく機能しません。

Answer 1

私はそれを手に入れました。バブルが最大幅を超えないようにする制約を追加する必要があります。

let widthConstraint = NSLayoutConstraint(item: youritem, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.LessThanOrEqual, 
    toItem: self.youItem.superview, attribute: NSLayoutAttribute.Width, 
multiplier: 1.0, constant: 100)