ios - 当 UITableViewCell 调整大小时重新排列单元格 subview

Question

我有一个 UITableViewCell 是使用 Storyboard实现的，如下所示:

下面是没有图像的单元格应该是什么样子:

我一直在摆弄这些限制，并试图解决这个问题，但一直没有成功。我对约束以及如何以编程方式添加它们有很好的理解，但在这个特定问题上没有运气，感觉我只是随意地向单元格添加布局约束，没有逻辑思维过程。该单元格代表一个新闻源帖子，它在顶部的主 ImageView 中可能有也可能没有图像，并且应该表现如下。如果单元格中没有图像，则带有喜欢和评论计数的底部栏会向上移动以与单元格顶部对齐。我通过设置一个约束来实现此行为，该约束使较小的 ImageView 、帖子标题、帖子时间和帖子内容与单元格底部保持一定距离。这种方法有效，当在 heightForRowAtIndexPath 方法中调整单元格大小时， subview 会适当移动。当帖子内容中的文本大于一行时，问题就来了。单元格的高度调整正确，但 TextView 的顶部保持在同一位置并向下增长并溢出到下一个单元格。当我放置约束以将四个 subview 与单元格顶部对齐时，如果没有图像并且帖子内容大于一行，我会遇到问题。在这种情况下，单元格的大小将调整为小于其原始大小，并且 subview 保持在约束指定的距离内。较小的图像、帖子标题、时间和内容被剪裁并且不显示。对于这么多不同的案例，这是一个如此奇怪的问题。我已经为此工作了将近两天，真的可以利用别人的想法来解决这个问题。我希望这不会太困惑，感谢您的帮助!

Answer 1

我有一种方法可以解决这个问题，但我相信还有很多其他方法。我给两个 ImageView 一个固定的高度限制。小 ImageView 和顶部标签(帖子标题)具有到单元格顶部的固定高度——这两者以及大 ImageView 的高度约束都具有 IBOutlets，因此可以在代码中更改它们。底部标签(Post Content)的行数设置为 0，并且有一个 IBOutlet 到它的高度约束(所有标签都以标准的 21 点高度开始)。在代码中，我检查每个 indexPath 中是否存在图像，并相应地更改约束。

- (void)viewDidLoad {
    UIImage *image1 = [UIImage imageNamed:@"House.tiff"];
    [super viewDidLoad];
    self.theData = @[@{@"pic":image1, @"post":@"short post"},@{@"post":@"short post"},@{@"pic":image1, @"post":@"Long long post with some extra stuff, and even some more"},@{@"post":@"Long long post with some extra stuff, and even some more"}];
    [self.tableView reloadData];
}


- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return self.theData.count;
}

-(CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    CGFloat ivHeight = (self.theData[indexPath.row][@"pic"])? 215 : 0; // 215 is the fixed height of the large image view
    CGSize labelSize = [self.theData[indexPath.row][@"post"] sizeWithFont:[UIFont systemFontOfSize:17] constrainedToSize:CGSizeMake(152, CGFLOAT_MAX)];
    return 140 + ivHeight + labelSize.height; // the 140 was determined empirically to get the right spacing between the 3 labels and the bottom bar
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {

    RDCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
    cell.label.text = self.theData[indexPath.row][@"post"];
    cell.iv.image = self.theData[indexPath.row][@"pic"];
    if(self.theData[indexPath.row][@"pic"] == nil){
        cell.heightCon.constant = 0; // heightCon is the outlet to the large image view's height constraint
        cell.ivTopCon.constant = 8; // ivTopCon is the outlet to the small image view's spacing to the top of the cell
        cell.labelTopCon.constant = 8; // labelTopCon is the outlet to thetop label's spacing to the top of the cell
    }else{
        cell.heightCon.constant = 215; // this number and the following 2 are taken from the values in IB
        cell.ivTopCon.constant = 185;
        cell.labelTopCon.constant = 233;
    }
    CGSize labelSize = [self.theData[indexPath.row][@"post"] sizeWithFont:[UIFont systemFontOfSize:17] constrainedToSize:CGSizeMake(152, CGFLOAT_MAX)];
    cell.labelHeightCon.constant = labelSize.height;
    return cell;
}