美文网首页
AutoLayout自动布局cell

AutoLayout自动布局cell

作者: json_jie | 来源:发表于2016-02-21 19:50 被阅读206次

注意:
autoLayout 可以在- (void)viewDidAppear:(BOOL)animated 可以获取到正确的frame。

  1. 自动布局下Autolayout 一直是一个难点
  2. 自己前些天写这个时候(虽然写过好多次),被一个问题没注意的小地方困扰好长时间,所以打算记录下这点,也算为自己提一个醒
  3. 话不多说,上图,上代码
  4. 本人比较懒,用的是IB拖拽的方式
  5. 非常记忆忧心的一点当我初次用自动布局的方式计算cell的高度时候发现好多网上的domo都有这样那样的问题,没有给关键点写出来,今天闲来无聊打算写一下这个问题,希望大家共勉,对与错希望大家教育
    <p>

Snip20160221_2.png


这里做个说明 明确宽度 这个宽度只对适合创建XIB的宽度起作用
Snip20160221_3.png

Snip20160221_5.png

Snip20160221_6.png

Snip20160221_7.png


<p>

下面是主要代码

     #import "ViewController.h"
     #import "CustomTableViewCell.h"
     #import "CustomTwoTableViewCell.h"
     @interface ViewController ()<UITableViewDelegate,UITableViewDataSource>
     @property (weak, nonatomic) IBOutlet UITableView *_tableList;
     @property(nonatomic,retain)NSMutableArray *dataArray;
     @property(nonatomic,retain)CustomTableViewCell *cell;
     @property(nonatomic,retain)CustomTwoTableViewCell *twoCell;
     @end


     @interface Model : NSObject
     @property(nonatomic,retain)NSString *title;
     @property(nonatomic,retain)NSString *content;
     @property(nonatomic,retain)NSString *contentTwo;
     @end
     @implementation Model



     @end

     @implementation ViewController

     - (void)viewDidLoad {
         [super viewDidLoad];
        self.dataArray = [[NSMutableArray alloc] initWithCapacity:0];
         for (int i = 0; i < 10; i++) {
             Model *model = [[Model alloc] init];
             if (i%5 == 1) {
                 model.title = @"杀寇决等哈就坑阿达就开始打哈看得见哈杀就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几到几哈接电话";
                 model.content = @"的交伙食费就开始放暑假上放暑假的刚就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几时间各回各家时间看刚换时间供货商看估计是司空见惯和世界观海口市个机会可是供货商髋关节还是个开奖号工商局和顾客极光谁开个机是";
                 model.contentTwo = @"Test开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑";
                 [self.dataArray addObject:model];
             }else if (i%5 == 2){
                 model.title = @"杀寇决等哈就坑阿达就开始打哈就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几哈杀到几哈接电话";
                 model.content = @"的交伙食费就开始放暑假上放暑假的刚换时间就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几各家时间看刚换时间供货商看估计是司空见惯和世界观海口市个机会可是供货商髋关节还是个开奖号工商局和顾客极光谁开个机是";
                   model.contentTwo = @"Test开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑";
                 [self.dataArray addObject:model];
             }else if (i%5 == 3){
                 model.title = @"杀寇决等哈就坑阿达就开始打";
                 model.content = @"的交伙食费就开始放暑假上放暑假的刚换时间各回各家时间看刚换时间供货商看估计是司空见惯和世界观海口市个机会可是供货商髋关节还是个开奖号工商局和顾客极光谁开个机是";
                 model.contentTwo = @"Test开始放暑假上放始放暑假上放暑开开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始始放暑假上放暑开始放暑假上放暑开始放暑假上开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑";
                 [self.dataArray addObject:model];
             }else if (i%5 == 4){
                 model.title = @"杀寇决等哈就坑阿接电话";
                 model.content = @"的交伙食费就开始";
                 model.contentTwo = @"Test开始放开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始开始放暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始暑假上放始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑开始放暑假上放暑";
                 [self.dataArray addObject:model];
             }else{
                 model.title = @"杀寇决等哈就坑阿达就开始打哈看得见哈杀到几哈接电话";
                 model.content = @"的交伙食费就开始放暑就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几就坑阿达就开始打哈看得见哈杀到几假上放暑假的刚换时间各回各家时间看刚换时间供货商看估计是司空见惯和世界观海口市个机会可是供货商髋关节还是个开奖号工商局和顾客极光谁开个机是";
                 model.contentTwo = @"Test开始放暑假上放始放暑";
                 [self.dataArray addObject:model];
             }
         }
         [self._tableList reloadData];

     }
     -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
     {
         return 2;
     }
     -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
     {
         return self.dataArray.count;
     }
     -(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
         if (indexPath.section == 0) {
             static NSString *str =@"CustomTableViewCell";
             self.cell = [tableView dequeueReusableCellWithIdentifier:str];
             if (self.cell == nil) {
                 self.cell = [[[NSBundle mainBundle]loadNibNamed:@"CustomTableViewCell" owner:self options:nil]lastObject];
             }
             self.cell.selectionStyle = UITableViewCellSelectionStyleNone;
    Model *model = [self.dataArray objectAtIndex:indexPath.row];
             self.cell.titleLabel.text = model.title;
             self.cell.contentLabel.text = model.content;
             return self.cell;

         }else{
             static NSString *str =@"CustomTwoTableViewCell";
             self.twoCell = [tableView dequeueReusableCellWithIdentifier:str];
             if (self.twoCell == nil) {
                 self.twoCell = [[[NSBundle mainBundle]loadNibNamed:@"CustomTwoTableViewCell" owner:self options:nil]lastObject];
    }
             self.twoCell.selectionStyle = UITableViewCellSelectionStyleNone;
             Model *model = [self.dataArray objectAtIndex:indexPath.row];
             self.twoCell.title.text = model.title;
             self.twoCell.content.text = model.content;
             self.twoCell.twoContent.text = model.contentTwo;
             return self.twoCell;
         }         
     }
     -(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
     {
         CGFloat preMaxWaith =[UIScreen mainScreen].bounds.size.width - 25;
         if (indexPath.section  == 0) {
             Model *model = [self.dataArray objectAtIndex:indexPath.row];
             self.cell.titleLabel.text = model.title;
             self.cell.contentLabel.text = model.content;
             [self.cell.titleLabel setPreferredMaxLayoutWidth:preMaxWaith];
             [self.cell.contentLabel setPreferredMaxLayoutWidth:preMaxWaith];
             [self.cell setNeedsUpdateConstraints];
             [self.cell updateConstraintsIfNeeded];
             CGFloat height = [self.cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height+1;
             return height;
         }else{
             Model *model = [self.dataArray objectAtIndex:indexPath.row];
             self.twoCell.title.text = model.title;
             self.twoCell.content.text = model.content;
             self.twoCell.twoContent.text = model.contentTwo;
             [self.twoCell.title setPreferredMaxLayoutWidth:preMaxWaith];
             [self.twoCell.content setPreferredMaxLayoutWidth:preMaxWaith];
             [self.twoCell.twoContent setPreferredMaxLayoutWidth:preMaxWaith];
             [self.twoCell setNeedsUpdateConstraints];
             [self.twoCell updateConstraintsIfNeeded];
             CGFloat height = [self.twoCell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height+1;
             return height;
         }
     }
     @end

<p>

请看效果

Snip20160221_11.png Snip20160221_12.png


<p>

说几点注意事项

  1.              CGFloat height = [self.cell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height+1;
    



为什么+1,他是cell分割线的高度 这个很重要

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



preMaxWaith 他是明确自动布局的的宽度

  1. 拖拽的布局约束有个非常重要的

    Snip20160221_9.png


    Snip20160221_10.png

    这个距离上下的边距要是不指定明确,可能出现cell的subview出现错位移动的情况

  2. 不管怎么样,这个自动布局的确方便了大家的Ui的布局绘制
  3. systemLayoutSizeFittingSize (6.0之后的API) 的效率是有一定的问题由于*** UITableView是一次性计算完所有Cell的高度***,如果你有1000个cell的数量,建议不要使用这个API,使用其他方式,如果的遇到了会在更新。。😄😄😄😄😄
  4. 当然图文混排用这个也没有问题
    <p>
    The last thing 附上github代码地址
    https://codeload.github.com/json-zhao/Blog_AutolayoutCell/zip/master

相关文章

网友评论

      本文标题:AutoLayout自动布局cell

      本文链接:https://www.haomeiwen.com/subject/plzvkttx.html