关于tableView头部视图下拉缩放的效果

在开发过程中,很多小伙伴会遇到页面不需要导航栏,然后tableView上面有一个headerView,但是实际上又好像不是headerView,因为headerView随着tableView下拉之后会顶部会出现断层的现象如下图:

这样的断层就很不和谐,如果能做到上面不出现断层,是不是会更美观一点呢,所以这样时候就想着如果下拉的时候只是等比拉伸该多好啊是不是想要这种效果呢如图松手的时候还会弹回具有弹性

没有拉伸的时是这样子的:

完美,思路是怎样的呢,要想随着滚动

思路一:那就要么是tableView的头部,但是会出现断层现象

思路二:不是taleView头部固定在父视图上,但是这样不会出现缩放和一起滚动的效果

吧两个方案综合一下,我们固定在父视图上,让头部随着tableView滚动的时候改变高度即可做到头部缩放的效果咯;

- (void)scrollViewDidScroll:(UIScrollView*)scrollView 在这个方法里面控制

要想下拉之后tableView还有弹性,那么久需要在tableView的contentInset这个属性上做文章了,我们设置它的contentInset 为_

tabView.contentInset = UIEdgeInsetsMake(topHeight, 0, 0, 0);  

_tabView.scrollIndicatorInsets = _tabView.contentInset;

 topHeight是你头部视图的高度,这样你下拉的时候tableView就会有弹性了

然后在滚动的方法里面改变头部视图的高度

这一块是核心地方 解释一下为什么偏移量不是contentOffset.y  为什么要加上 scrollView.contentInset.top; 因为开始我们设置了tableView的偏移量

所以综上所述,就两步,第一设置tableView的偏移量,第二在滚动的时候让头部视图跟随一起缩放,当然记得设置图面的contentMode属性,否则是不会缩放的哦

_topBackView.contentMode = UIViewContentModeScaleAspectFill;

好了,这就是我开发中遇到的一点小问题然后自己总结了一下怎么处理的方法,其实细心的小伙伴会发现这样所貌似会和tableView的下拉刷新方法出现冲突,这里留给各位小伙伴思考一下哦。下次做解答!

你可能感兴趣的:(关于tableView头部视图下拉缩放的效果)