iOS开发 masonry 设置tableHeadView

33 篇文章 0 订阅
31 篇文章 0 订阅

转自:http://www.cnblogs.com/gaox97329498/p/5146965.html


      使用到到tableHeadView,一直习惯用masonry来设置约束,但是设置tableHeadView没有那么的简单。先看下效果图:

  

  

视图层次结构是这样的:

  

  基础的创建工程项目之类的就直接跳过,直接来分析:

  顶部的tableHeadView 是一个自定义的view,然后内部存在两个view 。我们设置如下:

    1> 创建一个ContainerView 继承自 UIView;

    2> 在ContainerView 添加子控件,设置Container 的底部约束

    3> 在设置tableView 的控制器处理

      •   tableView的基本设置:创建、添加到父视图、设置约束、数据源、代理等
      •       创建一个headView,来容纳带有约束的 ContainerView
      •       利用 systemLayoutSizeFittingSize:UILayoutFittingCompressedSize 计算出约束后的高度,然后设置给headView,
      •       设置tableHeadView = headView   

 

原因:

  tableHeadView是一个自适应的视图,本身就会适应,一般的方法,你如果利用frame 来设置,没有问题,

  如果你用masonry / AutoLayout 来设置的话,自定义顶部的视图会出现各种奇葩的问题(网上有人说这事tableView 的一个bug,你们可以尝试一下)。

  如果你自定义视图,那么建议你使用外部 用一个View 来包住,根据内部的约束,来反推外部frame的高度,然后设置给headView

 

具体代码实现如下:

复制代码
//
//  ContainerView.m
//  Masonry的内部视图视图
//
//  Created by admin on 16/1/20.
//  Copyright © 2016年 admin. All rights reserved.
//

#import "ContainerView.h"
#import "Masonry.h"

@interface ContainerView () {
    UITextView *_textView;
    UIButton *_selecteBtn;
}

@end


@implementation ContainerView
- (instancetype)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        [self setupUI];
    }
    return self;
}

- (void)setupUI {
    _textView = [[UITextView alloc] init];
    _selecteBtn = [UIButton buttonWithType:UIButtonTypeCustom];
    
    [self addSubview:_textView];
    [self addSubview:_selecteBtn];

    _textView.backgroundColor = [UIColor blueColor];
    [_textView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.right.equalTo(self);
        make.top.equalTo(self);
        make.height.equalTo(@50);
    }];
    
    _selecteBtn.backgroundColor = [UIColor purpleColor];
    [_selecteBtn mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(_textView.mas_bottom).offset(20);
        make.left.right.equalTo(self);
        make.height.equalTo(@50);
    }];
    
    [self mas_makeConstraints:^(MASConstraintMaker *make) {
        make.bottom.equalTo(_selecteBtn);
    }];
}

@end
复制代码

 

复制代码
//
//  ViewController.m
//  Masonry的内部视图视图
//
//  Created by admin on 16/1/20.
//  Copyright © 2016年 admin. All rights reserved.
//

#import "ViewController.h"
#import "ContainerView.h"
#import "Masonry.h"

@interface ViewController () <UITableViewDataSource,UITableViewDelegate>

@end

@implementation ViewController

- (void)viewDidLoad {
    
    [super viewDidLoad];
    UITableView *tableView =[[UITableView alloc]init];
    [tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"cellIdentifier"];
    tableView.dataSource =self;
    tableView.delegate =self;
    [self.view addSubview:tableView];
   
    [tableView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.right.bottom.equalTo(self.view);
        make.top.equalTo(self.view).offset(20);
    }];
    
    [tableView setNeedsLayout];
    [tableView layoutIfNeeded];
    
    
    UIView *headView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 1)];
    
    ContainerView *con = [[ContainerView alloc] init];
    con.backgroundColor = [UIColor blackColor];
    [headView addSubview:con];
    
    [con mas_makeConstraints:^(MASConstraintMaker *make) {
         make.edges.equalTo(headView);
    }];
    

    CGFloat height = [headView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;
    CGRect frame = headView.frame;
    frame.size.height = height;
    
    headView.frame = frame;

    tableView.tableHeaderView = headView;
    
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return 20;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"cellIdentifier"];
    cell.textLabel.text = [NSString stringWithFormat:@"%d",indexPath.row];
    return cell;
}

@end

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值