Incorrect text wrapping in a UITableViewCell - ios

Question

I'm having problems with my custom UITableView. I was wondering as to how to properly make a group of text into the cell without seeing any ellipses "..." and without the text getting cut off at the end of the cell.
This is what my cell looks like, currently:
It is a part of a UISplitViewController. The problem with this is, before for some reason it would show the whole length of the text but it would get to the end of the cell and the rest of the string is cut off (this happens when I check "AutoLayout").
This is what my code looks like currently:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"BCell";
BracketTableCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if(cell == nil)
{
cell = [[BracketTableCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
[cell.description setLineBreakMode:NSLineBreakByWordWrapping];
cell.description.numberOfLines = 0;
cell.description.font = [UIFont fontWithName:#"Helvetica" size:14.0];
}
Bracket *bracket = [brackets objectAtIndex:indexPath.row];
[cell.description setText:bracket.name];
[cell.bracketId setText:[NSString stringWithFormat:#"%#", bracket.bracketId]];
return cell;
}
I am experimenting on height, but that doesn't seem to matter because I can set the height to whatever, but it still shows truncated text.
Thanks!

Answer 1

Typically my approach to supporting variable height cells is to define a class method that can calculate sizing for a given model object:
+ (CGFloat)heightForBracket:(Bracket*)bracket;
The beauty of making it a class method is that you can share constants (padding values, font sizes, indentation levels, etc) with your code that actually implements the layout without having to expose them to any other classes. If you want to change those constants in the future, you only have to make the change in one place in the cell subclass. An example subclass implementation:
#define kPaddingHorizontal 10.0
#define kPaddingVertical 10.0
#define kFontSizeName 17.0
+ (CGFloat)heightForBracket:(Bracket*)bracket {
// determine the dimensions of the name
UIFont *nameFont = [UIFont systemFontOfSize:kFontSizeName];
CGFloat nameSize = [bracket.name sizeWithFont:nameFont
constrainedToSize:CGSizeMake(300, CGFLOAT_MAX) // 300 is the width of your eventual label
lineBreakMode:NSLineBreakByWordWrapping];
// Apple recommends all cells be at least 44px tall, so we enforce a minimum here
return MAX(44, nameSize.height + 20 + kPaddingVertical*2); // 20 is space for the subtitle label
}
- (id)initWithReuseIdentifier:(NSString *)reuseIdentifier {
self = [super initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:reuseIdentifier];
if (self) {
// bracket name
self.textLabel.numberOfLines = 0; // 0 makes this variable height
self.textLabel.font = [UIFont systemFontOfSize:kFontSizeName];
self.textLabel.lineBreakMode = NSLineBreakByTruncatingTail;
self.textLabel.backgroundColor = [UIColor clearColor];
// if you wanted to hardcode a specific width, to a subview do it here as a constant and then share it with heightForBracket:
// bracket number
self.detailTextLabel.numberOfLines = 1;
self.detailTextLabel.font = [UIFont systemFontOfSize:14.0];
self.detailTextLabel.lineBreakMode = NSLineBreakByTruncatingTail;
self.detailTextLabel.backgroundColor = [UIColor clearColor];
}
return self;
}
- (void)setBracket:(Bracket*)bracket {
_bracket = bracket;
self.textLabel.text = bracket.name;
self.detailTextLabel.text = [NSString stringWithFormat:#"%#", bracket.bracketId];
}
You can then call heightForBracket: in tableView:heightForRowAtIndexPath::
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
Bracket *bracket = [brackets objectAtIndex:indexPath.row];
return [BracketTableCell heightForBracket:bracket];
}
tableView:cellForRowAtIndexPath: becomes very easy, just set the appropriate bracket on the cell:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *CellIdentifier = #"BCell";
BracketTableCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[BracketTableCell alloc] initWithReuseIdentifier:CellIdentifier];
}
Bracket *bracket = [brackets objectAtIndex:indexPath.row];
cell.bracket = bracket;
return cell;
}
A few notes:
this assumes the cell is not using Auto Layout
this explicitly hardcodes a width for the cell/label, which may or may not fit your use case
you should never name a property description because that is a method that already exists on the NSObject protocol
other enhancements would be caching the result of heightForBracket: to improve scrolling performance, especially if you start doing sizing logic for a ton of subviews

Answer 2

#gdubs you can use custom UITableViewCells
for reference you can use Customize Table View Cells for UITableView
I guess it would be easy for you to customize UILabels then. like if you want to add mutilple lines then set TitletLabel.numberOfLines=0; and if you want wordwrapping TitleLabel.lineBreakMode=NSLineBreakByWordWrapping;. There are other options in word wrapping as well.

Answer 3

The key to happiness with labels and Autolayout is to set the preferredMaxLayoutWidth property on the label. Without this labels don't wrap properly (or at all, in some cases, which is what you were seeing before, I think?).
Set the value to your maximum line width, and the labels should then behave correctly.

Answer 4

I think the problem has to do with the width of your label, if you are using auto layout expand your label's width to fill the parent cell and add trailing and leading to superview constraints, so that it resizes with it.