IOS 6.0+ Autolayout-uitableviewcell Height adjustment

• The effect to be achieved
• Requirements:
• Storyboard on the prep work
• Build the cell custom Autocell class, correlate the controls, and prepare some data sources beforehand.
• Implementation of the TableView method of delegation
• Core part, Heightforrow method implementation
• The specific calculation height method is now in the custom cell class
• A few important places to watch out for
• Test on the ios6.0

the effect to be achievedRequirements:

General Titlelabel displays only one row of headings, with a fixed height.

The ImageView size is also fixed.

The Detaillabel width is fixed, but the height is dynamically adjusted according to the text.

The bottom of the cell bottom imageview and the bottom height of the Detaillabel are greater than or equal to 20.

When the Detaillabel text is very small, the bottom of the cell refuses ImageView to maintain 20, when the bottom of Detaillabel is greater than 20.

When Detaillabel text is many, the cell bottom is more than 20 from the bottom of ImageView, and the bottom height of the Detaillabel maintains 20.

Storyboard on the prep work

Note Set Detaillabel numberoflines to 0

Build the cell custom Autocell class, correlate the controls, and prepare some data sources beforehand?

123

nameArray = [NSMutableArray arrayWithObjects:@"蜗壳",@"AI",@"大詹皇",nil];    imageArray = [NSMutableArray arrayWithObjects:@"u=4040080498,3072784853&fm=90&gp=0.jpg",@"u=2384677404,2895132414&fm=21&gp=0.jpg",@"u=262781505,2408318453&fm=21&gp=0.jpg", nil];    descriptionArray = [NSMutableArray arrayWithObjects:@"蜗壳打球好潇洒，好飘逸，铁王之王",@"AI，史上最矮状元，无冕之王，crossover简直厉害，观赏性强，永远的MVP!!!!",@"最年轻的一万分先生，MVP，奥布莱恩杯，效率之王，天之骄子，全宇宙最强的球员没有之一，强突暴扣身体棒，发际线又高了，关键时刻又耸了，带领骑士夺冠吧，虽然看起来还没戏！！！！！！", nil];

How to implement TableView?

1234567891011121314151617

//numberOfRows-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{    return3;}//cellForRow-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{        AutoTableViewCell *cell = (AutoTableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"autoCell"];    [cell.titleLabel setText:nil];    [cell.titleLabel setText:[nameArray objectAtIndex:indexPath.row]];    [cell.descriptionLabel setText:nil];    [cell.logoImageView setImage:[UIImage imageNamed:[imageArray objectAtIndex:indexPath.row]]];    [cell.descriptionLabel setText:[descriptionArray objectAtIndex:indexPath.row]];    returncell;}

Do not implement the Heightforrow method, run directly, found that the IOS7,IOS8 did not get the desired effect

IT ' S so bad!!!

Core part, Heightforrow method implementation?

1234567891011121314

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{    staticAutoTableViewCell *cell = nil;    staticdispatch_once_t onceToken;    //只会走一次    dispatch_once(&onceToken, ^{        cell = (AutoTableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"autoCell"];    });        //calculate    CGFloat height = [cell calulateHeightWithtTitle:[nameArray objectAtIndex:indexPath.row] desrip:[descriptionArray objectAtIndex:indexPath.row]];        returnheight;}

How is the calculated height method now in the custom cell class?

1234567891011121314

-(CGFloat)calulateHeightWithtTitle:(NSString*)title desrip:(NSString*)descrip{    //这里非常重要    CGFloat preMaxWaith =[UIScreen mainScreen].bounds.size.width-108;    [self.detailLabel setPreferredMaxLayoutWidth:preMaxWaith];    [self.titleLabel setText:title];    //这也很重要    [self.detailLabel layoutIfNeeded];    [self.detailLabel setText:descrip];    [self.contentView layoutIfNeeded];    CGSize size = [self.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize];    //加1是关键    returnsize.height+1.0f;}

A few important places to watch out for

• First of all, why do you want to set Preferredmaxlayoutwidth, which represents the maximum layout width of the label, the label shows how many lines are definitely related to its width, all here to set the correct width, but here's a bit of a pit place

This is storyboard on the Detaillabel of this property, the default is not checked (automatic) means the system automatically calculates the maximum layout width, but to view the official documents, you will find that the automatic calculation only in the iOS8 will have effect, less than iOS8 will not be automatically calculated. Then you might say, "Hook it up!!!"

, what do you mean when you find that the 492 is displayed after the tick? This number is the width of the currently used storyboard minus the absolute distance from the label to the two boundaries. The Xcode6 is a large size storyboard width of 600, minus the Detaillabel to the left boundary 98, minus 10 from the right edge, just 492.

But is that right? Obviously not, theiphone screen width is not already 3 kinds of width? 320, 375 (iphone6), 414 (plus)

So 600 is obviously wrong, should use the current running width to subtract 108, so here tick is wrong, simply do not tick the direct code to calculate it ....

?

1	CGFloat preMaxWaith =[UIScreen mainScreen].bounds.size.width-108;

• About layoutifneeded in the end is what, I also smattering, only know not add effect out, plan to consult later ...

• Plus 1 is the key.

?

12	[self.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize];returnsize.height+1.0f;

Here size.height is actually the height of the contentview we want, but if we return this height directly, we give the cell the height, but because of the cell boundary, thecell height is 1 more than the contentview height, So add 1 here and return. Do not underestimate the 1 pixels, less its effect is really not come out!!!!

Notice this, we run again, find the desired effect, switch the simulator, no problem.

Test on the ios6.0

No 6.0 simulator, find a 6.0 real machine, after the test effect

The height of the Detaillabel is always unchanged, maintained on one line, but it can be found that the cell height is correct, which seems to indicate that the Heightforrow method is not a problem, then Detaillabel why not automatically stretched it?

Check the code again, the original problem is in the Cellforrow method, because the height of the Detaillabel on each cell should be stretched to set the maximum layout width for each detaillabel: Preferredmaxlayoutwidth. All that was done was to get the cell that was used for the calculation in the Heightforrow. So I added a few lines of code.

?

12345678910111213141516

-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{        AutoTableViewCell *cell = (AutoTableViewCell*)[tableView dequeueReusableCellWithIdentifier:@"autoCell"];    [cell.titleLabel setText:nil];    [cell.titleLabel setText:[nameArray objectAtIndex:indexPath.row]];    //补上的几句，给用来显示的DetailLabel 设置最大布局宽度    CGFloat preMaxWaith =[UIScreen mainScreen].bounds.size.width-108;    [cell.detailLabel setPreferredMaxLayoutWidth:preMaxWaith];    [cell.detailLabel layoutIfNeeded];    [cell.detailLabel setText:nil];    [cell.logoImageView setImage:[UIImage imageNamed:[imageArray objectAtIndex:indexPath.row]]];    [cell.detailLabel setText:[descriptionArray objectAtIndex:indexPath.row]];    returncell;}

Run again, you can see the desired effect in the IOS6,

IT ' S Perfect!!!

In short, the study of the layout of a few days, found iOS good pit, a variety of traps, fortunately consulted a variety of domestic and foreign information, and ultimately achieve the effect.

Project Source: Https://github.com/zhangxh6931/AutolayoutCell

IOS 6.0+ Autolayout-uitableviewcell Height adjustment