ios -- 拉动view头像背景变大效果

一、问题分析

  有时候,我们在做程序的时候拉动tableView,头像的背景图会变大,给人一种动态的效果,我在做项目的时候自己整理了一下,希望能跟大家一起交流一下.

二、代码

1.添加头像的背景

-(UIImageView *)backImageView
{
    if (!_backImageView)
    {
        _backImageView = [UIImageView new];
        _backImageView.backgroundColor = [UIColor clearColor];
        _backImageView.image = [UIImage imageNamed:@"首页_默认头像"];
        _backImageView.frame = CGRectMake(0, -200 * SCALES,SCREEN_WIDTH,200 * SCALES);
        _backImageView.clipsToBounds = YES;
        UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleExtraLight];
        _effectView = [[UIVisualEffectView alloc] initWithEffect:effect];
        _effectView.frame = _backImageView.bounds;
        _effectView.alpha = 0.50f;
        [_backImageView addSubview:_effectView];
        
    }
    return _backImageView;
}

2.tableView

-(UITableView *)tableView
{
    if (!_tableView)
    {
        _tableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height - 49) style:UITableViewStyleGrouped];
        _tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
        _tableView.delegate = self;
        _tableView.dataSource = self;
        _tableView.showsHorizontalScrollIndicator = NO;
        _tableView.showsVerticalScrollIndicator = NO;
        _tableView.contentInset = UIEdgeInsetsMake(200* SCALES,0,0,0);
        [self.view addSubview:_tableView];
    }
    return _tableView;
}

3.tableview滚动时要背景图片等比放大

#pragma mark -- 滚动视图的代理方法
- (void)scrollViewDidScroll:(UIScrollView*)scrollView{
    /**
     *  关键处理：通过滚动视图获取到滚动偏移量从而去改变图片的变化
     */
    //获取滚动视图y值的偏移量
    CGFloat yOffset  = scrollView.contentOffset.y;
    CGFloat xOffset = (yOffset +200)/2;
    
    if(yOffset < -200) {
        CGRect frame =self.headImageView.frame;
        frame.origin.y= yOffset ;
       frame.size.height=  -yOffset;
       frame.origin.x= xOffset;
       frame.size.width=SCREEN_WIDTH + fabs(xOffset)*2;
        self.backImageView.frame= frame;
        self.coverImageView.frame = frame;
        _effectView.frame = self.backImageView.bounds;
    }
}

4.头像底部的View

-(UIView *)detailView
{
    if (!_detailView)
    {
        _detailView = [[UIView alloc]initWithFrame:CGRectMake(0, -200 * SCALES,SCREEN_WIDTH,200 * SCALES)];
        _detailView.backgroundColor = [UIColor clearColor];
       
    }
    return _detailView;
}

5.头像视图

-(UIImageView *)headImageView
{
    if (!_headImageView)
    {
        _headImageView = [UIImageView new];
        _headImageView.image = [UIImage imageNamed:@"首页_默认头像"];
        _headImageView.backgroundColor = [UIColor clearColor];
          _headImageView.frame = CGRectMake(0, 63 * SCALES, 75 * SCALES, 75*SCALES);
        CGPoint point =  _headImageView.center;
        point.x = self.view.center.x;
         _headImageView.center = point;
        _headImageView.layer.cornerRadius = 37.5 * SCALES;
        _headImageView.clipsToBounds = YES;
        [self.detailView addSubview:_headImageView];
    }
    return _headImageView;
}

6.viewDidLoad里面添加视图

    [self headImageView];

   [self.tableView addSubview:self.backImageView];
    [self.tableView addSubview:self.coverImageView];
    [self.tableView addSubview:self.detailView];

三、总结

因为开发时间的原因,代码方面还没有来得及简化,希望对需要的朋友有所帮助