Masonry 和 FDTemplateLayoutCell 搭配使用之 UITableview 自适应内容高度(iOS)
mxvl3077
8年前
<h2>准备:</h2> <p><strong>1.FDTemplateLayoutCell</strong></p> <ul> <li> <p>由sunny大神出品的自动计算UITableviewCell高度</p> <a href="/misc/goto?guid=4958873479117876841" rel="nofollow,noindex">FDTemplateLayoutCell_下载</a></li> </ul> <p style="text-align:center"><img src="https://simg.open-open.com/show/cbdc5859a7e5241cb3eca8ad154a1153.png"></p> <p style="text-align:center"><img src="https://simg.open-open.com/show/09ccb10c9ea70e3b81958e03d61292ef.gif"></p> <p><strong>2.Masonry</strong></p> <ul> <li> <p>目前最流行的AutoLayout框架,比较轻量级</p> <a href="/misc/goto?guid=4958877303436721101" rel="nofollow,noindex">Masonry_下载</a></li> </ul> <p>将上述两个第三方下载后(或者使用Cocoapods)导入工程,然后创建所需文件,此时的工程目录:</p> <p style="text-align:center"><img src="https://simg.open-open.com/show/215f4f7b7820d544d9f3e1c70721b103.jpg"></p> <h3>自定义UITableView</h3> <p>MyTableViewCell.h 创建Model属性,用来传值</p> <pre> <code class="language-objectivec">#import <UIKit/UIKit.h> #import "Model.h" @interface MyTableViewCell : UITableViewCell @property (nonatomic, strong)Model *model; @end</code></pre> <p>MyTableViewCell.m 使用Masonry布局</p> <pre> <code class="language-objectivec">#import "MyTableViewCell.h" #import "Masonry.h" @implementation MyTableViewCell{ UILabel *_textLB; } - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{ self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]; if (self) { [self createSubViews]; } return self; } /** * 注意,不管布局多复杂,一定要有相对于cell.contentView的bottom的约束 */ - (void)createSubViews{ _textLB = [UILabel new]; _textLB.backgroundColor = [UIColor orangeColor]; _textLB.numberOfLines = 0; [self.contentView addSubview:_textLB]; [_textLB mas_makeConstraints:^(MASConstraintMaker *make) { make.top.left.equalTo(self.contentView).offset(10); make.bottom.right.equalTo(self.contentView).offset(-10); }]; } /** * 赋值 * * @param model ViewController传递过来的Model用来赋值 */ - (void)setModel:(Model *)model{ if (_model != model) { _model = model; _textLB.text = [NSString stringWithFormat:@"%@", model.text]; } }</code></pre> <h3>Model数据模型</h3> <p>Model.h 创建数据属性</p> <pre> <code class="language-objectivec">#import <Foundation/Foundation.h> @interface Model : NSObject @property (nonatomic, copy)NSString *text; @end</code></pre> <p>Model.m (使用KVC时,如果代码中的key值不存在,会抛出异常,可以在类中通过重写它提供下面的这个方法来解决这个问题)</p> <pre> <code class="language-objectivec">#import "Model.h" @implementation Model - (void)setValue:(id)value forUndefinedKey:(NSString *)key{ } @end</code></pre> <p>###ViewController视图控制器</p> <p>ViewController.h</p> <pre> <code class="language-objectivec">#import <UIKit/UIKit.h> @interface ViewController : UIViewController @end</code></pre> <p>ViewController.m 创建列表视图,并实现自适应高度</p> <pre> <code class="language-objectivec">#import "ViewController.h" #import "MyTableViewCell.h" #import "Model.h" #import "UITableView+FDTemplateLayoutCell.h" @interface ViewController ()<UITableViewDataSource, UITableViewDelegate> @end @implementation ViewController{ NSMutableArray *_allDataArr; } - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. self.view.backgroundColor = [UIColor lightGrayColor]; [self initailData]; [self createMianViews]; } - (void)initailData{ _allDataArr = [NSMutableArray array]; /** * 虚拟数据 */ for (NSInteger i = 0; i < 3; i++) { Model *model = [Model new]; model.text = @"在东方世界里,挑选小公牛到竞技场角斗有一定的程序。每一头被带进场地的公牛都要向手持长矛刺它的斗牛士发起进攻。其勇敢程度是根据它不顾矛刃的刺痛向斗牛士进攻的次数来认真评定的"; [_allDataArr addObject:model]; } } - (void)createMianViews{ UITableView *myTableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStyleGrouped]; myTableView.backgroundColor = [UIColor whiteColor]; myTableView.delegate = self; myTableView.dataSource = self; myTableView.fd_debugLogEnabled = YES; //打开自适应高度debug模式 [self.view addSubview:myTableView]; [myTableView registerClass:[MyTableViewCell class] forCellReuseIdentifier:@"cell"]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } #pragma mark -UITableViewDataSource - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ MyTableViewCell *cell = (MyTableViewCell *)[tableView dequeueReusableCellWithIdentifier:@"cell" forIndexPath:indexPath]; [self setupModelOfCell:cell AtIndexPath:indexPath]; return cell; } - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ return _allDataArr.count; } #pragma mark -UITableViewDelegate - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{ return [tableView fd_heightForCellWithIdentifier:@"cell" cacheByIndexPath:indexPath configuration:^(id cell) { [self setupModelOfCell:cell AtIndexPath:indexPath]; }]; } #warning 重点(自适应高度必须实现) //预加载Cell内容 - (void)setupModelOfCell:(MyTableViewCell *)cell AtIndexPath:(NSIndexPath *)indexPath{ cell.model = [_allDataArr objectAtIndex:indexPath.row]; } @end</code></pre> <h3>运行结果:</h3> <p style="text-align:center"><img src="https://simg.open-open.com/show/9a33d61600c202f9c572bbd2c0703b3e.jpg"></p> <h3>重点:</h3> <p style="text-align:center"><img src="https://simg.open-open.com/show/93da768e625a4c2f577ba773e3fa9d95.jpg"></p> <h3>复杂视图:</h3> <p style="text-align:center"><img src="https://simg.open-open.com/show/6b9c312d2834e96224132c611af75ade.jpg"></p> <p> </p> <p>来自:https://github.com/ShowJoy-com/showjoy-blog/issues/24</p> <p> </p>