使用AutoLayout將UIView高度調整到其內容

我使用iOS 6 AutoLayout功能和Masonry DSL來安排UITableViewCell中的視圖。這是我想達到的佈局安排：使用AutoLayout將UIView高度調整到其內容

Desired UITableViewCell layout

的containerView是應該動態調整其大小以適合其內容的虛擬容器。以我目前的實現，這是我得到了什麼，而不是：

Current layout arrangement result

似乎containerView沒有得到正確的垂直居中，但它具有零寬度和高度，因此無法正確顯示了。我如何指示containerView將其大小適合其內容？代碼片段附在下面。

謝謝！

的UITableViewCell初始化

- (id)initWithReuseIdentifier:(NSString *)reuseIdentifier 
{ 
    if (self = [super initWithStyle:UITableViewCellStyleDefault reuseIdentifier:reuseIdentifier]) { 
     self.titleLabel = [[UILabel alloc] init]; 
     self.titleLabel.font = [UIFont boldSystemFontOfSize:[UIFont smallSystemFontSize]]; 
     self.titleLabel.text = @"ノートタイトル"; 

     self.coverImage = [[UIView alloc] init]; 
     self.coverImage.backgroundColor = [UIColor carrotColor]; 

     self.avatarImage = [[UIView alloc] init]; 
     self.avatarImage.backgroundColor = [UIColor emerlandColor]; 

     self.authorLabel = [[UILabel alloc] init]; 
     self.authorLabel.font = [UIFont systemFontOfSize:[UIFont smallSystemFontSize]]; 
     self.authorLabel.text = @"著者の名前"; 

     self.containerView = [[UIView alloc] init]; 
     self.containerView.backgroundColor = [UIColor lightGrayColor]; 
     [self.containerView addSubview:self.titleLabel]; 
     [self.containerView addSubview:self.avatarImage]; 
     [self.containerView addSubview:self.authorLabel]; 

     [self.contentView addSubview:self.containerView]; 
     [self.contentView addSubview:self.coverImage]; 

     self.selectionStyle = UITableViewCellSelectionStyleNone; 
     [self updateConstraintsIfNeeded]; 
    } 

    return self; 
}

的UITableViewCell updateConstraints

- (void)updateConstraints 
{ 
    [super updateConstraints]; 

    [self.coverImage mas_makeConstraints:^(MASConstraintMaker *make) { 
     make.left.equalTo(self.contentView).with.offset(20); 
     make.top.equalTo(self.contentView).with.offset(5); 
     make.bottom.equalTo(self.contentView).with.offset(-5); 

     make.width.equalTo(self.coverImage.mas_height).multipliedBy(0.75); 
    }]; 

    [self.containerView mas_makeConstraints:^(MASConstraintMaker *make) { 
     make.left.equalTo(self.coverImage.mas_right).with.offset(10); 
     make.centerY.equalTo(self.contentView); 
    }]; 

    [self.titleLabel mas_makeConstraints:^(MASConstraintMaker *make) { 
     make.left.equalTo(self.containerView); 
     make.top.equalTo(self.containerView); 
    }]; 

    [self.avatarImage mas_makeConstraints:^(MASConstraintMaker *make) { 
     make.top.equalTo(self.titleLabel.mas_bottom).with.offset(5); 
     make.left.equalTo(self.titleLabel); 

     make.width.equalTo(@20); 
     make.height.equalTo(@20); 
    }]; 

    [self.authorLabel mas_makeConstraints:^(MASConstraintMaker *make) { 
     make.left.equalTo(self.avatarImage.mas_right).with.offset(5); 
     make.centerY.equalTo(self.avatarImage); 
    }]; 
}

來源

2014-03-13 Andree

我找到了解決我自己的問題。顯然，爲了使containerView動態調整自身的大小，我們必須確保內部的每個元素彼此之間以及超級視圖的邊緣（即containerView）嚴格相連。例如，在VFL就應該是這樣的："V:|-10-[child1]-5-[child2]-5-|"

所以在我的情況，我添加了一個新的約束make.bottom.equalTo(self.containerView)到avatarImage現在的上海華知道如何高度本身！

來源

2014-03-13 03:36:36 Andree

使用AutoLayout將UIView高度調整到其內容

回答

相關問題