IOS 下拉放大头部背景图

先放效果图

效果图.gif

正常创建一个tableView

tableView不用masonry去创建。

 self.tableView = [[UITableView alloc] initWithFrame:[UIScreen mainScreen].bounds style:UITableViewStylePlain];
[self.view addSubview:_tableView];
_tableView.delegate = self;
_tableView.dataSource = self;
_tableView.contentInset = UIEdgeInsetsMake(200,0, 0, 0);
_tableView.showsHorizontalScrollIndicator = NO;
_tableView.showsVerticalScrollIndicator = NO;

其上面

_tableView.contentInset = UIEdgeInsetsMake(200,0, 0, 0);

设置tableview的内容偏移来给图片预留位置。

创建imageView

 _topImageView = [[UIImageView alloc] init];
_topImageView.frame = CGRectMake(0, -200, [UIScreen mainScreen].bounds.size.width, 200);
_topImageView.contentMode = UIViewContentModeScaleAspectFill;
_topImageView.image = [UIImage imageNamed:@"顶部图"];
_topImageView.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleWidth;
_topImageView.clipsToBounds = YES;
_topImageView.tag = 101;
[_tableView addSubview:_topImageView];

设置delagate

 -(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
        CGPoint point = scrollView.contentOffset;
         if (point.y < -200) {
         CGRect rect = [self.tableView viewWithTag:101].frame;
         rect.origin.y = point.y;
         rect.size.height = -point.y;
         [self.tableView viewWithTag:101].frame = rect;
         }
}

结语

要是tableView 预留的位置，跟图片错开的位置相同，我demo中的imageView 高 200。然后图片的contentMode 一定要是UIViewContentModeScaleAspectFill。