现在似乎很多公司已经开始接受和使用Storyboard(简称SB),关于其中AutoLayout,开始学习的时候确实有很多不了解,经过自己的恶补,勉勉强强也算是精通了.
关于一些基础的AutoLayout的知识就不再赘述了,这里记录一下自己测试Demo时候需要注意到的技术点:那就是UITableViewCell的AutoLayout,传说中的自适应.
关于自适应,其实还是有多种方法可以达到的.例如计算image或label的高度,以及宽高比例,返回回去.
-(void)requestDataForReloadWithUrl:(NSString * )url Block:(SetImage)block
{
NSMutableArray * arraydata = [NSMutableArray arrayWithCapacity:10];
dispatch_async(dispatch_get_global_queue(0, 0), ^{
NSURL *url_Url = [NSURL URLWithString:url];
NSURLSession *session = [NSURLSession sharedSession];
NSMutableURLRequest *requset = [NSMutableURLRequest requestWithURL:url_Url];
NSURLSessionDataTask *task =[session dataTaskWithRequest:requset completionHandler:^(NSData * _Nullable data, NSURLResponse * _Nullable response, NSError * _Nullable error) {
if (data != nil) {
NSDictionary * dic = [NSJSONSerialization JSONObjectWithData:data options:NSJSONReadingAllowFragments error:nil];
NSArray * array = dic[@"body"][@"slides"];
for (NSDictionary * dic in array) {
CellHeightModel * model = [[CellHeightModel alloc]init];
// 存储图片路径
model.image = dic[@"image"];
// 等比缩放之后的高度
/**
* 根据屏幕的宽高比例去计算宽高比例 求出等比缩放之后的高度
X : 屏幕宽度 = 图片高度 : 图片宽度
X 缩放之后的高度
*/
CGFloat imageWidth = [dic[@"width"] floatValue];
CGFloat imageHeight = [dic[@"height"] floatValue];
CGFloat height = [UIScreen mainScreen].bounds.size.width * imageHeight / imageWidth;
model.height = height;
// 文本
model.kDescription = dic[@"description"];
// 文本高度
CGRect rect = [self getStringCGrectFromString:dic[@"description"]];
CGFloat textHeight = rect.size.height;
model.kDescriptionHeight = textHeight;
// cell单元格高度
model.cellHeight = model.height + model.kDescriptionHeight;
[arraydata addObject:model];
}
}
dispatch_async(dispatch_get_main_queue(), ^{
//在主线程中进行block结果回调
if (block) {
block(arraydata);
}
});
}];
[task resume];
});
}
-(CGRect)getStringCGrectFromString:(NSString *)str
{
/**
* (主要是将被iOS7 Deprecated的sizeWithFont:constrainedToSize:lineBreakMode:方法改成了boudingRectWithSize:options:attributes:context:方法来计算文本尺寸)
*
* @param mainScreen.bounds.size.width 屏幕宽度
* @param 10000.0f 最大高度
*
* @return 当前文本的矩形
*/
CGRect rect = [str boundingRectWithSize:CGSizeMake([UIScreen mainScreen].bounds.size.width, 10000.0f) options:NSStringDrawingUsesLineFragmentOrigin attributes:[NSDictionary dictionaryWithObject:[UIFont systemFontOfSize:17.5] forKey:NSFontAttributeName] context:nil];
return rect;
}
在cell.m文件中
-(void)setCellmodel:(CellHeightModel *)cellmodel
{
// 获取当前 cellHeightImg 的所有约束条件
// NSArray* constrains = self.cellHeightImg.constraints;
// // 遍历当前 cellHeightImg 的所有约束条件
// for (NSLayoutConstraint* constraint in constrains) {
// // 判断约束条件是否等于 高的约束条件
// if (constraint.firstAttribute == NSLayoutAttributeHeight) {
// // 修改约束条件中的高
// constraint.constant = cellmodel.imageNameHeight;
// }
// }
/**
* 其中的firstItem与secondItem分别是界面中受约束的视图与被参照的视图。他们不一定非得是兄弟关系或者父子关系,只要是他们有着共同的祖先视图即可,这一点是autoresizingMask无法做到的。
*** 在 UIView 中有一个autoresizingMask的属性,它对应的是一个枚举的值(如下),属性的意思就是自动调整子控件与父控件中间的位置,宽高
firstAttribute与secondAttribute分别是firstItem与secondItem的某个布局属性(NSLayoutAttribute):
*/
self.imgOfCellHeight.constant = cellmodel.height;
[self.cellHeightImg sd_setImageWithURL:[NSURL URLWithString:cellmodel.image]];
[self.cellHeightTextLable setText:cellmodel.kDescription];
}
最后在controller中调用
#pragma mark - 设置高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
// 从模型中取出当前cell的高度
CellHeightModel * cellModel = self.arrayData[indexPath.row];
return cellModel.cellHeight;
}
需要注意的是这个Demo是需要通过操作xib文件,拖动约束实现的
为什么要画出三条线呢,下面要说到的就是第二种方法了,代码量根本不是一个级别的,同时也点到了图片裁剪
例如此图,需求为图片等比例缩放,下面的新闻描述自适应高度.
我们完全可以通过操作xib,再加上那么几个小小的方法完成.
将imageView的约束条件设置为 上 0,左右 0,下 10;
label的约束条件则为左右 0,下10
//从model获取数据
-(void)loadDataWithModel:(CellModel *)model
{
UIImage *temp = model.img;
if (model.img.size.width > [UIScreen mainScreen].bounds.size.width) {
float scale = model.img.size.width / [UIScreen mainScreen].bounds.size.width;
float height = model.img.size.height/scale;
CGSize size = CGSizeMake([UIScreen mainScreen].bounds.size.width, height);
temp = [self imageWithImageSimple:model.img scaledToSize:size];
}
self.img.image = temp;
self.img.contentMode = UIViewContentModeScaleAspectFit;
self.detailLabel.text = model.descrip;
}
重点就是这两个方法
#pragma mark - 裁剪图片
- ( UIImage *)imageWithImageSimple:( UIImage *)image scaledToSize:( CGSize )newSize
{
// Create a graphics image context
UIGraphicsBeginImageContext (newSize);
// Tell the old image to draw in this new context, with the desired
// new size
[image drawInRect : CGRectMake ( 0 , 0 ,newSize. width ,newSize. height )];
// Get the new image from the context
UIImage * newImage = UIGraphicsGetImageFromCurrentImageContext ();
// End the context
UIGraphicsEndImageContext ();
// Return the new image.
return newImage;
}
然后再控制器调用此方法就OK了!
self.tableView.estimatedRowHeight = 44;
self.tableView.rowHeight = UITableViewAutomaticDimension;