简体   繁体   English

iOS表格视图具有自定义子视图的单元格自动高度

[英]iOS table view cell auto height with custom subview

I need pretty simple thing - table cells which automatically detect their own height. 我需要非常简单的东西-表格单元格可以自动检测其自身的高度。 There are a lot of examples out there, which basically say "set couple of flags and values on your table and use autolayout in your cell". 这里有很多示例,这些示例基本上说“在表上设置几个标志和值,并在单元格中使用自动布局”。 My case is a bit special - I load the content of the cell from a separate XIB file which is a plain UIView. 我的情况有点特殊-我从单独的XIB文件(即普通的UIView)加载单元格的内容。 The first problem comes already when I create that XIB file in interface builder - I don't know how to make it's height to "calculate" according to constraints that I specify. 当我在界面构建器中创建该XIB文件时,第一个问题已经出现-我不知道如何根据我指定的约束条件使其高度来“计算”。 I am always getting IB errors unless I switch to "Freeform" and resize the view to the height matching my constraints. 除非切换到“自由格式”并将视图的大小调整到与我的约束匹配的高度,否则我总是会出现IB错误。 If I don't do that, I will get the following errors: 如果我不这样做,将会出现以下错误:

在此处输入图片说明

In the above example I just need a view which height will be 32 (image height) + 2 * 16 (vertical distance constraints of image from parent's top and bottom) plus the margins. 在上面的示例中,我只需要一个视图,该视图的高度将为32(图像高度)+ 2 * 16(图像距父对象顶部和底部的垂直距离约束)加上页边距。 Resizing the freeform view in IB until the errors disappear seems like a dirty hack to me, and it is actually not auto layout. 在IB中调整自由格式视图的大小,直到错误消失,对我来说似乎是一个肮脏的技巧,并且实际上不是自动布局。 As a next step, I define a cell class, where I put this xib view, something like this (sorry for objc code, almost done porting the project to swift) : 下一步,我定义一个单元格类,在其中放置这个xib视图(类似于objc代码,将项目移植到swift几乎完成了)

- (void)awakeFromNib {
    [super awakeFromNib];

    [[NSBundle mainBundle] loadNibNamed:@"CellContent" owner:self options:nil];

    // self.content is an outlet which gets the root of the XIB on load
    [self.contentView addSubview:self.content];

    self.contentView.translatesAutoresizingMaskIntoConstraints = NO;
    [self.contentView.leftAnchor constraintEqualToAnchor:self.content.leftAnchor].active = YES;
    [self.contentView.rightAnchor constraintEqualToAnchor:self.content.rightAnchor].active = YES;
    [self.contentView.topAnchor constraintEqualToAnchor:self.content.topAnchor].active = YES;
    [self.contentView.bottomAnchor constraintEqualToAnchor:self.content.bottomAnchor].active = YES;
}

As you might guess, when I run this the cell height is the big freeform one, like in the IB of the content XIB, so no auto layout. 您可能会猜到,当我运行此程序时,像元高度是较大的自由格式,就像在内容XIB的IB中一样,因此没有自动布局。 It seems like the freeform height is even added as another constraint and there is a constraint conflict which results in some of them being broken at runtime. 似乎自由形式的高度甚至被添加为另一个约束,并且存在约束冲突,导致其中一些在运行时被破坏。

Let me know how can I fix this, easily create content views for my cells which have auto heights and which I can embed in my cells to benefit the tableView.rowHeight = UITableViewAutomaticDimension magic? 让我知道如何解决此问题,轻松地为具有自动高度的单元格创建内容视图,并且可以将其嵌入到单元格中,以使tableView.rowHeight = UITableViewAutomaticDimension魔术受益匪浅?

Maybe you forgot to set the Content Hugging Priority and Content Compression Resistence Priority of the Labels. 也许您忘记设置标签的“ 内容拥抱优先级”和“ 内容压缩保留优先级 ”。 enter image description here 在此处输入图片说明

  1. Make sure UILabel has multiline property . 确保UILabel具有multiline属性。 So , Set 0 for Line Property at Attribute Inspector . 因此,在Attribute Inspector Line Property设置为0
  2. Make sure that UILabel Auto-Layout is properly relative to Left-Right-Top-Bottom . 确保UILabel Auto-Layout相对于Left-Right-Top-Bottom
  3. Apply these delegate Functions : 应用这些委托函数:

     -(CGFloat) tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath { return UITableViewAutomaticDimension; } -(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { return UITableViewAutomaticDimension; } 

I found what was my problem. 我发现了我的问题所在。 Actually, there were conflicts with constraints added because of autoresizing. 实际上,由于自动调整大小,添加的约束存在冲突。 So I changed this line (from the question above): 所以我改变了这一行(从上面的问题):

self.contentView.translatesAutoresizingMaskIntoConstraints = NO;

to: 至:

self.content.translatesAutoresizingMaskIntoConstraints = NO;

Stupid mistake, the translatesAutoresizingMaskIntoConstraints flag should be disabled for the child view after adding, not for the parent view, as I incorrectly did. 愚蠢的错误,应该在添加后为视图(而不是父视图)禁用translatesAutoresizingMaskIntoConstraints标志,而不是像我错误地那样。 After that the magic with cell auto height detection started working like charm. 此后,具有单元格自动高度检测功能的魔术开始像魅力一样起作用。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM