Geek Answers Handbook

How to create a multi-line table cell in iOS?

How can I get a second cell to expand so that it matches the text rather than scaling the text? Is there a built-in way to do this in iOS, or will I have to come up with some kind of ready-to-work solution? If you look in the iOS Contacts app, there will be a field like this for the address. However, I cannot find how to implement this.

Table screenshot

For those who want to achieve this in the future, here is the code for my solution:

HEADER File:

#define FONT_SIZE 22.0f #define CELL_CONTENT_WIDTH 320.0f #define CELL_CONTENT_MARGIN 5.0f

IMPLEMENTATION:

 - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { if (indexPath.section == 0 && indexPath.row == 1) { NSString *text = [atmAnnotation address]; CGSize constraint = CGSizeMake(CELL_CONTENT_WIDTH - (CELL_CONTENT_MARGIN * 2), 20000.0f); CGSize size = [text sizeWithFont:[UIFont systemFontOfSize:FONT_SIZE] constrainedToSize:constraint lineBreakMode:UILineBreakModeWordWrap]; NSLog(@"Size for address is Height:%f Width:%f",size.height,size.width); CGFloat height = MAX(size.height, 44.0f); return height + (CELL_CONTENT_MARGIN * 2); } return 44.0f; }

Here is a screenshot of the result:

UITableView fixed

+8
ios uitableview ios4
source share
4 answers

Unfortunately, you have to implement this function yourself. There are many methods and callbacks that you must use to calculate the height of lines and labels. If you need help on startup, I can modify this answer to include some sample code. Otherwise, I'm sure there are some related questions regarding SO or Google that can help you get started. Nevertheless:

  • Determine the row height in the UITableViewDelegate -tableView:heightForRowAtIndexPath: method. You will probably have to use the NSString UIKit Adddition to calculate how tall your string is with a given font size, etc. Return the correct height from this delegate method.
  • Make sure your label (either in IB or configured programmatically) is configured to use multiple lines. If you set numberOfLines to 0, the label will use as many lines as necessary.
  • In your UITableViewDataSource implementation, -tableView:cellForRowAtIndexPath: you will need to use the same logic as before to define the frame of your labels. Set the desired text, and then change the frame so that the label is tall enough to barely fit the entire text.
+5
source share

Implement:

 - (float)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath;

in your delegate table. For different rows and sections in the passed indexPath, return a different height so that it matches your label.

Make sure that the label in IB is not set to "adjust to fit" (the adjustsFontSizeToFitWidth property, if done using code).

+1
source share

If you have an address like detailTextLabel, use a UILabel that supports as many lines as you need, for address 3 should be enough. With Paul Bently's answer, you should be good to go.

+1
source share

I ran into this problem. I found an alternative solution that does not require the same hard coding and allows you to make changes to the label in Interface Builder, which will be reflected in the calculation of the height.

 - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { if (indexPath.section == 0 && indexPath.row == 1) { NSString *text = [atmAnnotation address]; UITableViewCell* cell = [tableView dequeueReusableCellWithIdentifier:@"MyIdentifier"]; cell.textLabel.text = text; [cell.textLabel sizeToFit]; CGFloat height = MAX( 44, cell.textLabel.bounds.size.height ); return height + CELL_CONTENT_MARGIN * 2; } return 44.0f; }

The only drawback is that this will lead to some additional UITableViewCell time distributions, but the table view will immediately return them, so I don't think this should be a big problem.

0
source share

More articles:


All Articles