美文网首页每日一篇程序员
iOS UITableView---HeaderView 实现

iOS UITableView---HeaderView 实现

作者: 会飞的大马猴 | 来源:发表于2017-03-06 15:46 被阅读774次

闲来无事,看到之前做的app有这个效果,但不是我写的,就动手撸了一撸,以为很简单,发现点小问题。话不多说,看下效果

效果图

1.gif

思路(不对的)

一开始我是这样做的
1.实例化一个UIImageView 对象,设置给tableView的tableHeaderView。
2.通过UIScrollView 的代理方法 来改变那个ImageView 的frame。

现实是--这样根本不行,首先无论你设置的width 是多少 headerView的宽 都是屏幕的宽度,所以 当ScrollView 的代理方法走的时候 我去设置 frame ,ImageView 的宽度是不变的。。。即使设置的contentMode 也有问题。而且效果并不好。后来我在ImageView的后面加了一个父识图, 这回就好了。

------------------------分割线(不哔哔)--------------------------

直接上代码

1.初始化

- (void)viewDidLoad {
    [super viewDidLoad];
 
    _tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) style:UITableViewStylePlain];
    UIImageView *headView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"1"]];
    //headView.contentMode =UIViewContentModeScaleAspectFit;
    headView.frame = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 300);
    _headView = headView;

    UIView *back = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 300)];
    back.backgroundColor = [UIColor redColor];
    [back addSubview:_headView];
    
    //设置headerView
    _tableView.tableHeaderView = back;;
    _tableView.delegate = self;
    _tableView.dataSource = self;
    [_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"cell"];
    [self.view addSubview:_tableView];   
}

2.通过UIScrollView的代理方法 去改变back视图上子视图的frame

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat width = [UIScreen mainScreen].bounds.size.width;
    CGFloat yOffset = scrollView.contentOffset.y  ;
    if (yOffset < 0) {
        CGFloat totalOffset = 300 + ABS(yOffset);
        CGFloat f = totalOffset / 300;
        _headView.frame = CGRectMake(- (width * f - width) / 2, yOffset, width * f, totalOffset);
    }
}

相关文章

网友评论

本文标题:iOS UITableView---HeaderView 实现

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