UITableViewCell 中具有动态高度的多个 UILabels

MrT*_*kos 2 dynamic uitableview autolayout swift ios8

在空的情况下,UITableViewCell我有两个UILabel像这样对齐的 s:|--label1----label2--|。它们都将动态填充。我需要设置约束,使两个标签保持中心对齐,但单元格的高度由具有最多 content 的标签确定。迄今为止:

  • 标签的行数设置为 0
  • ViewDidLoad

    tableView.rowHeight = 40.0
    tableView.estimatedRowHeight = 40.0
    
    Run Code Online (Sandbox Code Playgroud)
  • UITableViewDelegate方法:

    func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
        return UITableViewAutomaticDimension
    }
    
    func tableView(tableView: UITableView, estimatedHeightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
    return UITableViewAutomaticDimension
    }
    
    Run Code Online (Sandbox Code Playgroud)

    问题是我找不到正确的约束设置来实现这样的结果:

    |---------------------------更长的消息-- |
    |--一条长消息--------一条更长的消息--|
    |--一条长消息--------一条更长的消息--|
    |--一条长消息--------一条更长的消息--|
    |--一条长消息--------一条更长的消息--|
    |----------------------------更长的消息--|



    |------------------------更长的消息--|
    |--消息------------更长的消息--|
    |------------------------更长的消息--|

    有任何想法吗?我正在使用Swift 1.2Xcode 6.3(和Storyboard)谢谢!

小智 5

为单元格添加(较低优先级)固定高度约束(例如 = 40)。

为每个标签添加顶部和底部约束。将顶部约束设置为固定边距(例如 = 8)。使底部约束成为(更高优先级)大于或等于约束(例如 >= 8)。

单元格的高度将由较高的标签确定,并且仍然满足所有其他垂直约束。

更新:

事实证明,您不需要单元格的固定高度约束,甚至不需要调整水平内容拥抱或压缩阻力优先级。

我将标签的顶部和左侧或右侧边缘固定到 superview.margin, = 0,并在标签之间添加了水平空间 >= 4。

我将标签的底部边缘固定到 superview.margin,>= 0。我还将两个标签的垂直压缩阻力优先级设置为 1000。

至此,我们已经设置了最低限度的必要约束。但是,如果两个标签都很长,则一个标签将占据大部分宽度,从而迫使另一个标签变得非常窄。我任意地向两个标签添加了宽度 >= 100 约束以平衡事物。

标签约束

在 中启用自动调整大小-viewDidLoad,然后指定标签的文本,并让单元格自行布局。没有必要覆盖自定义中的任何内容UITableViewCell

self.tableView.rowHeight = UITableViewAutomaticDimension;
self.tableView.estimatedRowHeight = 44.0;

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
     TableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];

     cell.leftLabel.text = ...;
     cell.rightLabel.text = ...;

     [cell setNeedsLayout];
     [cell layoutIfNeeded];

     return cell;
}
Run Code Online (Sandbox Code Playgroud)

具有动态并排标签的 tableView 的快照