UITableView下拉头部图片放大效果

这个效果两个点就搞定:
1.headerView的图片模式为UIViewContentModeScaleAspectFill
2.监听scrollView滚动改变图片的高度

/* 状态栏高度 */
#define kStatusBarH     CGRectGetHeight([UIApplication sharedApplication].statusBarFrame)
/* NavBar高度 */
#define kNavigationBarH CGRectGetHeight(self.navigationController.navigationBar.frame)
/* 导航栏 高度 */
#define kNavigationH   (kStatusBarH + kNavigationBarH)

static CGFloat headerH = 200;


- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    [self.navigationController setNavigationBarHidden:YES animated:animated];
    
    if (@available(iOS 11.0, *)) {
        [[UIScrollView appearance] setContentInsetAdjustmentBehavior:UIScrollViewContentInsetAdjustmentNever];
    }
    
    self.statusBarStyle = UIStatusBarStyleLightContent;
}

- (void)viewWillDisappear:(BOOL)animated {
    [super viewWillDisappear:animated];
    
    [self.navigationController setNavigationBarHidden:NO animated:animated];
}

- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self.view addSubview:self.tableView];
    
    self.tableView.contentInset = UIEdgeInsetsMake(headerH, 0, 0, 0 );
    // 设置滚动指示器的位置
    self.tableView.scrollIndicatorInsets = self.tableView.contentInset;
    
    self.headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, headerH)];
    self.headerView.backgroundColor = [UIColor colorWithRed:247.00/255 green:247.00/255 blue:247.00/255 alpha:1];
    [self.view addSubview:self.headerView];
    
    self.headerImageView = [[UIImageView alloc] initWithFrame:self.headerView.bounds];
    self.headerImageView.clipsToBounds = YES;
    self.headerImageView.contentMode = UIViewContentModeScaleAspectFill;
    self.headerImageView.image = [UIImage imageNamed:@"10"];
    
    [self.headerView addSubview:self.headerImageView];
    
}

- (UIStatusBarStyle)preferredStatusBarStyle {
    return self.statusBarStyle;
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView  {
    
    CGFloat offset = scrollView.contentOffset.y + scrollView.contentInset.top;

    if (offset <= 0) { // 下拉

        self.headerView.y = 0;
        self.headerView.height = headerH - offset;
        self.headerImageView.alpha = 1;
        
    }else { // 上拉
        
        self.headerView.height = headerH;

        // 设置headerView 最小Y值 模拟导航栏
        CGFloat minY = headerH - kNavigationH;
        self.headerView.y = -MIN(minY,offset);
        
        // 设置透明度
        CGFloat scale = 1 - (offset / minY);
        self.headerImageView.alpha = scale;
        
        // 设置状态栏
        self.statusBarStyle = scale < 0.5 ? UIStatusBarStyleDefault : UIStatusBarStyleLightContent;
        [self.navigationController setNeedsStatusBarAppearanceUpdate];
    }
    
    self.headerImageView.height = self.headerView.height;
}


- (UITableView *)tableView {
    if (!_tableView) {
        _tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:(UITableViewStylePlain)];
        _tableView.dataSource = self;
        _tableView.delegate = self;
        
        [_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:cellId];
    }
    return _tableView;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 20;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath  {
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellId forIndexPath:indexPath];
    
    cell.textLabel.text = @(indexPath.row).stringValue;
    
    return cell;
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,255评论 4 61
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,548评论 25 708
  • 流光容易把人抛,转眼已是春天的尾巴。 又读苏轼的《定风波·莫听穿林打叶声》,少年时并不能体会词中的意思,并不能体会...
    13先生_阅读 352评论 0 5
  • 前些日子,深圳有个校长到我工作的学校讲学,介绍他治下的学校推行综合实践课程的做法和经验。谈及学校老师起初不接受他的...
    英国熊阅读 276评论 0 1
  • 我是谁?我对哪些事情感兴趣?我有哪些经验、技能、天赋? 我的价值观和人生终极目标是什么?我有哪些个性和优势? 我拥...
    做好基本面提高概率阅读 757评论 0 1