iOS导航条自由缩放实现

今天正好有时间教大家很常见的一个效果。这也是笔者第一次写博客，后面会不定期的更新内容。好了，话不多说，进入正题吧。

其实实现此此效果很简单。只需要几行代码就可以搞定。

在很多的App中，其实都有这样的需求，上下滚动时候，要其头像也跟着发生相应的变化（用户头像是在系统的导航条）。以前有朋友问过我，可能有的朋友会尝试自定义导航view。其实是没有必要的，之间使用系统自带的导航即可！

通过此片学习，您将学习一下知识点：

  1.如何分析实现原理

  2.如何实现缩放效果

  3.如何讲计算缩放系数

效果图

实现原理

- (void)configUI{    _tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStylePlain];    _tableView.dataSource = self;    _tableView.delegate = self;    [_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"UITableViewCell"];    [self.view addSubview:_tableView];       UIView *titleView = [[UIView alloc] init];    self.navigationItem.titleView = titleView;    _headerImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"header.jpg"]];    _headerImageView.frame = CGRectMake(0, 0, 70, 70);    _headerImageView.layer.masksToBounds = YES;    _headerImageView.layer.cornerRadius = 35;    _headerImageView.center = CGPointMake(titleView.center.x, 0);    [titleView addSubview:_headerImageView];}这里主要是创建表格和titleView，估计你们也看到了我为什么不把imageView直接作为titleVIew，而是我自定义一个view，这样做的好处就是因为titleView会自动被系统设置大小的，而正常情况下，我们的头像是有自己的大小。接下来就是最关键的地方了，直接上代码
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {    if ([scrollView isEqual:self.tableView]) {        CGFloat offsetY = self.tableView.contentOffset.y + self.tableView.contentInset.top;        CGFloat scale = 1.0;        if (offsetY < 0) {// 放大            // 允许下拉放大的最大距离为250            scale = MIN(1.5, 1 - offsetY / 250);        } else if (offsetY > 0) { // 缩小            // 允许向上超过导航条缩小的最大距离为250            scale = MAX(0.4, 1 - offsetY / 250);        }        self.headerImageView.transform = CGAffineTransformMakeScale(scale, scale);    }}估计大家看到这里，都明白了，那我就不多说了
小结
阅读完本篇文章，笔者相信大家都可以熟练掌握了，其实就几行代码的事情呀，是不是很简单呢？
源代码
本篇文章对应的源代码下载地址：https://github.com/WSmalan/WSScaleHeaderImage