Add subviews in runtime to UITableviewCell configured with xib using autolayout - ios

Question

There is a UITableview subclass, that has *.xib file, with configured autolayout in it (like the image below, in xib all dependencies are configured for 2 label-style). This cell can calculate it's height dynamically, as usual autolayout cell.
But there is a case, when according to received data,the number of labels can vary - dependent of data in model.
Is there a way to add several labels (3,5,n) as subviews to cell, with existing autolayout system? It's important because cell should not lose ability to self-calculate its size

Answer 1

Since you are using .xibs (great for several reasons) the safest, least-cumbersome and most performant way is to register your .xib with different resue identifiers. Best to scan your model to find out and register which ones you'll need (err on the side of registering too many; make a mistake the other way and instant crash). In a subclass, override -initWithStyle:reuseIdentifier: and do setup there.
There are a couple ways to do setup.
IB heavy: Create a cell with the maximum number of labels. Attach them to each other, and attach each one to the bottom of the cell content view with a separate constraint, and rank the constraints in priority with 1000 being the label attached to the bottom with none removed and priorities going down from there. Then remove the labels you don't want in -initWithStyle:reuseIdentifier:; their constraints will be removed, allowing the next-lowest priority to go into effect.
Looping: For an arbitrary number, you can add the labels and their constraints in a -initWithStyle:reuseIdentifier: -- resuse identifier could be +stringWithFormat for the loop number, which would let you get the number with -intValue. This may be too cutsy though, so you might want to try creating a method -formatWithNumberOfLabels and checks a -didSetup flag.
EDIT: Option 2 was far more cumbersome than I expected. This example is programmatic, but you should be able to see how to adapt it for .xibs. In the cell's impementation:
-(id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
[self.contentView setTranslatesAutoresizingMaskIntoConstraints:NO];
NSMutableDictionary *layoutDictionary = [[NSMutableDictionary alloc] init];
NSMutableString *visualFormatLanguageString = [[NSMutableString alloc] init];
NSInteger numberOfLabels = reuseIdentifier.integerValue; //This is not that safe, using below class method is the only way to make it safe to do this.
for (int i = 0; i <= numberOfLabels; i++) {
if (i == 0) {
[visualFormatLanguageString appendString:#"V:|-20-"];
} else {
[visualFormatLanguageString appendString:#"-8-"];
}
UILabel *labelX = [[UILabel alloc] init];
[labelX setTranslatesAutoresizingMaskIntoConstraints:NO];
int tag = 1000 + i;
labelX.tag = tag;
NSString *labelXString = [NSString stringWithFormat:#"Label%i", tag];
[layoutDictionary setObject:labelX forKey:labelXString];
[visualFormatLanguageString appendString:[NSString stringWithFormat:#"[%#]", labelXString]];
[self.contentView addSubview:labelX];
}
[visualFormatLanguageString appendString:#"-20-|"];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:visualFormatLanguageString
options:NSLayoutFormatAlignAllLeading
metrics:nil
views:layoutDictionary]];
}
return self;
}
+ (NSString*)reuseStringForNumber:(NSInteger)reuseNumber {
return [NSString stringWithFormat:#"%li",(long) reuseNumber];
}
In the TableView Data Source you must -- for the maximum number of labels you think you need - register:
- (void)viewDidLoad {
[super viewDidLoad];
for (NSInteger i = 0; i < 4; i++) {
[self.tableView registerClass:[MultiLabelTableViewCell class] forCellReuseIdentifier:[MultiLabelTableViewCell reuseStringForNumber:i]];
}
self.tableView.estimatedRowHeight = 44;
}
For an example that creates number of labels (row % 4) + 1:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
NSInteger cellNumber = indexPath.row % 4;
MultiLabelTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:[MultiLabelTableViewCell reuseStringForNumber:cellNumber] forIndexPath:indexPath];
for (int i = 0; i <= cellNumber; i++) {
int tag = 1000 + i;
[(UILabel *)[cell.contentView viewWithTag:tag] setText:[NSString stringWithFormat:#"Cell %i, label %i", indexPath.row, i]];
}
return cell;
}
Then just call the reuseIdentifier you need in cell for row at index path, and both you and the system will have to do the minimum work to get the correct height and layout for your cell.