iOS UITableView---HeaderView 实现 下拉等比例放大(不是单纯的变长)

闲来无事,看到之前做的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 实现 下拉等比例放大(不是单纯的变长))